/* --------------------------------------------------------------------------
   Tamil locale styling (native language plugin: html[lang^="ta"])
   Ported from the former Google-Translate chozhan-gt-ta layout system.
   Strategy: reflow structure + Tamil-safe typography — not font zoom.
   -------------------------------------------------------------------------- */

html[lang^="ta"] body,
body.locale-ta,
.lang-ta {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-text), sans-serif;
}

html[lang^="ta"] h1,
html[lang^="ta"] h2,
html[lang^="ta"] h3,
html[lang^="ta"] h4,
html[lang^="ta"] h5,
html[lang^="ta"] h6,
html[lang^="ta"] .display-2,
html[lang^="ta"] .section-title,
html[lang^="ta"] .widget-title,
html[lang^="ta"] .btn,
html[lang^="ta"] button,
html[lang^="ta"] input,
html[lang^="ta"] select,
html[lang^="ta"] textarea,
html[lang^="ta"] a,
.lang-ta h1,
.lang-ta h2,
.lang-ta h3,
.lang-ta h4,
.lang-ta h5,
.lang-ta h6 {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-heading), sans-serif;
}

html[lang^="ta"] body,
html[lang^="ta"] p,
html[lang^="ta"] li,
html[lang^="ta"] span,
html[lang^="ta"] label,
html[lang^="ta"] .btn,
.lang-ta p {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-text), sans-serif;
}

/* --- Header top bar --- */
html[lang^="ta"] .header-info > ul > li > a,
html[lang^="ta"] .header-info-right > ul > li {
    font-size: 13px;
    line-height: 1.3;
}

html[lang^="ta"] .header-info-right > ul {
    flex-wrap: wrap;
    justify-content: flex-end;
    row-gap: 4px;
    column-gap: 10px;
}

html[lang^="ta"] .language-dropdown-active,
html[lang^="ta"] .language-dropdown a {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-text), sans-serif;
    font-size: 13px;
    line-height: 1.3;
}

/* --- Header bottom: one nav row --- */
html[lang^="ta"] .header-bottom .header-wrap {
    align-items: center;
    flex-wrap: wrap;
    row-gap: 8px;
}

html[lang^="ta"] .header-bottom .header-nav {
    display: flex !important;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 10px;
    row-gap: 6px;
    min-width: 0;
    max-width: 100%;
}

html[lang^="ta"] .header-bottom .main-categories-wrap {
    flex: 0 0 auto;
}

html[lang^="ta"] .header-bottom .main-menu {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
}

html[lang^="ta"] .header-bottom .hotline {
    /* Number remains in top bar / footer; frees width for Tamil nav */
    display: none !important;
}

html[lang^="ta"] .main-categories-wrap .categories-button-active {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    max-width: none;
    min-height: 44px;
    padding: 10px 16px !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
}

html[lang^="ta"] .main-menu nav > ul {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    column-gap: 2px;
    row-gap: 6px;
    width: 100%;
}

html[lang^="ta"] .main-menu.main-menu-padding-1 nav > ul > li {
    padding: 0 !important;
}

html[lang^="ta"] .main-menu.main-menu-padding-1 nav > ul > li > a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px !important;
    line-height: 1.25 !important;
    padding: 8px 8px !important;
    white-space: nowrap;
}

/* --- Header middle / search --- */
html[lang^="ta"] .search-style-2 .form-group--icon {
    max-width: 130px;
}

html[lang^="ta"] .search-style-2 .product-cat-label,
html[lang^="ta"] .search-style-2 .select2-selection__rendered,
html[lang^="ta"] .search-style-2 select {
    font-size: 13px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

html[lang^="ta"] .search-style-2 input[type="text"],
html[lang^="ta"] .search-style-2 .input-search-product {
    font-size: 14px !important;
}

html[lang^="ta"] .header-action-2 .header-action-icon-2 > a span,
html[lang^="ta"] .header-action-right .header-action-icon-2 span.lable {
    white-space: nowrap;
    font-size: 13px;
}

/* --- Page banner / breadcrumbs --- */
html[lang^="ta"] .page-header {
    padding-left: 16px;
    padding-right: 16px;
}

/* Nest puts the title in col-xl-3 (~25% width) — too narrow for Tamil page names */
html[lang^="ta"] .page-header [class*="col-xl-3"],
html[lang^="ta"] .page-header [class*="col-lg-3"],
html[lang^="ta"] .page-header [class*="col-md-3"] {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: min(920px, 92vw) !important;
}

html[lang^="ta"] .page-header h1 {
    font-size: clamp(30px, 3.6vw, 48px) !important;
    line-height: 1.25 !important;
    width: auto !important;
    max-width: none !important;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: keep-all;
    line-break: strict;
    hyphens: none;
}

@media (max-width: 767px) {
    html[lang^="ta"] .page-header h1 {
        white-space: normal;
    }
}

html[lang^="ta"] .page-header .breadcrumb {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 8px;
    row-gap: 4px;
}

/* --- Listing toolbar (found count + sort) --- */
html[lang^="ta"] .shop-product-filter {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px 16px;
}

html[lang^="ta"] .shop-product-filter .total-product {
    flex: 1 1 240px;
    min-width: 0;
}

html[lang^="ta"] .shop-product-filter .total-product p {
    font-size: 14px;
    line-height: 1.45;
    margin: 0;
}

html[lang^="ta"] .shop-product-filter .sort-by-product-area {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
    flex: 0 1 auto;
    max-width: 100%;
}

html[lang^="ta"] .sort-by-cover {
    max-width: 100%;
}

html[lang^="ta"] .sort-by-product-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-width: 0;
    max-width: 260px;
}

html[lang^="ta"] .sort-by-product-wrap .sort-by span,
html[lang^="ta"] .sort-by-product-wrap .sort-by-dropdown-wrap span {
    font-size: 13px;
    line-height: 1.3;
    white-space: normal;
}

/* --- Sidebar filters / categories --- */
html[lang^="ta"] .primary-sidebar .widget-area,
html[lang^="ta"] .primary-sidebar .bb-product-filter {
    min-width: 0;
}

html[lang^="ta"] .primary-sidebar .bb-product-filter-title,
html[lang^="ta"] .primary-sidebar .widget__title {
    font-size: 16px;
    line-height: 1.35;
    margin-bottom: 14px;
}

html[lang^="ta"] .primary-sidebar a,
html[lang^="ta"] .primary-sidebar .form-check-label,
html[lang^="ta"] .primary-sidebar li {
    line-height: 1.4;
    overflow-wrap: break-word;
}

html[lang^="ta"] .primary-sidebar .ps-list--categories li a,
html[lang^="ta"] .primary-sidebar .custome-checkbox label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    white-space: normal;
    padding-top: 6px;
    padding-bottom: 6px;
}

/* Browse-categories flyout */
html[lang^="ta"] .categories-dropdown-wrap.categories-dropdown-list-mode {
    min-width: 280px;
    max-width: 360px;
}

html[lang^="ta"] .categories-dropdown-wrap.categories-dropdown-list-mode ul.categories-dropdown-list > li {
    min-height: 44px;
    height: auto;
    line-height: 1.35;
}

html[lang^="ta"] .categories-dropdown-wrap.categories-dropdown-list-mode ul.categories-dropdown-list > li > a {
    min-height: 44px;
    padding-top: 10px;
    padding-bottom: 10px;
    align-items: flex-start;
}

html[lang^="ta"] .categories-dropdown-wrap.categories-dropdown-list-mode ul.categories-dropdown-list > li > a .cat-name {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
}

html[lang^="ta"] .categories-dropdown-wrap .dropdown-menu,
html[lang^="ta"] .categories-dropdown-wrap .level-menu {
    min-width: 220px;
    max-width: 300px;
}

html[lang^="ta"] .categories-dropdown-wrap .dropdown-menu a {
    white-space: normal;
    line-height: 1.35;
    padding-top: 8px;
    padding-bottom: 8px;
}

/* --- Product cards --- */
html[lang^="ta"] .product-cart-wrap .product-content-wrap h2,
html[lang^="ta"] .product-cart-wrap .product-content-wrap h2 a {
    white-space: normal !important;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    line-height: 1.35 !important;
    max-height: calc(1.35em * 2);
    font-size: 14px;
}

html[lang^="ta"] .product-cart-wrap .product-category a {
    white-space: normal;
    line-height: 1.3;
    font-size: 12px;
}

html[lang^="ta"] .product-cart-wrap .add-cart,
html[lang^="ta"] .product-cart-wrap .button-add-to-cart,
html[lang^="ta"] .product-cart-wrap .action-btn.add {
    white-space: nowrap;
    font-size: 13px;
}

/* --- Section titles --- */
html[lang^="ta"] .section-title h2,
html[lang^="ta"] .section-title h3,
html[lang^="ta"] h2.section-title {
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    word-break: keep-all;
    line-break: strict;
    hyphens: none;
}

/* --- Footer --- */
html[lang^="ta"] footer.main .widget-title,
html[lang^="ta"] footer.main h4,
html[lang^="ta"] footer.main h5 {
    line-height: 1.35;
}

html[lang^="ta"] footer.main ul li a,
html[lang^="ta"] footer.main p {
    line-height: 1.45;
    overflow-wrap: break-word;
}

/* --- Mobile drawer --- */
html[lang^="ta"] .mobile-header-info-wrap .single-mobile-header-info a,
html[lang^="ta"] .mobile-menu li a {
    white-space: normal;
    line-height: 1.35;
}

/* --- Homepage hero + promo banners ---
   Latin hero uses tight leading (1.12) + negative tracking — that clips Tamil
   matras/descenders and crowds the photography. Open the rhythm only in TA. */
html[lang^="ta"] .hero-slider-1 .slider-content,
html[lang^="ta"] .home-slider .slider-content,
html[lang^="ta"] .single-hero-slider .slider-content {
    max-width: min(640px, 92%);
}

html[lang^="ta"] .hero-slider-1 .slider-content .display-2,
html[lang^="ta"] .hero-slider-1 .slider-content h1,
html[lang^="ta"] .home-slider .slider-content .display-2,
html[lang^="ta"] .home-slider .slider-content h1,
html[lang^="ta"] .single-hero-slider .slider-content h1 {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-heading), sans-serif !important;
    font-size: clamp(32px, 3.8vw, 52px) !important;
    line-height: 1.45 !important;
    letter-spacing: 0 !important;
    overflow-wrap: normal;
    word-break: keep-all;
    line-break: strict;
    hyphens: none;
    margin-bottom: 18px !important;
}

html[lang^="ta"] .hero-slider-1 .slider-content p,
html[lang^="ta"] .home-slider .slider-content p,
html[lang^="ta"] .single-hero-slider .slider-content p {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-text), sans-serif !important;
    font-size: clamp(15px, 1.6vw, 18px) !important;
    line-height: 1.65 !important;
    letter-spacing: 0 !important;
    max-width: 42ch;
    margin-bottom: 28px !important;
    overflow-wrap: normal;
    word-break: keep-all;
    line-break: strict;
    hyphens: none;
}

/* Keep Tamil header chrome on one compact row */
html[lang^="ta"] .header-bottom {
    min-height: 0;
}

html[lang^="ta"] .header-bottom .header-nav {
    flex-wrap: nowrap;
}

html[lang^="ta"] .header-middle {
    padding-top: 18px;
    padding-bottom: 18px;
}

@media (max-width: 767px) {
    html[lang^="ta"] .hero-slider-1 .slider-content .display-2,
    html[lang^="ta"] .hero-slider-1 .slider-content h1,
    html[lang^="ta"] .home-slider .slider-content .display-2,
    html[lang^="ta"] .home-slider .slider-content h1 {
        font-size: clamp(28px, 7.5vw, 40px) !important;
        line-height: 1.4 !important;
    }

    html[lang^="ta"] .hero-slider-1 .slider-content p,
    html[lang^="ta"] .home-slider .slider-content p {
        max-width: none;
        line-height: 1.6 !important;
    }
}

html[lang^="ta"] .banner-img .banner-text {
    padding-left: 28px;
    padding-right: 24px;
}

html[lang^="ta"] .banner-img .banner-text h2,
html[lang^="ta"] .banner-img .banner-text h3,
html[lang^="ta"] .banner-img .banner-text h4 {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-heading), sans-serif !important;
    line-height: 1.42 !important;
    letter-spacing: 0 !important;
    overflow-wrap: normal;
    word-break: keep-all;
    line-break: strict;
    hyphens: none;
}

html[lang^="ta"] .banner-img.style-2 .banner-text h2,
html[lang^="ta"] .banner-img.style-3 .banner-text h2,
html[lang^="ta"] .banner-img.style-2 .banner-text h4,
html[lang^="ta"] .banner-img.style-3 .banner-text h4 {
    font-size: clamp(24px, 2.1vw, 32px) !important;
    min-height: 0 !important;
}

html[lang^="ta"] .banner-img .banner-text .btn,
html[lang^="ta"] .banner-img .banner-text a.btn {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-text), sans-serif !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    white-space: nowrap;
}

html[lang^="ta"] .banner-big .banner-text h2,
html[lang^="ta"] .banner-big .banner-text h4,
html[lang^="ta"] .deal .product-title,
html[lang^="ta"] .deal h2,
html[lang^="ta"] .deal h5,
html[lang^="ta"] .section-deals-of-the-day h2,
html[lang^="ta"] .deals-content h2 a {
    font-family: "Noto Sans Tamil", "Nirmala UI", "Tamil MN", var(--font-heading), sans-serif !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
    word-break: keep-all;
    line-break: strict;
    hyphens: none;
}

/* Countdown labels under deals */
html[lang^="ta"] .deals-countdown .countdown-section .countdown-period {
    font-size: 11px !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    white-space: nowrap;
}
