/*
Theme Name: DeepSeek AI Checker
Theme URI: https://deepseekaichecker.com/
Author: DeepSeek AI Checker Team
Author URI: https://deepseekaichecker.com/
Description: Clean, modern, production-ready WordPress theme for DeepSeek AI Checker.
Version: 1.4.3
Requires at least: 5.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: deepseek
*/

/* Root Design System Tokens & Shadows */
:root {
    --radius: 0.75rem; /* 12px default base radius */
    --shadow-card: 0 4px 20px -2px rgba(15, 23, 42, 0.08), 0 2px 6px -1px rgba(15, 23, 42, 0.04);
    --shadow-lift: 0 16px 36px -6px rgba(15, 23, 42, 0.14), 0 6px 14px -2px rgba(15, 23, 42, 0.06);
    --shadow-glow: 0 20px 50px -15px rgba(77, 107, 254, 0.35);
}

/* ==========================================================================
   Border Radius Design System (Home Page Matching Tokens)
   ========================================================================== */
.rounded-none         { border-radius: 0 !important; }
.rounded-sm           { border-radius: 0.25rem !important; }
.rounded              { border-radius: 0.375rem !important; }
.rounded-md           { border-radius: 0.5rem !important; }
.rounded-lg           { border-radius: 0.75rem !important; }  /* 12px */
.rounded-xl           { border-radius: 0.875rem !important; } /* 14px */
.rounded-2xl          { border-radius: 1.25rem !important; }  /* 20px */
.rounded-3xl          { border-radius: 1.5rem !important; }   /* 24px */
.rounded-\[1\.75rem\] { border-radius: 1.75rem !important; } /* 28px */
.rounded-\[28px\]     { border-radius: 28px !important; }
.rounded-\[2rem\]     { border-radius: 2rem !important; }    /* 32px */
.rounded-full         { border-radius: 9999px !important; }

/* Directional Rounded Corners */
.rounded-t-xl         { border-top-left-radius: 0.875rem !important; border-top-right-radius: 0.875rem !important; }
.rounded-b-xl         { border-bottom-left-radius: 0.875rem !important; border-bottom-right-radius: 0.875rem !important; }
.rounded-t-2xl        { border-top-left-radius: 1.25rem !important; border-top-right-radius: 1.25rem !important; }
.rounded-b-2xl        { border-bottom-left-radius: 1.25rem !important; border-bottom-right-radius: 1.25rem !important; }
.rounded-t-3xl        { border-top-left-radius: 1.5rem !important; border-top-right-radius: 1.5rem !important; }
.rounded-b-3xl        { border-bottom-left-radius: 1.5rem !important; border-bottom-right-radius: 1.5rem !important; }

@media (min-width: 768px) {
    .md\:rounded-xl       { border-radius: 0.875rem !important; }
    .md\:rounded-2xl      { border-radius: 1.25rem !important; }
    .md\:rounded-3xl      { border-radius: 1.5rem !important; }
    .md\:rounded-\[28px\] { border-radius: 28px !important; }
    .md\:rounded-\[2rem\] { border-radius: 2rem !important; }
}

/* ==========================================================================
   Card Styling & Elevation System (Matching Home Page)
   ========================================================================== */
.shadow-card {
    box-shadow: var(--shadow-card) !important;
}

.shadow-lift,
.hover\:shadow-lift:hover {
    box-shadow: var(--shadow-lift) !important;
}

/* Card hover micro-animations matching home page */
.hover\:-translate-y-1:hover {
    transform: translateY(-4px) !important;
}

.hover\:-translate-y-0\.5:hover {
    transform: translateY(-2px) !important;
}

.hover\:border-primary\/40:hover {
    border-color: color-mix(in oklab, var(--primary) 40%, transparent) !important;
}

.hover\:border-primary\/50:hover {
    border-color: color-mix(in oklab, var(--primary) 50%, transparent) !important;
}

.hover\:border-primary:hover {
    border-color: var(--primary) !important;
}

/* Universal Card Items Elevation across All Pages */
.card,
.feature-card,
.tool-card,
article[class*="rounded-2xl"],
article[class*="rounded-3xl"] {
    box-shadow: var(--shadow-card);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.card:hover,
.feature-card:hover,
.tool-card:hover,
article[class*="rounded-2xl"]:hover,
article[class*="rounded-3xl"]:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lift) !important;
    border-color: color-mix(in oklab, var(--primary) 40%, transparent) !important;
}

/* Table containers: clean corner clipping */
div[class*="rounded-2xl"]:has(table),
div[class*="rounded-3xl"]:has(table) {
    overflow: hidden !important;
}

/* Ensure all content sections are immediately visible without blank delay */
.reveal,
.reveal.is-visible,
.reveal[data-visible="true"],
main section .reveal {
    opacity: 1 !important;
    transform: none !important;
}

/* ==========================================================================
   Smooth FAQ Accordion System & Universal Padding Fix
   ========================================================================== */
.faq-item {
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

.faq-item.is-open {
    border-color: color-mix(in oklab, var(--primary) 40%, transparent) !important;
    box-shadow: var(--shadow-card);
}

.faq-panel,
.faq-content {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease-out;
}

.faq-panel > div,
.faq-content > div {
    overflow: hidden;
    min-height: 0 !important;
    padding-left: 1.5rem !important;  /* 24px horizontal alignment with question */
    padding-right: 1.5rem !important;
    padding-top: 0.25rem !important;  /* 4px breathing space below question */
    padding-bottom: 1.75rem !important; /* 28px guaranteed bottom padding on mobile/tablet */
    box-sizing: border-box !important;
}

@media (min-width: 768px) {
    .faq-panel > div,
    .faq-content > div {
        padding-bottom: 2rem !important; /* 32px generous breathing room on desktop */
    }
}

.faq-item.is-open .faq-panel,
.faq-item.is-open .faq-content,
.faq-panel.is-open,
.faq-content.is-open {
    display: grid !important;
    grid-template-rows: 1fr !important;
    opacity: 1 !important;
}

.faq-panel p,
.faq-content p,
.faq-item .faq-panel p,
.faq-item .faq-content p {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.65 !important;
}

.faq-chevron {
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.faq-item.is-open .faq-chevron,
.faq-button[aria-expanded="true"] .faq-chevron,
.faq-toggle-btn[aria-expanded="true"] .faq-chevron {
    transform: rotate(180deg) !important;
}

/* Mobile Navigation Drawer */
#mobile-nav {
    display: none;
}
#mobile-nav.is-open {
    display: block;
}

/* ==========================================================================
   Informational & Legal Pages Layout System (About, Contact, Privacy, Terms)
   ========================================================================== */

/* Universal visibility protection: prevent any element from staying hidden */
.reveal,
.reveal.is-visible,
.reveal[data-visible="true"],
.reveal[data-visible="false"],
main section .reveal,
article .reveal {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

/* 2-Column Legal / Privacy / Terms Layout with Sticky Sidebar */
.legal-layout {
    display: grid;
    gap: 2.5rem;
}

@media (min-width: 1024px) {
    .legal-layout {
        grid-template-columns: 260px minmax(0, 1fr) !important;
        gap: 4rem !important;
        align-items: start;
    }
}

.legal-sidebar {
    position: relative;
}

@media (min-width: 1024px) {
    .legal-sidebar {
        position: sticky !important;
        top: 6rem !important;
        align-self: start !important;
    }
}

.legal-sidebar nav a {
    display: block;
    border-left: 2px solid transparent;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    line-height: 1.5rem;
    color: var(--muted-foreground);
    transition: all 0.2s ease;
    text-decoration: none;
    border-radius: 0 0.5rem 0.5rem 0;
}

.legal-sidebar nav a:hover,
.legal-sidebar nav a.is-active {
    border-left-color: var(--primary) !important;
    background-color: var(--accent);
    color: var(--primary-deep);
}

.legal-article section {
    scroll-margin-top: 7rem;
    border-bottom: 1px solid var(--border);
    padding-bottom: 1.75rem;
    margin-bottom: 2rem;
}

.legal-article section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

/* Bullet list fixes for legal pages */
.legal-article ul {
    list-style-type: disc !important;
    padding-left: 1.5rem !important;
    margin-top: 1rem !important;
    margin-bottom: 1.5rem !important;
}

.legal-article ul li {
    padding-left: 0.25rem !important;
    margin-bottom: 0.75rem !important;
    line-height: 2rem !important;
    color: var(--muted-foreground);
}

.legal-article ul li:last-child {
    margin-bottom: 0 !important;
}

.legal-article p {
    margin-bottom: 1.25rem;
    line-height: 2rem;
    color: var(--muted-foreground);
}

/* 2-Column Contact Layout */
.contact-layout {
    display: grid;
    gap: 2.5rem;
    align-items: start;
}

@media (min-width: 768px) {
    .contact-layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) !important;
        gap: 4rem !important;
    }
}

/* Contact Page Icon Badges & Size Utilities */
.contact-icon-badge {
    display: inline-flex !important;
    width: 3.5rem !important;
    height: 3.5rem !important;
    min-width: 3.5rem !important;
    min-height: 3.5rem !important;
    max-width: 3.5rem !important;
    max-height: 3.5rem !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 1rem !important;
    flex-shrink: 0 !important;
}
.contact-icon-badge svg {
    width: 1.75rem !important;
    height: 1.75rem !important;
}

.contact-form-icon-badge {
    display: inline-flex !important;
    width: 2.5rem !important;
    height: 2.5rem !important;
    min-width: 2.5rem !important;
    min-height: 2.5rem !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 0.75rem !important;
    flex-shrink: 0 !important;
}
.contact-form-icon-badge svg {
    width: 1.25rem !important;
    height: 1.25rem !important;
}

.size-2 { width: 0.5rem !important; height: 0.5rem !important; }
.size-3\.5 { width: 0.875rem !important; height: 0.875rem !important; }
.size-4 { width: 1rem !important; height: 1rem !important; }
.size-5 { width: 1.25rem !important; height: 1.25rem !important; }
.size-6 { width: 1.5rem !important; height: 1.5rem !important; }
.size-7 { width: 1.75rem !important; height: 1.75rem !important; }
.size-8 { width: 2rem !important; height: 2rem !important; }
.size-9 { width: 2.25rem !important; height: 2.25rem !important; }
.size-10 { width: 2.5rem !important; height: 2.5rem !important; }
.size-11 { width: 2.75rem !important; height: 2.75rem !important; }
.size-12 { width: 3rem !important; height: 3rem !important; }
.size-14 { width: 3.5rem !important; height: 3.5rem !important; }
.size-16 { width: 4rem !important; height: 4rem !important; }

/* About Page Features Grid */
.about-features-grid {
    display: grid;
    gap: 1.25rem;
}

@media (min-width: 768px) {
    .about-features-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .about-features-grid > .col-span-full {
        grid-column: span 2 / span 2 !important;
    }
}

.about-feature-card {
    height: 100%;
    border-radius: var(--radius);
    border: 1px solid var(--border);
    background-color: var(--card);
    padding: 1.5rem;
    box-shadow: var(--shadow-card);
    transition: all 0.3s ease;
}

@media (min-width: 768px) {
    .about-feature-card {
        padding: 2rem;
    }
}

.about-feature-card:hover {
    transform: translateY(-4px);
    border-color: color-mix(in oklab, var(--primary) 40%, transparent) !important;
    box-shadow: var(--shadow-lift);
}

.about-feature-card strong {
    display: block;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--ink);
    margin-bottom: 0.25rem;
}

.about-feature-card ul {
    list-style-type: disc !important;
    padding-left: 1.5rem !important;
    margin-top: 1rem !important;
    margin-bottom: 1.5rem !important;
}

.about-feature-card ul li {
    padding-left: 0.25rem !important;
    margin-bottom: 0.75rem !important;
    line-height: 2rem !important;
}



/* ==========================================================================
   Interactive Credit Card 3D Studio & Photorealistic Themes
   ========================================================================== */
.cc-card-3d-wrapper {
    perspective: 1200px;
    width: 100%;
    display: flex;
    justify-content: center;
}

.cc-card-3d {
    width: 100%;
    max-width: 420px;
    aspect-ratio: 1.586 / 1;
    border-radius: 1.25rem;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6), inset 0 1px 1px rgba(255, 255, 255, 0.35);
    transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.3s ease;
    transform-style: preserve-3d;
    position: relative;
    user-select: none;
    cursor: pointer;
    overflow: hidden;
}

.cc-card-3d:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.7), inset 0 1px 1px rgba(255, 255, 255, 0.45);
}

/* Card Themes - Guaranteed Visibility & Photorealism */
.cc-theme-visa {
    background: linear-gradient(135deg, #0c2162 0%, #1742a1 45%, #061138 100%) !important;
    color: #ffffff !important;
}

.cc-theme-mastercard {
    background: linear-gradient(135deg, #18181b 0%, #2e2e33 50%, #09090b 100%) !important;
    color: #ffffff !important;
}

.cc-theme-amex {
    background: linear-gradient(135deg, #1e293b 0%, #334155 50%, #0f172a 100%) !important;
    color: #ffffff !important;
}

.cc-theme-discover {
    background: linear-gradient(135deg, #431407 0%, #9a3412 45%, #1c0a03 100%) !important;
    color: #ffffff !important;
}

.cc-theme-jcb {
    background: linear-gradient(135deg, #064e3b 0%, #047857 45%, #022c22 100%) !important;
    color: #ffffff !important;
}

.cc-theme-diners {
    background: linear-gradient(135deg, #1e3a5f 0%, #2c537f 50%, #0f1c2d 100%) !important;
    color: #ffffff !important;
}

/* EMV Gold Chip */
.cc-chip-gold {
    width: 46px;
    height: 36px;
    border-radius: 8px;
    background: linear-gradient(135deg, #fef08a 0%, #eab308 50%, #854d0e 100%) !important;
    border: 1px solid #78350f !important;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.7), 0 2px 4px rgba(0, 0, 0, 0.5) !important;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    padding: 3px 4px;
}
.cc-chip-line {
    height: 1px;
    background: rgba(120, 53, 15, 0.7);
    border-radius: 1px;
}

/* Magnetic Stripe on Back */
.cc-mag-stripe {
    width: 100%;
    height: 48px;
    background: #09090b !important;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.9);
}

/* Signature Panel */
.cc-signature-panel {
    background: repeating-linear-gradient(45deg, #ffffff, #ffffff 8px, #f1f5f9 8px, #f1f5f9 16px) !important;
    color: #0f172a !important;
    border-radius: 6px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
}

/* Embossed Monospace Card Number */
.cc-embossed-number {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
    letter-spacing: 0.16em !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8), 0 0 1px rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

/* ==========================================================================
   Editorial Guide Spacious & Responsive Table System
   ========================================================================== */
.editorial-container {
    max-width: 76rem !important;
    margin-left: auto;
    margin-right: auto;
}

.editorial-card {
    border-radius: 1.5rem;
    border: 1px solid var(--border);
    background-color: var(--surface);
    padding: 2rem;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s ease;
}

@media (min-width: 768px) {
    .editorial-card {
        padding: 2.5rem;
    }
}

.editorial-table-wrapper {
    overflow-x: auto;
    border-radius: 1rem;
    border: 1px solid var(--border);
    background-color: var(--card);
    box-shadow: var(--shadow-sm);
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}

.editorial-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
    font-size: 0.875rem;
}

.editorial-table th {
    padding: 1rem 1.25rem !important;
    background-color: var(--surface) !important;
    border-bottom: 1px solid var(--border) !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: var(--muted-foreground) !important;
    white-space: nowrap !important;
}

.editorial-table td {
    padding: 1rem 1.25rem !important;
    border-bottom: 1px solid color-mix(in oklab, var(--border) 60%, transparent) !important;
    font-size: 0.8125rem !important;
    line-height: 1.6 !important;
    color: var(--foreground) !important;
}

.editorial-table tr:last-child td {
    border-bottom: none !important;
}

.editorial-table tr:hover td {
    background-color: color-mix(in oklab, var(--primary) 4%, transparent) !important;
}

/* Terminal / Code Block in Editorial Guide */
.editorial-code-block {
    border-radius: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background-color: #0b0f19;
    padding: 1.25rem 1.5rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.8125rem;
    color: #38bdf8;
    overflow-x: auto;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

/* Detector Compact Gauge & Distribution Meter */
.zg-gauge-wrapper {
    width: 240px !important;
    max-width: 240px !important;
    height: 125px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.zg-gauge-svg {
    width: 240px !important;
    height: 125px !important;
    max-width: 100% !important;
    display: block !important;
    margin: 0 auto !important;
}
.zg-dist-wrapper {
    max-width: 260px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ==========================================================================
   Table of Contents (Slim, Collapsible Accordion - H2/H1 Only)
   ========================================================================== */
.toc-accordion {
    transition: all 0.25s ease-in-out;
}
.toc-accordion:hover {
    border-color: rgba(14, 165, 233, 0.35);
}
.toc-toggle {
    cursor: pointer;
    user-select: none;
}
.toc-toggle:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: -2px;
}
.toc-link:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ==========================================================================
   Universal Full-Width Layout & Centered Container System
   Guarantees 100% width, eliminating narrow sidebars and squished layouts
   ========================================================================== */
html, body {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

.min-h-screen {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

header,
header.sticky,
.site-header {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
}

#primary,
.site-main,
main {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
    float: none !important;
    display: block !important;
}

section {
    width: 100% !important;
    max-width: 100% !important;
}

footer.site-footer,
footer {
    width: 100% !important;
    max-width: 100% !important;
}

.container-page {
    width: 100% !important;
    max-width: 1290px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    box-sizing: border-box !important;
}

@media (min-width: 768px) {
    .container-page {
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
}

/* ==========================================================================
   Header Transparency & Glassmorphic Sticky Transition
   - On Non-Home Pages: Solid glassmorphic background prevents any breadcrumb/content overlap
   - On Home Page Only: Transparent at scroll 0 to allow hero gradient to flow under header
   ========================================================================== */
.site-header {
    background-color: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(16px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
    border-bottom: 1px solid var(--border, #e2e8f0) !important;
    box-shadow: 0 1px 3px 0 rgba(15, 23, 42, 0.04) !important;
    transition: background-color 0.25s cubic-bezier(0.16, 1, 0.3, 1), 
                border-color 0.25s cubic-bezier(0.16, 1, 0.3, 1), 
                backdrop-filter 0.25s cubic-bezier(0.16, 1, 0.3, 1), 
                box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.dark .site-header {
    background-color: rgba(15, 23, 42, 0.96) !important;
    border-bottom: 1px solid var(--border, #334155) !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.3) !important;
}

/* Home Page ONLY: Start transparent at scroll 0 so gradient extends behind header */
body.home .site-header,
body.front-page .site-header {
    background-color: transparent !important;
    background-image: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: 1px solid transparent !important;
    box-shadow: none !important;
}

body.home .site-header.is-scrolled,
body.front-page .site-header.is-scrolled {
    background-color: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(16px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--border, #e2e8f0) 80%, transparent) !important;
    box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05), 0 2px 6px -1px rgba(15, 23, 42, 0.02) !important;
}

.dark body.home .site-header.is-scrolled,
.dark body.front-page .site-header.is-scrolled {
    background-color: rgba(15, 23, 42, 0.92) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--border, #334155) 60%, transparent) !important;
    box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.4) !important;
}

/* Ensure mobile open drawer state maintains solid background */
.site-header.has-mobile-open {
    background-color: rgba(255, 255, 255, 0.98) !important;
}
.dark .site-header.has-mobile-open {
    background-color: rgba(15, 23, 42, 0.98) !important;
}

/* WordPress Admin Bar Compatibility */
body.admin-bar {
    margin-top: 32px !important;
}
@media screen and (max-width: 782px) {
    body.admin-bar {
        margin-top: 46px !important;
    }
}
.admin-bar .site-header {
    top: 32px !important;
}
@media screen and (max-width: 782px) {
    .admin-bar .site-header {
        top: 46px !important;
    }
}

/* ==========================================================================
   Hero Section Fluid Background Flow Under Transparent Header (Home Page Only)
   Seamlessly extends grid pattern and gradient blooms behind header on home page
   ========================================================================== */
body.home .hero-gradient-flow,
body.front-page .hero-gradient-flow {
    margin-top: -70px !important;
    padding-top: 70px !important;
}

/* Breadcrumb Bar Positioning & Non-Overlapping Layout */
.site-main > .border-b,
.site-breadcrumb-bar {
    position: relative;
    z-index: 20;
    width: 100%;
}


/* ==========================================================================
   WordPress Native Primary Navigation Menu System
   ========================================================================== */
.deepseek-primary-nav > ul,
.deepseek-primary-nav > div > ul {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.deepseek-primary-nav li {
    position: relative;
    list-style: none;
    margin: 0;
}

.deepseek-primary-nav li a {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--foreground);
    opacity: 0.85;
    border-radius: 0.5rem;
    transition: all 0.2s ease;
    text-decoration: none;
}

.deepseek-primary-nav li:hover > a,
.deepseek-primary-nav li.current-menu-item > a,
.deepseek-primary-nav li.current-menu-ancestor > a {
    color: var(--primary-deep);
    background-color: var(--accent);
    opacity: 1;
}

/* Submenu Dropdown Trigger Chevron */
.deepseek-primary-nav li.menu-item-has-children > a::after {
    content: '';
    display: inline-block;
    width: 0.4rem;
    height: 0.4rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    margin-left: 0.35rem;
    margin-top: -0.15rem;
    transition: transform 0.2s ease;
}

.deepseek-primary-nav li.menu-item-has-children:hover > a::after {
    transform: rotate(-135deg);
    margin-top: 0.15rem;
}

/* Submenu Dropdown Container */
.deepseek-primary-nav ul.sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 15rem;
    width: max-content;
    max-width: 22rem;
    background: var(--popover);
    border: 1px solid var(--border);
    border-radius: 1rem;
    padding: 0.5rem;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    text-align: left !important;
    gap: 0.25rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(0.5rem);
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 60;
    list-style: none;
    margin: 0;
}

/* Dropdown hover safety bridge */
.deepseek-primary-nav ul.sub-menu::before {
    content: '';
    position: absolute;
    top: -12px;
    left: 0;
    right: 0;
    height: 12px;
    background: transparent;
}

.deepseek-primary-nav li:hover > ul.sub-menu,
.deepseek-primary-nav li:focus-within > ul.sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Dropdown Items (Left-aligned, full width, sleek hover) */
.deepseek-primary-nav ul.sub-menu li {
    width: 100% !important;
    display: block !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
}

.deepseek-primary-nav ul.sub-menu li a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    width: 100% !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    padding: 0.5rem 0.875rem !important;
    border-radius: 0.625rem !important;
    color: var(--foreground) !important;
    opacity: 0.85 !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
}

.deepseek-primary-nav ul.sub-menu li a:hover,
.deepseek-primary-nav ul.sub-menu li.current-menu-item > a {
    background-color: var(--accent) !important;
    color: var(--primary-deep) !important;
    opacity: 1 !important;
}

.deepseek-primary-nav ul.sub-menu li a::after {
    display: none !important;
}

/* Mobile Native Menu */
.mobile-primary-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}
.mobile-primary-menu li {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left;
}
.mobile-primary-menu li a {
    display: block;
    padding: 0.625rem 0.75rem;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--foreground);
    border-radius: 0.75rem;
    text-decoration: none;
    transition: background-color 0.15s ease;
    text-align: left;
}
.mobile-primary-menu li:hover > a {
    background-color: var(--accent);
    color: var(--primary-deep);
}
.mobile-primary-menu ul.sub-menu {
    padding-left: 1rem;
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
    border-left: 2px solid var(--border);
    list-style: none;
    text-align: left;
}
.mobile-primary-menu ul.sub-menu li a {
    font-size: 0.875rem;
    padding: 0.4rem 0.5rem;
    text-align: left;
}

/* ==========================================================================
   Category Filter System
   ========================================================================== */
.category-pill {
    cursor: pointer;
    user-select: none;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.category-pill.active {
    background-color: var(--primary) !important;
    color: var(--primary-foreground) !important;
    border-color: var(--primary) !important;
    box-shadow: 0 4px 12px -2px rgba(77, 107, 254, 0.35) !important;
}

/* ==========================================================================
   Single Post Typography Enhancements
   ========================================================================== */
.post-content h2 {
    font-size: 1.625rem;
    font-weight: 800;
    color: var(--ink);
    margin-top: 2.75rem;
    margin-bottom: 1.15rem;
    line-height: 1.3;
    scroll-margin-top: 5rem;
}
@media (min-width: 640px) {
    .post-content h2 {
        font-size: 1.875rem;
    }
}
.post-content h3 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--ink);
    margin-top: 2rem;
    margin-bottom: 0.85rem;
    line-height: 1.4;
    scroll-margin-top: 5rem;
}
.post-content p {
    margin-bottom: 1.25rem;
    line-height: 1.8;
}
.post-content ul, .post-content ol {
    margin-bottom: 1.5rem;
    line-height: 1.75;
}
.post-content table {
    width: 100%;
    margin: 1.75rem 0;
    border-radius: 1rem;
    overflow: hidden;
}

/* ==========================================================================
   Editorial Blog Hub Styling System
   ========================================================================== */
.blog-search-box {
    margin-bottom: 1.5rem !important;
    position: relative !important;
    width: 100% !important;
    max-width: 32rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.blog-search-inner {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    border-radius: 1rem !important;
    border: 1px solid var(--border) !important;
    background-color: var(--card) !important;
    padding: 0.625rem 1rem !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05) !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
}

.blog-search-inner:focus-within {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--primary) 20%, transparent) !important;
}

.blog-search-icon {
    width: 1.125rem !important;
    height: 1.125rem !important;
    min-width: 1.125rem !important;
    min-height: 1.125rem !important;
    margin-right: 0.75rem !important;
    color: var(--muted-foreground) !important;
    flex-shrink: 0 !important;
    pointer-events: none !important;
    display: block !important;
}

#blog-search-input {
    flex: 1 1 auto !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 0.875rem !important;
    line-height: 1.25rem !important;
    color: var(--foreground) !important;
}

#blog-search-input:focus {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

#blog-search-clear {
    margin-left: 0.5rem !important;
    padding: 0.25rem !important;
    cursor: pointer !important;
    color: var(--muted-foreground) !important;
    background: transparent !important;
    border: none !important;
    flex-shrink: 0 !important;
}

#blog-category-filters {
    margin-top: 0.75rem !important;
    margin-bottom: 2rem !important;
    gap: 0.5rem !important;
}

.blog-spotlight-card {
    display: flex !important;
    flex-direction: column !important;
    border-radius: 1.5rem !important; /* 24px smooth radius */
    border: 1px solid var(--border) !important;
    background-color: var(--card) !important;
    box-shadow: var(--shadow-card) !important;
    overflow: hidden !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, border-color 0.3s ease !important;
    width: 100% !important;
}

.blog-spotlight-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: var(--shadow-lift) !important;
    border-color: color-mix(in oklab, var(--primary) 40%, var(--border)) !important;
}

@media (min-width: 1024px) {
    .blog-spotlight-card {
        flex-direction: row !important;
        align-items: stretch !important;
    }
    .blog-spotlight-visual {
        width: 48% !important;
        min-width: 48% !important;
        max-width: 48% !important;
        position: relative !important;
        overflow: hidden !important;
        background: var(--surface) !important;
        border-top-left-radius: 1.5rem !important;
        border-bottom-left-radius: 1.5rem !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }
    .blog-spotlight-visual a {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        position: relative !important;
    }
    .blog-spotlight-visual img {
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        max-height: 100% !important;
        object-fit: cover !important; /* Edge-to-edge crisp display, zero black bars! */
        object-position: center !important;
        display: block !important;
        border-top-left-radius: 1.5rem !important;
        border-bottom-left-radius: 1.5rem !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }
    .blog-spotlight-content {
        width: 52% !important;
        min-width: 52% !important;
        max-width: 52% !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        padding: 1.75rem 2.25rem !important;
    }
}

@media (max-width: 1023px) {
    .blog-spotlight-visual {
        width: 100% !important;
        aspect-ratio: 16 / 9 !important;
        position: relative !important;
        overflow: hidden !important;
        background: var(--surface) !important;
        border-top-left-radius: 1.5rem !important;
        border-top-right-radius: 1.5rem !important;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }
    .blog-spotlight-visual a {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
    }
    .blog-spotlight-visual img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
        display: block !important;
        border-top-left-radius: 1.5rem !important;
        border-top-right-radius: 1.5rem !important;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }
    .blog-spotlight-content {
        width: 100% !important;
        padding: 1.35rem 1.25rem !important;
    }
}

.blog-spotlight-card:hover .blog-spotlight-visual img {
    transform: scale(1.03) !important;
}

/* Bulletproof 3-Column Blog Cards Grid */
#blog-cards-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
    width: 100% !important;
}

@media (min-width: 640px) {
    #blog-cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 1.5rem !important;
    }
}

@media (min-width: 1024px) {
    #blog-cards-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 1.75rem !important;
    }
}

.blog-card-item {
    display: flex;
    flex-direction: column !important;
    justify-content: space-between !important;
    border-radius: 1.25rem !important; /* 20px smooth radius */
    border: 1px solid var(--border) !important;
    background-color: var(--card) !important;
    box-shadow: var(--shadow-card) !important;
    overflow: hidden !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, border-color 0.3s ease !important;
    height: 100% !important;
}

.blog-card-item.is-hidden {
    display: none !important;
}

.blog-card-item:hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--shadow-lift) !important;
    border-color: color-mix(in oklab, var(--primary) 40%, var(--border)) !important;
}

.blog-card-image-wrap {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    background-color: var(--surface) !important;
    border-top-left-radius: 1.25rem !important;
    border-top-right-radius: 1.25rem !important;
}

.blog-card-image-wrap a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

.blog-card-image-wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important; /* Universal clean edge-to-edge cover */
    object-position: center !important;
    display: block !important;
    border-top-left-radius: 1.25rem !important;
    border-top-right-radius: 1.25rem !important;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.blog-card-item:hover .blog-card-image-wrap img {
    transform: scale(1.04) !important;
}

.blog-card-body {
    padding: 1.25rem 1.25rem 1rem 1.25rem !important;
    flex-grow: 1 !important;
    display: flex !important;
    flex-direction: column !important;
}

.blog-card-footer {
    padding: 0.75rem 1.25rem !important;
    border-top: 1px solid color-mix(in oklab, var(--border) 70%, transparent) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: auto !important;
}

/* Single Post Featured Image Display */
.single-post-featured-image-wrap {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    max-height: 480px !important;
    overflow: hidden !important;
    border-radius: 1.5rem !important;
    border: 1px solid var(--border) !important;
    background: var(--surface) !important;
    box-shadow: var(--shadow-card) !important;
    margin: 1.5rem 0 !important;
}

.single-post-featured-image-wrap img,
.single-post-featured-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.single-post-featured-image-wrap:hover img {
    transform: scale(1.015) !important;
}

/* ==========================================================================
   Plagiarism & Sentence Checker Gauge Meters & Metric Circles
   ========================================================================== */
.plagiarism-circle-gauge {
    position: relative !important;
    width: 112px !important;
    height: 112px !important;
    min-width: 112px !important;
    min-height: 112px !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.plagiarism-circle-gauge svg,
.plagiarism-gauge-svg {
    width: 112px !important;
    height: 112px !important;
    min-width: 112px !important;
    min-height: 112px !important;
    display: block !important;
    transform: rotate(-90deg) !important;
}

.sentence-circle-gauge {
    position: relative !important;
    width: 96px !important;
    height: 96px !important;
    min-width: 96px !important;
    min-height: 96px !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.sentence-circle-gauge svg,
.sentence-gauge-svg {
    width: 96px !important;
    height: 96px !important;
    min-width: 96px !important;
    min-height: 96px !important;
    display: block !important;
    transform: rotate(-90deg) !important;
}

.plagiarism-circle-gauge .gauge-overlay,
.sentence-circle-gauge .gauge-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    pointer-events: none !important;
}

/* Tailwind v3.4+ size-* fallbacks across theme */
.size-28 {
    width: 112px !important;
    height: 112px !important;
    min-width: 112px !important;
    min-height: 112px !important;
}
.size-24 {
    width: 96px !important;
    height: 96px !important;
    min-width: 96px !important;
    min-height: 96px !important;
}
.size-16 {
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
    min-height: 64px !important;
}
.size-full {
    width: 100% !important;
    height: 100% !important;
}
.size-1\.5 {
    width: 6px !important;
    height: 6px !important;
}
.size-3\.5 {
    width: 14px !important;
    height: 14px !important;
}

/* ==========================================================================
   Persona & Tool Avatar Gradient System (Fake Name Generator & Tools)
   ========================================================================== */
.fn-persona-avatar,
.size-16.rounded-2xl.bg-gradient-to-tr,
.bg-gradient-to-tr.from-primary.to-indigo-600 {
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
    min-height: 64px !important;
    border-radius: 1rem !important;
    background: linear-gradient(135deg, #2563eb 0%, #4f46e5 50%, #7c3aed 100%) !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 800 !important;
    font-size: 1.75rem !important;
    line-height: 1 !important;
    box-shadow: 0 10px 25px -5px rgba(37, 99, 235, 0.45), 0 4px 6px -2px rgba(37, 99, 235, 0.2) !important;
    user-select: none !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* Gradient Utility Fallbacks */
.bg-gradient-to-r.from-emerald-500.via-teal-500.to-indigo-500,
#plc-budget-bar {
    background: linear-gradient(90deg, #10b981 0%, #14b8a6 50%, #6366f1 100%) !important;
}

.bg-gradient-to-r.from-primary.to-emerald-500,
#pdf-comp-progress-bar {
    background: linear-gradient(90deg, #2563eb 0%, #10b981 100%) !important;
}

/* ==========================================================================
   PDF & ACTION TOOLS COLOR SYSTEM & BUTTON FIXES
   Restores all missing Tailwind utilities for PDF & utility tool suites
   ========================================================================== */

/* Blue Palette (PDF Merge) */
.bg-blue-600,
#pdf-merge-btn-run,
#pdf-merge-btn-dl {
    background-color: #2563eb !important;
    color: #ffffff !important;
}
.hover\:bg-blue-700:hover,
#pdf-merge-btn-run:hover,
#pdf-merge-btn-dl:hover:not(:disabled) {
    background-color: #1d4ed8 !important;
    color: #ffffff !important;
}
#pdf-merge-btn-dl:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
}
.text-blue-500 { color: #3b82f6 !important; }
.text-blue-600 { color: #2563eb !important; }
.text-blue-700 { color: #1d4ed8 !important; }
.bg-blue-500\/10 { background-color: rgba(59, 130, 246, 0.1) !important; }
.border-blue-500\/20 { border-color: rgba(59, 130, 246, 0.2) !important; }
.border-blue-500\/30 { border-color: rgba(59, 130, 246, 0.3) !important; }
.border-blue-500\/60 { border-color: rgba(59, 130, 246, 0.6) !important; }
.hover\:bg-blue-500\/20:hover { background-color: rgba(59, 130, 246, 0.2) !important; }
.hover\:border-blue-500\/60:hover { border-color: rgba(59, 130, 246, 0.6) !important; }

/* Indigo Palette (Split PDF, Word to PDF) */
.bg-indigo-600,
#pdf-split-btn-run,
#word-pdf-btn-run,
#word-pdf-btn-dl {
    background-color: #4f46e5 !important;
    color: #ffffff !important;
}
.hover\:bg-indigo-700:hover,
#pdf-split-btn-run:hover,
#word-pdf-btn-run:hover,
#word-pdf-btn-dl:hover:not(:disabled) {
    background-color: #4338ca !important;
    color: #ffffff !important;
}
#word-pdf-btn-dl:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    background-color: #4f46e5 !important;
    color: #ffffff !important;
}
.text-indigo-500 { color: #6366f1 !important; }
.text-indigo-600 { color: #4f46e5 !important; }
.text-indigo-700 { color: #4338ca !important; }
.hover\:text-indigo-600:hover { color: #4f46e5 !important; }
.hover\:text-indigo-700:hover { color: #4338ca !important; }
.bg-indigo-500\/5 { background-color: rgba(99, 102, 241, 0.05) !important; }
.bg-indigo-500\/10 { background-color: rgba(99, 102, 241, 0.1) !important; }
.bg-indigo-500\/20 { background-color: rgba(99, 102, 241, 0.2) !important; }
.border-indigo-500\/20 { border-color: rgba(99, 102, 241, 0.2) !important; }
.border-indigo-500\/30 { border-color: rgba(99, 102, 241, 0.3) !important; }
.border-indigo-500\/40 { border-color: rgba(99, 102, 241, 0.4) !important; }
.border-indigo-500\/50 { border-color: rgba(99, 102, 241, 0.5) !important; }
.border-indigo-500\/60 { border-color: rgba(99, 102, 241, 0.6) !important; }
.hover\:bg-indigo-500\/20:hover { background-color: rgba(99, 102, 241, 0.2) !important; }
.hover\:border-indigo-500\/40:hover { border-color: rgba(99, 102, 241, 0.4) !important; }
.hover\:border-indigo-500\/50:hover { border-color: rgba(99, 102, 241, 0.5) !important; }
.hover\:border-indigo-500\/60:hover { border-color: rgba(99, 102, 241, 0.6) !important; }

/* Purple Palette (Rotate PDF) */
.bg-purple-600,
#pdf-rotate-btn-run {
    background-color: #9333ea !important;
    color: #ffffff !important;
}
.hover\:bg-purple-700:hover,
#pdf-rotate-btn-run:hover {
    background-color: #7e22ce !important;
    color: #ffffff !important;
}
.text-purple-500 { color: #a855f7 !important; }
.text-purple-600 { color: #9333ea !important; }
.text-purple-700 { color: #7e22ce !important; }
.hover\:text-purple-600:hover { color: #9333ea !important; }
.hover\:text-purple-700:hover { color: #7e22ce !important; }
.bg-purple-500\/5 { background-color: rgba(168, 85, 247, 0.05) !important; }
.bg-purple-500\/10 { background-color: rgba(168, 85, 247, 0.1) !important; }
.bg-purple-500\/20 { background-color: rgba(168, 85, 247, 0.2) !important; }
.border-purple-500\/20 { border-color: rgba(168, 85, 247, 0.2) !important; }
.border-purple-500\/30 { border-color: rgba(168, 85, 247, 0.3) !important; }
.border-purple-500\/40 { border-color: rgba(168, 85, 247, 0.4) !important; }
.border-purple-500\/50 { border-color: rgba(168, 85, 247, 0.5) !important; }
.border-purple-500\/60 { border-color: rgba(168, 85, 247, 0.6) !important; }
.hover\:bg-purple-500\/20:hover { background-color: rgba(168, 85, 247, 0.2) !important; }
.hover\:border-purple-500\/40:hover { border-color: rgba(168, 85, 247, 0.4) !important; }
.hover\:border-purple-500\/50:hover { border-color: rgba(168, 85, 247, 0.5) !important; }
.hover\:border-purple-500\/60:hover { border-color: rgba(168, 85, 247, 0.6) !important; }

/* Teal Palette (Unlock PDF) */
.bg-teal-600,
#pdf-unlock-btn-run,
#pdf-unlock-btn-dl {
    background-color: #0d9488 !important;
    color: #ffffff !important;
}
.hover\:bg-teal-700:hover,
#pdf-unlock-btn-run:hover,
#pdf-unlock-btn-dl:hover:not(:disabled) {
    background-color: #0f766e !important;
    color: #ffffff !important;
}
#pdf-unlock-btn-dl:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    background-color: #0d9488 !important;
    color: #ffffff !important;
}
.text-teal-500 { color: #14b8a6 !important; }
.text-teal-600 { color: #0d9488 !important; }
.bg-teal-500\/10 { background-color: rgba(20, 184, 166, 0.1) !important; }
.border-teal-500\/30 { border-color: rgba(20, 184, 166, 0.3) !important; }
.hover\:bg-teal-500\/20:hover { background-color: rgba(20, 184, 166, 0.2) !important; }

/* Sky Palette (PDF to Word) */
.bg-sky-600,
#pdf-word-btn-run,
#pdf-word-btn-dl {
    background-color: #0284c7 !important;
    color: #ffffff !important;
}
.hover\:bg-sky-700:hover,
#pdf-word-btn-run:hover,
#pdf-word-btn-dl:hover:not(:disabled) {
    background-color: #0369a1 !important;
    color: #ffffff !important;
}
#pdf-word-btn-dl:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    background-color: #0284c7 !important;
    color: #ffffff !important;
}
.text-sky-500 { color: #0ea5e9 !important; }
.text-sky-600 { color: #0284c7 !important; }
.text-sky-700 { color: #0369a1 !important; }
.hover\:text-sky-600:hover { color: #0284c7 !important; }
.hover\:text-sky-700:hover { color: #0369a1 !important; }
.bg-sky-500\/5 { background-color: rgba(14, 165, 233, 0.05) !important; }
.bg-sky-500\/10 { background-color: rgba(14, 165, 233, 0.1) !important; }
.bg-sky-500\/20 { background-color: rgba(14, 165, 233, 0.2) !important; }
.border-sky-500\/20 { border-color: rgba(14, 165, 233, 0.2) !important; }
.border-sky-500\/30 { border-color: rgba(14, 165, 233, 0.3) !important; }
.border-sky-500\/40 { border-color: rgba(14, 165, 233, 0.4) !important; }
.border-sky-500\/50 { border-color: rgba(14, 165, 233, 0.5) !important; }
.border-sky-500\/60 { border-color: rgba(14, 165, 233, 0.6) !important; }
.hover\:bg-sky-500\/20:hover { background-color: rgba(14, 165, 233, 0.2) !important; }
.hover\:border-sky-500\/40:hover { border-color: rgba(14, 165, 233, 0.4) !important; }
.hover\:border-sky-500\/50:hover { border-color: rgba(14, 165, 233, 0.5) !important; }
.hover\:border-sky-500\/60:hover { border-color: rgba(14, 165, 233, 0.6) !important; }

/* Cyan Palette (PDF to JPG) */
.bg-cyan-600,
#pdf-jpg-btn-run {
    background-color: #0891b2 !important;
    color: #ffffff !important;
}
.hover\:bg-cyan-700:hover,
#pdf-jpg-btn-run:hover {
    background-color: #0e7490 !important;
    color: #ffffff !important;
}
.text-cyan-500 { color: #06b6d4 !important; }
.text-cyan-600 { color: #0891b2 !important; }
.text-cyan-700 { color: #0e7490 !important; }
.hover\:text-cyan-600:hover { color: #0891b2 !important; }
.hover\:text-cyan-700:hover { color: #0e7490 !important; }
.bg-cyan-500\/5 { background-color: rgba(6, 182, 212, 0.05) !important; }
.bg-cyan-500\/10 { background-color: rgba(6, 182, 212, 0.1) !important; }
.bg-cyan-500\/20 { background-color: rgba(6, 182, 212, 0.2) !important; }
.border-cyan-500\/20 { border-color: rgba(6, 182, 212, 0.2) !important; }
.border-cyan-500\/30 { border-color: rgba(6, 182, 212, 0.3) !important; }
.border-cyan-500\/40 { border-color: rgba(6, 182, 212, 0.4) !important; }
.border-cyan-500\/50 { border-color: rgba(6, 182, 212, 0.5) !important; }
.border-cyan-500\/60 { border-color: rgba(6, 182, 212, 0.6) !important; }
.hover\:bg-cyan-500\/20:hover { background-color: rgba(6, 182, 212, 0.2) !important; }
.hover\:border-cyan-500\/40:hover { border-color: rgba(6, 182, 212, 0.4) !important; }
.hover\:border-cyan-500\/50:hover { border-color: rgba(6, 182, 212, 0.5) !important; }
.hover\:border-cyan-500\/60:hover { border-color: rgba(6, 182, 212, 0.6) !important; }

/* Emerald Palette (Downloads & Lock PDF & Excel to PDF) */
.bg-emerald-600,
#pdf-lock-btn-run,
#pdf-lock-btn-dl,
#pdf-split-btn-dl,
#pdf-rotate-btn-dl,
#pdf-jpg-btn-dl-all,
#excel-btn-run,
#excel-btn-dl,
#conv-btn-dl,
#img-btn-dl,
#pdf-comp-btn-dl,
#pdf-uni-btn-dl {
    background-color: #059669 !important;
    color: #ffffff !important;
}
.hover\:bg-emerald-700:hover,
#pdf-lock-btn-run:hover,
#pdf-lock-btn-dl:hover:not(:disabled),
#pdf-split-btn-dl:hover:not(:disabled),
#pdf-rotate-btn-dl:hover:not(:disabled),
#pdf-jpg-btn-dl-all:hover:not(:disabled),
#excel-btn-run:hover,
#excel-btn-dl:hover:not(:disabled),
#conv-btn-dl:hover,
#img-btn-dl:hover,
#pdf-comp-btn-dl:hover:not(:disabled),
#pdf-uni-btn-dl:hover:not(:disabled) {
    background-color: #047857 !important;
    color: #ffffff !important;
}
#pdf-lock-btn-dl:disabled,
#pdf-split-btn-dl:disabled,
#pdf-rotate-btn-dl:disabled,
#pdf-jpg-btn-dl-all:disabled,
#excel-btn-dl:disabled,
#pdf-comp-btn-dl:disabled,
#pdf-uni-btn-dl:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    background-color: #059669 !important;
    color: #ffffff !important;
}
.text-emerald-500 { color: #10b981 !important; }
.text-emerald-600 { color: #059669 !important; }
.text-emerald-700 { color: #047857 !important; }
.hover\:text-emerald-500:hover { color: #10b981 !important; }
.hover\:text-emerald-600:hover { color: #059669 !important; }
.bg-emerald-500\/5 { background-color: rgba(16, 185, 129, 0.05) !important; }
.bg-emerald-500\/10 { background-color: rgba(16, 185, 129, 0.1) !important; }
.bg-emerald-500\/20 { background-color: rgba(16, 185, 129, 0.2) !important; }
.border-emerald-500\/20 { border-color: rgba(16, 185, 129, 0.2) !important; }
.border-emerald-500\/30 { border-color: rgba(16, 185, 129, 0.3) !important; }
.border-emerald-500\/40 { border-color: rgba(16, 185, 129, 0.4) !important; }
.border-emerald-500\/50 { border-color: rgba(16, 185, 129, 0.5) !important; }
.border-emerald-500\/60 { border-color: rgba(16, 185, 129, 0.6) !important; }
.hover\:bg-emerald-500\/20:hover { background-color: rgba(16, 185, 129, 0.2) !important; }
.hover\:border-emerald-500\/40:hover { border-color: rgba(16, 185, 129, 0.4) !important; }
.hover\:border-emerald-500\/50:hover { border-color: rgba(16, 185, 129, 0.5) !important; }
.hover\:border-emerald-500\/60:hover { border-color: rgba(16, 185, 129, 0.6) !important; }

/* Rose Palette (PowerPoint to PDF, Clear/Delete buttons) */
.bg-rose-600,
#ppt-btn-run,
#ppt-btn-dl {
    background-color: #e11d48 !important;
    color: #ffffff !important;
}
.hover\:bg-rose-700:hover,
#ppt-btn-run:hover,
#ppt-btn-dl:hover:not(:disabled) {
    background-color: #be123c !important;
    color: #ffffff !important;
}
#ppt-btn-dl:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    background-color: #e11d48 !important;
    color: #ffffff !important;
}
.text-rose-500 { color: #f43f5e !important; }
.text-rose-600 { color: #e11d48 !important; }
.text-rose-700 { color: #be123c !important; }
.hover\:text-rose-500:hover { color: #f43f5e !important; }
.hover\:text-rose-600:hover { color: #e11d48 !important; }
.bg-rose-500\/5 { background-color: rgba(244, 63, 94, 0.05) !important; }
.bg-rose-500\/10 { background-color: rgba(244, 63, 94, 0.1) !important; }
.bg-rose-500\/20 { background-color: rgba(244, 63, 94, 0.2) !important; }
.border-rose-500\/20 { border-color: rgba(244, 63, 94, 0.2) !important; }
.border-rose-500\/30 { border-color: rgba(244, 63, 94, 0.3) !important; }
.border-rose-500\/40 { border-color: rgba(244, 63, 94, 0.4) !important; }
.border-rose-500\/50 { border-color: rgba(244, 63, 94, 0.5) !important; }
.border-rose-500\/60 { border-color: rgba(244, 63, 94, 0.6) !important; }
.hover\:bg-rose-500\/20:hover { background-color: rgba(244, 63, 94, 0.2) !important; }
.hover\:border-rose-500\/40:hover { border-color: rgba(244, 63, 94, 0.4) !important; }
.hover\:border-rose-500\/50:hover { border-color: rgba(244, 63, 94, 0.5) !important; }
.hover\:border-rose-500\/60:hover { border-color: rgba(244, 63, 94, 0.6) !important; }

/* Amber Palette (PDF to ZIP) */
.bg-amber-500,
#pdf-zip-btn-run,
#pdf-zip-btn-dl {
    background-color: #f59e0b !important;
    color: #ffffff !important;
}
.hover\:bg-amber-600:hover,
#pdf-zip-btn-run:hover,
#pdf-zip-btn-dl:hover:not(:disabled) {
    background-color: #d97706 !important;
    color: #ffffff !important;
}
.text-amber-700 { color: #b45309 !important; }
.bg-amber-500\/10 { background-color: rgba(245, 158, 11, 0.1) !important; }
.border-amber-500\/30 { border-color: rgba(245, 158, 11, 0.3) !important; }
.hover\:bg-amber-500\/20:hover { background-color: rgba(245, 158, 11, 0.2) !important; }

/* ==========================================================================
   Mobile Responsiveness Optimization Suite (Android & iOS Safari)
   Zero Desktop Degradation - Strictly Scoped to <= 768px, <= 640px, <= 420px
   ========================================================================== */

/* 1. Global Touch & Viewport Bounds (<= 768px) */
@media (max-width: 768px) {
    /* Prevent horizontal page shake and overflow */
    html, body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
        width: 100% !important;
        position: relative;
    }

    /* Prevent iOS Safari 100ms zoom jumping when tapping inputs */
    input[type="text"],
    input[type="number"],
    input[type="email"],
    input[type="url"],
    input[type="date"],
    input[type="password"],
    input[type="search"],
    select,
    textarea {
        font-size: 16px !important;
        max-width: 100% !important;
    }

    /* Breadcrumb horizontal swipe smoothing */
    .site-breadcrumb-bar .container-page {
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }
    .site-breadcrumb-bar .container-page::-webkit-scrollbar {
        display: none !important;
    }

    /* Hero section padding reduction for immediate tool focus */
    .site-main section.relative.overflow-hidden .container-page.text-center {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    /* Responsive Headings */
    h1, .text-3xl.font-bold, .md\:text-5xl {
        font-size: 1.85rem !important;
        line-height: 1.25 !important;
        word-break: break-word !important;
    }

    h2, .text-2xl.font-bold {
        font-size: 1.35rem !important;
        line-height: 1.3 !important;
    }

    /* Interactive Tool Container & Workspace Padding */
    #interactive-tool {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    #interactive-tool > div,
    .overflow-hidden.rounded-\[1\.75rem\] {
        border-radius: 1.25rem !important;
        padding: 1.25rem !important;
    }

    /* Workspace header stacking */
    #interactive-tool .border-b .flex.flex-wrap.items-center.justify-between,
    .overflow-hidden.rounded-\[1\.75rem\] > div:first-child .flex.flex-wrap {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.75rem !important;
    }

    /* Form Action Buttons: Thumb-friendly and full-width on mobile */
    #emi-btn-calc,
    #emi-btn-reset,
    #cgpa-btn-calc,
    #cgpa-btn-reset,
    #cgpa-btn-add,
    #sgpa-btn-calc,
    #sgpa-btn-reset,
    #sgpa-btn-add,
    #sd-btn-calc,
    #sd-btn-reset,
    #age-btn-calc,
    #age-btn-clear,
    #asq-btn-calc,
    #asq-btn-clear,
    #pdf-split-btn-run,
    #pdf-rotate-btn-run,
    #pdf-jpg-btn-run,
    #pdf-lock-btn-run,
    #pdf-unlock-btn-run,
    #excel-btn-run,
    #ppt-btn-run,
    #pdf-zip-btn-run,
    #conv-btn-run,
    #img-btn-run,
    #pdf-comp-btn-run,
    #pdf-uni-btn-run,
    #pdf-split-btn-dl,
    #pdf-rotate-btn-dl,
    #pdf-jpg-btn-dl-all,
    #pdf-lock-btn-dl,
    #pdf-unlock-btn-dl,
    #excel-btn-dl,
    #ppt-btn-dl,
    #pdf-zip-btn-dl,
    #conv-btn-dl,
    #img-btn-dl,
    #pdf-comp-btn-dl,
    #pdf-uni-btn-dl,
    #adsense-btn-check,
    #fortune-btn-crack,
    #social-btn-search,
    #para-btn-run,
    #plag-btn-run,
    #sent-btn-run,
    #ai-detector-btn {
        width: 100% !important;
        justify-content: center !important;
        min-height: 44px !important;
        font-size: 0.95rem !important;
    }

    /* Button groups wrapper on mobile */
    #interactive-tool .flex.flex-wrap.gap-3,
    .overflow-hidden.rounded-\[1\.75rem\] .flex.flex-wrap.gap-3 {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
    }

    /* Results Header Bar: Copy buttons & title alignment */
    #emi-result .flex.flex-wrap.items-center.justify-between,
    #cgpa-result .flex.flex-wrap.items-center.justify-between,
    #sgpa-result .flex.flex-wrap.items-center.justify-between,
    #sd-result .flex.flex-wrap.items-center.justify-between,
    #age-result .flex.flex-wrap.items-center.justify-between,
    #asq-result .flex.flex-wrap.items-center.justify-between {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.75rem !important;
    }

    #emi-btn-copy,
    #cgpa-btn-copy,
    #sgpa-btn-copy,
    #sd-btn-copy,
    #age-btn-copy,
    #asq-btn-copy {
        width: 100% !important;
        justify-content: center !important;
        min-height: 38px !important;
    }

    /* Metric cards: Ensure huge numbers do not clip or blow out cards */
    #emi-val-monthly,
    #cgpa-val-gpa,
    #sgpa-val-gpa,
    #sd-chance-val,
    #age-val-exact,
    #asq-val-interval {
        font-size: 1.75rem !important;
        line-height: 1.2 !important;
        word-break: break-all !important;
    }

    #emi-val-interest,
    #emi-val-total,
    #emi-val-tenure,
    #emi-val-ratio,
    #emi-val-pct,
    #cgpa-val-credits,
    #cgpa-val-points,
    #cgpa-val-percent,
    #cgpa-val-standing,
    #cgpa-val-exact3,
    #sgpa-val-credits,
    #sgpa-val-points,
    #sgpa-val-percent,
    #sgpa-val-standing,
    #sgpa-val-exact3 {
        word-break: break-word !important;
    }

    /* Tables: Enable smooth horizontal touch swipe and prevent column compression */
    .overflow-x-auto,
    #emi-sched-wrapper {
        -webkit-overflow-scrolling: touch !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        margin-left: -0.5rem !important;
        margin-right: -0.5rem !important;
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    .overflow-x-auto > table,
    #emi-sched-wrapper > table,
    .editorial-table-wrapper table {
        min-width: 520px !important;
        white-space: nowrap !important;
    }

    .overflow-x-auto th,
    .overflow-x-auto td,
    #emi-sched-wrapper th,
    #emi-sched-wrapper td {
        padding: 0.5rem 0.625rem !important;
        font-size: 0.75rem !important;
    }

    /* Proportional bars and labels */
    #emi-result .flex.justify-between.text-xs,
    #sd-result .flex.justify-between.text-xs {
        flex-direction: column !important;
        gap: 0.35rem !important;
    }

    /* Dynamic CGPA / SGPA row items on mobile */
    #cgpa-rows-container > div,
    #sgpa-rows-container > div {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.625rem !important;
        padding: 0.875rem !important;
    }

    #cgpa-rows-container > div > button,
    #sgpa-rows-container > div > button {
        width: 100% !important;
        min-height: 38px !important;
        justify-content: center !important;
    }

    /* Dropzones: Compact, readable on phone screens */
    #pdf-dropzone,
    .dropzone-container,
    div[id$="-dropzone"] {
        padding: 1.5rem 1rem !important;
        min-height: 150px !important;
    }

    /* PDF / Image Page Thumbnails Grid on Mobile: 2 clean columns */
    #pdf-split-pages-grid,
    #pdf-rotate-pages-grid,
    #pdf-jpg-grid,
    .pdf-pages-grid,
    .thumbnails-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.75rem !important;
    }

    /* Output textareas / code boxes */
    textarea.font-mono,
    pre,
    code {
        word-break: break-all !important;
        max-width: 100% !important;
    }

    /* Case converter buttons toolbar on mobile */
    #case-actions-bar {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 0.375rem !important;
    }

    .case-btn {
        flex: 1 1 calc(50% - 0.375rem) !important;
        text-align: center !important;
        padding: 0.5rem !important;
        font-size: 0.75rem !important;
    }

    #case-btn-trim,
    #case-btn-strip {
        flex: 1 1 100% !important;
    }

    /* Content Cards & Editorial Guides */
    .prose,
    .editorial-guide,
    article {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* FAQ accordion on mobile */
    .faq-panel > div,
    .faq-content > div {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

/* 2. Narrow Mobile Screens (<= 420px - iPhone SE, small Android devices) */
@media (max-width: 420px) {
    h1, .text-3xl.font-bold, .md\:text-5xl {
        font-size: 1.55rem !important;
    }

    h2, .text-2xl.font-bold {
        font-size: 1.2rem !important;
    }

    #interactive-tool .rounded-3xl,
    .overflow-hidden.rounded-\[1\.75rem\] {
        padding: 0.875rem !important;
    }

    /* Drop single column for thumbnail grids on very narrow screens */
    #pdf-split-pages-grid,
    #pdf-rotate-pages-grid,
    #pdf-jpg-grid {
        grid-template-columns: 1fr !important;
    }

    /* Presets wrap nicely */
    .flex.flex-wrap.gap-2.text-xs > button {
        flex: 1 1 100% !important;
        text-align: center !important;
    }

    /* Currency selector pills wrap */
    #emi-currency-bar {
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
    }
    #emi-currency-bar > button {
        flex: 1 !important;
        padding: 0.25rem !important;
    }
}

/* ==========================================================================
   Global Country & Language Translator Suite
   ========================================================================== */

/* Stealth Overrides for Google Website Translator Engine */
#google_translate_element {
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame,
iframe[class*="goog-te-banner-frame"],
iframe[id*="goog-te-banner-frame"],
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-tooltip,
.goog-tooltip:hover,
div#goog-gt-tt {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    max-height: 0 !important;
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
    pointer-events: none !important;
}

html {
    top: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body {
    top: 0 !important;
    position: static !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Eliminate font highlight artifacts added by Google Translate */
font {
    background-color: transparent !important;
    box-shadow: none !important;
}
.goog-text-highlight {
    background: transparent !important;
    box-shadow: none !important;
}

/* Sticky Top-Right Anchored Language Dropdown */
#deepseek-lang-dropdown {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px) scale(0.97);
    transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.2s;
    transform-origin: top right;
    box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
}

#deepseek-lang-dropdown.is-open {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
}

/* Country & Language Switcher at Top Right (Sticky Header) */
.deepseek-lang-trigger {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

@media (max-width: 640px) {
    .deepseek-lang-trigger {
        padding: 0.5rem 0.625rem !important;
    }
}
@media (max-width: 420px) {
    .deepseek-lang-trigger .deepseek-lang-name {
        display: none !important;
    }
}

.country-card {
    cursor: pointer;
    text-align: left;
}

.country-card:hover {
    border-color: color-mix(in oklab, var(--primary) 50%, transparent) !important;
    background-color: var(--card) !important;
}

.country-card.is-active {
    border-color: var(--primary) !important;
    background-color: color-mix(in oklab, var(--primary) 12%, transparent) !important;
    box-shadow: 0 0 0 1px var(--primary);
}

/* ==========================================================================
   Language Switcher & Sticky Anchored Dropdown (Zero Overlap on Mobile)
   ========================================================================== */
#deepseek-top-lang-widget {
    position: relative;
    z-index: 60;
}

@media (min-width: 1024px) {
    #deepseek-top-lang-widget {
        position: absolute !important;
        right: 1.5rem !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 60 !important;
    }
}

@media (max-width: 1023px) {
    #deepseek-top-lang-widget {
        position: relative !important;
        right: auto !important;
        top: auto !important;
        transform: none !important;
        z-index: 50 !important;
    }
}

/* Anchored Sticky Dropdown Menu */
#deepseek-lang-dropdown {
    display: block !important;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px) scale(0.96);
    transform-origin: top right;
    transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
                visibility 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 20px 45px -15px rgba(15, 23, 42, 0.25), 0 0 0 1px rgba(15, 23, 42, 0.08) !important;
}

#deepseek-lang-dropdown.is-open {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
}

@media (max-width: 640px) {
    #deepseek-lang-dropdown {
        right: -48px !important;
        width: min(340px, calc(100vw - 24px)) !important;
        max-width: calc(100vw - 24px) !important;
    }
}

/* Scrollbar for Countries List */
#deepseek-countries-scroll::-webkit-scrollbar {
    width: 6px;
}
#deepseek-countries-scroll::-webkit-scrollbar-track {
    background: transparent;
}
#deepseek-countries-scroll::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 9999px;
}
#deepseek-countries-scroll::-webkit-scrollbar-thumb:hover {
    background: var(--muted-foreground);
}

/* Google Website Translator Layout-Safe Positioning & Banner Suppression */
#google_translate_element {
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    overflow: hidden !important;
}

.goog-te-banner-frame,
iframe.goog-te-banner-frame,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-tooltip,
.goog-tooltip:hover {
    display: none !important;
    visibility: hidden !important;
    height: 0px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body {
    top: 0px !important;
    position: static !important;
}
html {
    top: 0px !important;
}

/* When WordPress Admin Bar is present, keep sticky header properly offset */
body.admin-bar #site-header {
    top: 32px !important;
}
@media screen and (max-width: 782px) {
    body.admin-bar #site-header {
        top: 46px !important;
    }
}

/* RTL Typography Support for Arabic, Urdu, Hebrew, Persian */
html[dir="rtl"] {
    text-align: right;
}
html[dir="rtl"] .site-header .container-page {
    direction: ltr; /* Keeps logo on left and controls on right */
}
html[dir="rtl"] #deepseek-lang-dropdown {
    direction: ltr; /* Keeps search & country cards cleanly aligned */
}