/* =========================================================
   Thirukkural Home (new) - Oneindia Tamil (Desktop)
   Used by web/thirukkural-home-new, thirukkural-adhikaram-new and thirukkural-landing-new templates
   ========================================================= */

.thirukkural-wrapper {
    --tk-heading: #111827;
    --tk-text: #28313a;
    --tk-muted: #787878;
    --tk-crumb: #595959;
    --tk-placeholder: #9ca3af;
    --tk-cream: #fffcf5;
    --tk-cream-border: #f0e8d3;
    --tk-border: #e5e7eb;
    --tk-row-alt: #f8fcfd;
    --tk-row-head: #eaedee;
    --tk-field-bg: #f9fbfd;
    --tk-teal: #0d5c63;
    --tk-teal-dark: #013332;
    --tk-btn-bg: #f7f7f7;
    --tk-today-bg: #f7eee2;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--tk-text);
}
.thirukkural-wrapper a {color: inherit;text-decoration: none;}
.thirukkural-wrapper :where(ul, ol, dl, dd, p) {list-style: none;margin: 0;padding: 0;}
.thirukkural-wrapper .clearfix:after {content: "";display: table;clear: both;}
.thirukkural-wrapper .oi-left {width: 650px;float: left;margin-bottom: 36px;}
.thirukkural-wrapper .oi-right {width: 300px;float: right;}

/* ---------- Page head ---------- */
.thirukkural-breadcrumb {font-size: 14px;line-height: 30px;color: var(--tk-crumb);margin-bottom: 12px;}
.thirukkural-breadcrumb a {color: var(--tk-crumb);}
.thirukkural-breadcrumb a:hover {text-decoration: underline;}
.thirukkural-breadcrumb .thirukkural-crumb-sep {margin: 0 8px;}
.thirukkural-title {font-size: 24px;line-height: 30px;font-weight: bold;color: var(--tk-heading);margin-bottom: 4px;}
.thirukkural-subtitle {font-size: 16px;line-height: 24px;color: var(--tk-crumb);margin-top: 8px;}
.thirukkural-intro {margin-top: 12px;}
.thirukkural-intro-text {font-size: 16px;line-height: 30px;color: var(--tk-text);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.thirukkural-intro.is-expanded .thirukkural-intro-text {display: block;-webkit-line-clamp: unset;}
.thirukkural-readmore {display: inline-block;margin-top: 4px;font-size: 14px;line-height: 24px;font-weight: bold;color: var(--tk-text);cursor: pointer;background: none;border: 0;padding: 0;font-family: inherit;}
.thirukkural-readmore:hover {text-decoration: underline;}

/* ---------- Search ---------- */
.thirukkural-search {position: relative;margin-top: 24px;height: 44px;background: var(--tk-field-bg);border: 1px solid var(--tk-border);border-radius: 45px;box-sizing: border-box;}
.thirukkural-search-icon {position: absolute;left: 21px;top: 50%;width: 21px;height: 20px;margin-top: -10px;background: url(../images/thirukkural/new/search-icon.svg) no-repeat center / 21px 20px;}
.thirukkural-search-input {width: 100%;height: 100%;border: 0;background: transparent;outline: none;padding: 0 20px 0 56px;box-sizing: border-box;font-family: inherit;font-size: 14px;color: var(--tk-heading);}
.thirukkural-search-input::placeholder {color: var(--tk-placeholder);}

/* ---------- Paal tabs ---------- */
.thirukkural-tabs {display: flex;margin-top: 18px;padding: 3px;background: #f0f0f0;border-radius: 45px;}
.thirukkural-tab {flex: 1;height: 38px;border: 0;border-radius: 45px;background: transparent;font-family: inherit;font-size: 16px;line-height: 24px;color: #7d7b7b;cursor: pointer;}
.thirukkural-tab.active {background: var(--tk-teal);color: #fff;}

/* ---------- Adhikaram dropdown ---------- */
.thirukkural-select-label {font-size: 14px;line-height: 27px;color: var(--tk-placeholder);margin-top: 14px;}
.thirukkural-select {position: relative;margin-top: 4px;}
.thirukkural-select-toggle {display: flex;align-items: center;justify-content: space-between;width: 100%;height: 46px;padding: 0 13px 0 20px;box-sizing: border-box;background: var(--tk-field-bg);border: 1px solid var(--tk-border);border-radius: 6px;font-family: inherit;font-size: 14px;color: var(--tk-heading);cursor: pointer;text-align: left;}
.thirukkural-select-arrow {width: 24px;height: 24px;background: url(../images/thirukkural/new/arrow-down.svg) no-repeat center / 24px 24px;transform: rotate(-90deg);transition: transform 0.2s;}
.thirukkural-select.is-open .thirukkural-select-arrow {transform: rotate(90deg);}
.thirukkural-select-list {display: none;position: absolute;left: 0;right: 0;top: 50px;z-index: 20;max-height: 280px;overflow-y: auto;background: #fff;border: 1px solid var(--tk-border);border-radius: 6px;box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);}
.thirukkural-select.is-open .thirukkural-select-list {display: block;}
.thirukkural-select-list li a {display: block;padding: 10px 20px;font-size: 14px;line-height: 20px;color: var(--tk-heading);}
.thirukkural-select-list li a:hover,
.thirukkural-select-list li a.active {background: var(--tk-cream);}

/* ---------- Section headings ---------- */
.thirukkural-section {margin-top: 40px;}
.thirukkural-section-title {font-size: 22px;line-height: 30px;font-weight: bold;color: var(--tk-heading);margin-bottom: 18px;}
.thirukkural-section-title.small {font-size: 18px;color: var(--tk-text);}
.thirukkural-section-desc {font-size: 16px;line-height: 30px;color: var(--tk-text);margin: -8px 0 18px;}

/* ---------- Number badge ---------- */
.thirukkural-num {flex: 0 0 39px;width: 39px;height: 39px;line-height: 39px;text-align: center;font-size: 16px;font-weight: bold;color: var(--tk-text);background: url(https://imagesvs.oneindia.com/db-common/images/thirukkural/num-circle.svg) no-repeat center / 39px 39px;}

/* ---------- Kural list (Home) ---------- */
.thirukkural-list-head {display: flex;align-items: center;height: 57px;padding: 0 20px;margin-bottom: 14px;background: var(--tk-cream);border: 1px solid var(--tk-cream-border);border-radius: 12px;font-size: 16px;font-weight: bold;color: var(--tk-text);box-sizing: border-box;}
.thirukkural-list-head span:first-child {width: 127px;}
.thirukkural-list li + li {margin-top: 16px;}
.thirukkural-row {position: relative;display: flex;align-items: center;min-height: 80px;padding: 10px 40px 10px 41px;box-sizing: border-box;background: var(--tk-cream);border: 1px solid var(--tk-cream-border);border-radius: 12px;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);}
.thirukkural-row .thirukkural-num {margin-right: 65px;}
.thirukkural-row-text {font-size: 16px;line-height: 30px;font-weight: bold;color: var(--tk-text);}
.thirukkural-chevron {position: absolute;right: 16px;top: 50%;width: 6px;height: 10px;margin-top: -5px;background: url(https://imagesvs.oneindia.com/db-common/images/thirukkural/chevron-right.svg) no-repeat center / 5.2px 9.2px;transform: rotate(180deg);}
.thirukkural-row:hover {border-color: #e3d4ab;}

/* ---------- Kural cards with meaning (Category) ---------- */
.thirukkural-card {background: var(--tk-cream);border: 1px solid var(--tk-cream-border);border-radius: 12px;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);overflow: hidden;}
.thirukkural-cards li + li {margin-top: 16px;}
.thirukkural-card-head {position: relative;display: flex;align-items: center;min-height: 80px;padding: 10px 40px 10px 43px;box-sizing: border-box;border-bottom: 1px solid var(--tk-cream-border);}
.thirukkural-card-head .thirukkural-num {margin-right: 63px;font-size: 14px;}
.thirukkural-card-meaning {padding: 8px 17px 16px;font-size: 14px;line-height: 30px;color: var(--tk-text);}
.thirukkural-card-meaning b {font-weight: bold;}

/* ---------- Pagination ---------- */
.thirukkural-pagination {display: flex;align-items: center;justify-content: center;margin-top: 34px;}
.thirukkural-pagination a,
.thirukkural-pagination span {display: inline-block;min-width: 36px;height: 36px;line-height: 36px;margin: 0 3px;text-align: center;font-size: 14px;color: var(--tk-text);border-radius: 5px;}
.thirukkural-pagination a.active {background: var(--tk-teal-dark);color: #fff;font-weight: bold;}
.thirukkural-pagination a.thirukkural-page-arrow {background: var(--tk-btn-bg) url(https://imagesvs.oneindia.com/db-common/images/thirukkural/arrow-prev.svg) no-repeat center / 21.6px 21.6px;margin: 0 14px;}
.thirukkural-pagination a.thirukkural-page-arrow.next {background-image: url(https://imagesvs.oneindia.com/db-common/images/thirukkural/arrow-next.svg);transform: rotate(180deg);}
.thirukkural-pagination a:not(.active):not(.thirukkural-page-arrow):hover {background: var(--tk-btn-bg);}

/* ---------- Prev / next chapter (Category) ---------- */
.thirukkural-chapter-nav {display: flex;justify-content: space-between;margin-top: 16px;}
.thirukkural-chapter-nav a {position: relative;width: 184px;height: 36px;line-height: 36px;padding: 0 12px 0 37px;box-sizing: border-box;background: var(--tk-btn-bg);border-radius: 5px;font-size: 12px;color: var(--tk-text);}
.thirukkural-chapter-nav a:before {content: '';position: absolute;left: 8px;top: 7px;width: 22px;height: 22px;background: url(https://imagesvs.oneindia.com/db-common/images/thirukkural/arrow-next.svg) no-repeat center / 21.6px 21.6px;}
.thirukkural-chapter-nav a.next {padding: 0 37px 0 8px;}
.thirukkural-chapter-nav a.next:before {left: auto;right: 2px;transform: rotate(180deg);}

/* ---------- Three paals (Home) ---------- */
.thirukkural-paal-grid {display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));gap: 14px;}
.thirukkural-paal-card {display: flex;flex-direction: column;min-height: 345px;padding: 7px 11px 12px;box-sizing: border-box;background: var(--tk-cream);border: 1px solid var(--tk-cream-border);border-radius: 12px;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);}
.thirukkural-paal-label {font-size: 14px;line-height: 24px;}
.thirukkural-paal-name {font-size: 18px;line-height: 24px;font-weight: bold;margin-top: 1px;}
.thirukkural-paal-desc {flex: 1;font-size: 14px;line-height: 24px;margin-top: 14px;}
.thirukkural-paal-stats {display: flex;border-top: 1px solid var(--tk-cream-border);padding-top: 10px;margin-top: 10px;}
.thirukkural-paal-stats div {flex: 1;}
.thirukkural-paal-stats strong {display: block;font-size: 18px;line-height: 24px;}
.thirukkural-paal-stats span {display: block;font-size: 12px;line-height: 24px;color: var(--tk-muted);}

/* ---------- Topics (Home) ---------- */
.thirukkural-topics {display: grid;grid-template-columns: repeat(4, 1fr);gap: 9px 10px;padding: 14px 15px;background: #fff;border: 1px solid var(--tk-cream-border);border-radius: 6px;}
.thirukkural-topics a {display: block;height: 64px;padding: 6px 11px;box-sizing: border-box;background: var(--tk-row-alt);border: 1px solid var(--tk-border);border-radius: 6px;}
.thirukkural-topics a:hover {border-color: var(--tk-cream-border);background: var(--tk-cream);}
.thirukkural-topics strong {display: block;font-size: 13px;line-height: 24px;}
.thirukkural-topics span {display: block;font-size: 12px;line-height: 24px;color: var(--tk-muted);}

/* ---------- Today's kural ---------- */
.thirukkural-today {display: flex;padding: 18px 23px 15px 16px;background: var(--tk-today-bg);border-radius: 12px;}
.thirukkural-portrait {position: relative;flex: 0 0 auto;width: 116px;height: 120px;margin-top: 49px;margin-right: 16px;}
.thirukkural-portrait:before {content: '';position: absolute;left: 0;top: 0;width: 101.813px;height: 101.813px;background: url(https://imagesvs.oneindia.com/db-common/images/thirukkural/portrait-circle-sm.svg) no-repeat 0 0 / 100% 100%;}
.thirukkural-portrait img {position: relative;display: block;width: 113.5px;height: 113.5px;object-fit: cover;margin: 6.7px 0 0 2.5px;filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));}
.thirukkural-today-body {flex: 1;}
.thirukkural-today-meta {font-size: 12px;line-height: 24px;white-space: pre;}
.thirukkural-today-kural {font-size: 18px;line-height: 32px;font-weight: bold;margin-top: -2px;}
.thirukkural-today-chapter {font-size: 12px;line-height: 24px;color: var(--tk-muted);margin-top: 2px;}
.thirukkural-today-explain {margin-top: 4px;padding: 7px 12px 8px 9px;background: var(--tk-cream);border: 1px solid var(--tk-cream-border);border-radius: 6px;}
.thirukkural-today-explain strong {display: block;font-size: 12px;line-height: 24px;}
.thirukkural-today-explain p {font-size: 14px;line-height: 30px;margin-top: 3px;}

/* ---------- Most read chapters ---------- */
.thirukkural-popular {display: grid;grid-template-columns: repeat(2, 1fr);gap: 16px 17px;}
.thirukkural-popular-card {display: block;min-height: 129px;background: var(--tk-row-alt);border: 1px solid var(--tk-row-head);border-radius: 12px;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);overflow: hidden;}
.thirukkural-popular-head {position: relative;height: 40px;line-height: 38px;padding: 0 30px 0 7px;background: var(--tk-row-head);font-size: 14px;font-weight: bold;color: var(--tk-heading);}
.thirukkural-popular-head .thirukkural-chevron {right: 10px;}
.thirukkural-popular-body {padding: 4px 7px 10px;}
.thirukkural-popular-body span {display: block;font-size: 12px;line-height: 24px;color: var(--tk-muted);}
.thirukkural-popular-body p {font-size: 12px;line-height: 30px;font-weight: bold;color: var(--tk-text);}
.thirukkural-popular-card:hover .thirukkural-popular-head {text-decoration: underline;}

/* ---------- Who is Thiruvalluvar ---------- */
.thirukkural-author {display: flex;background: #fff;border: 1px solid var(--tk-border);border-radius: 6px;overflow: hidden;}
.thirukkural-author-photo {flex: 0 0 154px;background: var(--tk-cream);border-right: 1px solid var(--tk-border);}
.thirukkural-author-photo .thirukkural-portrait {width: 140px;height: 144px;margin: 55px 0 0 14px;}
.thirukkural-author-photo .thirukkural-portrait:before {width: 122px;height: 122px;background-image: url(../images/thirukkural/new/portrait-circle-lg.svg);}
.thirukkural-author-photo .thirukkural-portrait img {width: 136px;height: 136px;margin: 8px 0 0 3px;}
.thirukkural-author-text {flex: 1;padding: 15px 16px 15px 16px;font-size: 16px;line-height: 30px;}
.thirukkural-author-text p + p {margin-top: 24px;}

/* ---------- About ---------- */
.thirukkural-about-text {font-size: 16px;line-height: 30px;}
.thirukkural-about-text p + p {margin-top: 24px;}
.thirukkural-facts {width: 100%;margin-top: 24px;border: 1px solid var(--tk-border);border-radius: 6px;border-collapse: separate;border-spacing: 0;overflow: hidden;font-size: 13px;line-height: 24px;}
.thirukkural-facts th,
.thirukkural-facts td {height: 50px;padding: 0 20px;text-align: left;border-bottom: 1px solid var(--tk-border);vertical-align: middle;}
.thirukkural-facts th {background: var(--tk-row-head);font-weight: bold;}
.thirukkural-facts td {width: 50%;}
.thirukkural-facts td + td {font-weight: bold;}
.thirukkural-facts tbody tr:nth-child(even) td {background: var(--tk-row-alt);}
.thirukkural-facts tbody tr:last-child td {border-bottom: 0;}

/* ---------- FAQ ---------- */
.thirukkural-faq {padding: 11px 12px;background: #fff;border: 1px solid var(--tk-border);border-radius: 6px;font-size: 16px;line-height: 30px;}
.thirukkural-faq dt {font-weight: bold;}
.thirukkural-faq dd + dt {margin-top: 30px;}

/* ---------- Kural detail ---------- */
.thirukkural-detail {background: #fff;border: 1px solid var(--tk-cream-border);border-radius: 12px;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);overflow: hidden;}
.thirukkural-detail-head {display: flex;align-items: center;min-height: 80px;padding: 10px 20px 10px 13px;box-sizing: border-box;background: var(--tk-cream);border-bottom: 1px solid var(--tk-cream-border);}
.thirukkural-detail-head .thirukkural-num {font-size: 14px;margin-right: 48px;}
.thirukkural-detail-kural {font-size: 18px;line-height: 30px;font-weight: bold;}
.thirukkural-detail-body {padding: 24px 13px 20px;}
.thirukkural-comment {padding: 16px 20px;background: var(--tk-cream);border: 1px solid var(--tk-cream-border);border-radius: 12px;font-size: 16px;line-height: 30px;}
.thirukkural-comment + .thirukkural-comment {margin-top: 24px;}
.thirukkural-comment-by {font-weight: bold;}
.thirukkural-comment.english p {padding: 6px 0;}
.thirukkural-comment.english p + p {border-top: 1px solid var(--tk-cream-border);margin-top: 12px;padding-top: 18px;}
.thirukkural-comment.english b {font-weight: bold;}

/* ---------- Right column ---------- */
.thirukkural-side-block {margin-top: 35px;}
.thirukkural-side-title {font-size: 18px;line-height: 30px;font-weight: bold;color: var(--tk-heading);margin-bottom: 18px;}
.thirukkural-chapter-table {background: #fff;border: 1px solid var(--tk-border);border-radius: 6px;overflow: hidden;}
.thirukkural-chapter-group-title {height: 46px;line-height: 46px;padding: 0 12px;background: var(--tk-row-head);border-bottom: 1px solid var(--tk-border);font-size: 16px;font-weight: bold;}
.thirukkural-chapter-group li a {display: block;height: 46px;line-height: 46px;padding: 0 13px;background: #fff;border-bottom: 1px solid var(--tk-border);font-size: 13px;}
.thirukkural-chapter-group li:nth-child(even) a {background: var(--tk-row-alt);}
.thirukkural-chapter-group li a:hover {text-decoration: underline;}
.thirukkural-chapter-group:last-child li:last-child a {border-bottom: 0;}
.thirukkural-side-list {background: #fff;border: 1px solid var(--tk-border);border-radius: 6px;overflow: hidden;}
.thirukkural-side-list-head {padding: 9px 12px 10px;min-height: 67px;box-sizing: border-box;background: var(--tk-row-head);font-size: 16px;line-height: 24px;font-weight: bold;}
.thirukkural-side-list ol {list-style: decimal;padding: 10px 12px 13px 34px;font-size: 14px;line-height: 34px;}
.thirukkural-side-list ol a:hover {text-decoration: underline;}

/* ---------- Search results ---------- */
.thirukkural-search-results {display: none;position: absolute;left: 0;right: 0;top: 50px;z-index: 30;max-height: 320px;overflow-y: auto;background: #fff;border: 1px solid var(--tk-border);border-radius: 6px;box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);}
.thirukkural-search-results.is-open {display: block;}
.thirukkural-search-results li a {display: block;padding: 10px 20px;border-bottom: 1px solid var(--tk-border);font-size: 14px;line-height: 24px;color: var(--tk-heading);word-break: break-word;}
.thirukkural-search-results li:last-child a {border-bottom: 0;}
.thirukkural-search-results li a:hover {background: var(--tk-cream);}