/* ================= WHITE + BLUE GLOBAL THEME ================= */
:root {
    --bg-dark: #f3f7ff;
    --card-bg: #ffffff;
    --accent: #315bff;
    --accent-hover: #00aaff;
    --text-main: #1e293b;
    --text-muted: #667085;
    --border: #dbe5f4;
    --soft-blue: #eef4ff;
    --nav-height: 74px;
    --shadow: 0 14px 34px rgba(31, 74, 180, 0.08);
}

* { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Poppins', sans-serif; -webkit-tap-highlight-color: transparent; }
html { scroll-behavior: smooth; }
body { min-height: 100vh; display: flex; flex-direction: column; background: linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%); color: var(--text-main); }
a { color: var(--accent); }
img { max-width: 100%; }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #edf4ff; }
::-webkit-scrollbar-thumb { background: #b7c8ef; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

.navbar { position: sticky; top: 0; z-index: 9999; height: var(--nav-height); background: rgba(255,255,255,0.94); border-bottom: 1px solid var(--border); box-shadow: 0 8px 28px rgba(49,91,255,0.08); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); display:flex; justify-content:center; padding:0 20px; }
.nav-container { width: 100%; max-width: 1200px; display:flex; justify-content:space-between; align-items:center; }
.nav-logo { font-size: 22px; font-weight: 800; color: var(--text-main); text-decoration:none; letter-spacing: .2px; }
.nav-logo span { color: var(--accent); }
.nav-menu { list-style:none; display:flex; align-items:center; gap: 8px; }
.nav-menu a { color: var(--text-muted); text-decoration:none; font-size: 14px; font-weight: 700; padding: 10px 14px; border-radius: 12px; transition: .2s; display:flex; align-items:center; gap: 8px; border:1px solid transparent; }
.nav-menu a:hover, .nav-menu a.active { color: var(--accent); background: var(--soft-blue); border-color:#dbe7ff; }
.nav-cta { background: linear-gradient(135deg, var(--accent), var(--accent-hover)) !important; color:#fff !important; border-color:transparent !important; box-shadow: 0 10px 22px rgba(49,91,255,.18); }
.hamburger { display:none; font-size:24px; color: var(--text-main); cursor:pointer; }
main.container { flex:1; width:100%; max-width:1200px; margin:0 auto; padding:22px 20px; }

.card, .stat-card, .creator-card, .link-card, .settings-card, .edit-container, .unlock-box, .feature-card, .auth-box, .settings-box, .table-card, .admin-header, .final-card, .sponsor-container, .unlock-card:not(.task-btn), .profile-header, .section-box, .empty-box, .page-card { background:#fff !important; color:var(--text-main) !important; border:1px solid var(--border) !important; box-shadow:var(--shadow) !important; }
h1,h2,h3,h4,h5,h6,.section-title,.settings-title,.admin-title,.card-title,.feature-head,.user-name,.stat-num,.manage-heading,.header-title,.footer-title,.footer-brand,.unlock-box h2,.auth-box h2,.table-card h3 { color:var(--text-main) !important; text-shadow:none !important; }
p,.section-desc,.feature-text,.target-url,.auth-subtitle,.bottom-link,.footer-desc,.footer-bottom,.user-join,.stat-lbl,label,.input-label,.desc,p.desc,.table-card td,.admin-header a { color:var(--text-muted) !important; }
.input-box,.auth-input,.admin-input,textarea.admin-input,input[type="text"],input[type="url"],input[type="email"],input[type="password"],input[type="number"],textarea,select { background:#f5f8ff !important; color:var(--text-main) !important; border:1px solid #d8e3f4 !important; border-radius:14px; }
.input-box:focus,.auth-input:focus,.admin-input:focus,input:focus,textarea:focus,select:focus { background:#fff !important; border-color:var(--accent) !important; box-shadow:0 0 0 4px rgba(49,91,255,.12) !important; outline:none; }
.btn-generate,.btn-update,.btn-submit,.btn-primary,.btn-final,.btn-unlock.ready,.btn-main.btn-final,.primary-btn { background:linear-gradient(135deg,var(--accent),var(--accent-hover)) !important; color:#fff !important; border:none !important; box-shadow:0 12px 28px rgba(49,91,255,.22) !important; }
.btn-action,.action-btn.a-del,.a-del { background:var(--soft-blue) !important; color:var(--accent) !important; border:1px solid #dbe7ff !important; }
.btn-action:hover,.action-btn.a-del:hover,.a-del:hover { background:var(--accent) !important; color:#fff !important; border-color:var(--accent) !important; }
.badge,.admin-badge,.user-role { background:var(--soft-blue) !important; color:var(--accent) !important; border:1px solid #dbe7ff !important; }
.notice.success,.alert.success,.alert-success,.success-msg { background:var(--soft-blue) !important; color:var(--accent) !important; border:1px solid #dbe7ff !important; }
.notice.error,.alert.error,.alert-error,.error-msg { background:#fff4f6 !important; color:#e11d48 !important; border:1px solid #ffd3dc !important; }

.site-section { padding: 70px 0; }
.section-kicker { color: var(--accent); font-weight:800; text-transform:uppercase; font-size:13px; letter-spacing:1px; margin-bottom:10px; }
.section-heading { font-size: clamp(28px, 5vw, 44px); line-height:1.1; color:var(--text-main); margin-bottom:14px; }
.section-sub { color:var(--text-muted); max-width: 720px; line-height:1.7; font-size:16px; }
.grid-auto { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px; }
.clean-card { background:#fff; border:1px solid var(--border); border-radius:24px; padding:24px; box-shadow:var(--shadow); }
.icon-circle { width:52px; height:52px; border-radius:16px; background:var(--soft-blue); color:var(--accent); display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:16px; }

.premium-footer { background:#ffffff; border-top:1px solid var(--border); padding:50px 20px 20px; color:var(--text-muted); margin-top:auto; }
.footer-grid { max-width:1200px; margin:0 auto 35px; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:34px; }
.footer-brand { display:inline-block; text-decoration:none; font-size:22px; font-weight:800; color:var(--text-main); margin-bottom:12px; }
.footer-title { font-size:15px; font-weight:800; text-transform:uppercase; letter-spacing:.7px; margin-bottom:16px; color:var(--text-main); }
.footer-desc { line-height:1.7; }
.footer-links { list-style:none; }
.footer-links li { margin-bottom:10px; }
.footer-links a { text-decoration:none; color:var(--text-muted); display:inline-flex; gap:8px; align-items:center; transition:.2s; }
.footer-links a:hover { color:var(--accent); transform:translateX(3px); }
.social-icons { display:flex; flex-wrap:wrap; gap:10px; }
.social-icons a { width:40px; height:40px; border-radius:50%; background:var(--soft-blue); color:var(--accent); display:flex; align-items:center; justify-content:center; text-decoration:none; border:1px solid #dbe7ff; }
.social-icons a:hover { background:var(--accent); color:#fff; }
.footer-bottom { max-width:1200px; margin:0 auto; padding-top:20px; border-top:1px solid var(--border); text-align:center; font-size:13px; }
#copyToast { visibility:hidden; min-width:250px; background:var(--accent); color:#fff; text-align:center; border-radius:12px; padding:12px 20px; position:fixed; z-index:10000; left:50%; bottom:30px; transform:translateX(-50%); font-size:14px; font-weight:700; opacity:0; transition:.25s; box-shadow:0 8px 24px rgba(49,91,255,.28); }
#copyToast.show { visibility:visible; opacity:1; bottom:50px; }

@media (max-width: 1100px) { .footer-grid { grid-template-columns:1fr 1fr; } }
@media (max-width: 1100px) {
    .hamburger { display:block; }
    .nav-menu { position:absolute; top:var(--nav-height); left:-100%; width:100%; background:rgba(255,255,255,.98); border-bottom:1px solid var(--border); box-shadow:0 15px 40px rgba(49,91,255,.12); flex-direction:column; padding:22px; gap:12px; transition:.3s; }
    .nav-menu.active { left:0; }
    .nav-menu a { width:100%; justify-content:center; background:#f6f9ff; }
    main.container { padding:16px; }
    .footer-grid { grid-template-columns:1fr; text-align:center; }
    .footer-links a { justify-content:center; }
    .social-icons { justify-content:center; }
    table,thead,tbody,th,td,tr { display:block; width:100%; }
    thead tr { position:absolute; top:-9999px; left:-9999px; }
    tr { margin-bottom:15px; background:#fff; border-radius:16px; padding:15px; border:1px solid var(--border); }
    td { border:none; position:relative; padding-left:50%; text-align:right; padding-bottom:12px; border-bottom:1px solid var(--border); margin-bottom:12px; font-size:14px; }
    td:last-child { border-bottom:none; margin-bottom:0; padding-bottom:0; }
    td:before { position:absolute; left:15px; width:45%; text-align:left; font-weight:800; content:attr(data-label); color:var(--text-muted); font-size:12px; text-transform:uppercase; }
}


/* =============== ACCORDION + / - COMPONENT =============== */
.accordion-list{display:grid;gap:14px;margin-top:28px;}
.accordion-item{background:#fff;border:1px solid #dbe5f4;border-radius:20px;box-shadow:0 14px 34px rgba(31,74,180,.08);overflow:hidden;}
.accordion-toggle{width:100%;border:none;background:transparent;color:#0f172a;cursor:pointer;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;font-size:16px;font-weight:800;}
.accordion-toggle .acc-title{display:inline-flex;align-items:center;gap:12px;}
.accordion-toggle .acc-icon-left{width:38px;height:38px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;background:#eef4ff;color:#315bff;flex:0 0 38px;}
.accordion-toggle .acc-symbol{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#315bff,#00aaff);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;flex:0 0 34px;}
.accordion-toggle .acc-symbol::before{content:"+";line-height:1;}
.accordion-item.open .accordion-toggle .acc-symbol::before{content:"−";}
.accordion-body{display:none;padding:0 20px 20px 70px;color:#667085;font-size:15px;line-height:1.75;}
.accordion-item.open .accordion-body{display:block;}
.faq-list{display:grid;gap:14px;margin-top:24px;}
.faq-list .faq-item{background:#fff!important;border:1px solid #dbe5f4!important;border-radius:20px!important;box-shadow:0 14px 34px rgba(31,74,180,.08)!important;padding:0!important;overflow:hidden!important;}
.faq-list .faq-item h3{margin:0!important;}
@media(max-width:640px){.accordion-toggle{padding:16px;font-size:15px;align-items:flex-start;}.accordion-body{padding:0 16px 18px 16px;}.accordion-toggle .acc-icon-left{width:34px;height:34px;flex-basis:34px;}}


/* ================= FINAL POLISH RESPONSIVE PATCH ================= */
html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

body {
    text-rendering: optimizeLegibility;
}

button, input, textarea, select {
    font: inherit;
}

button {
    touch-action: manipulation;
}

a, .short-link, .target-url, .badge, .footer-desc {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Header final guard: keeps navbar white/blue even if older inline styles exist */
.navbar, body > nav.navbar {
    background: rgba(255,255,255,0.97) !important;
    border-bottom: 1px solid #dbe5f4 !important;
    box-shadow: 0 8px 28px rgba(49,91,255,0.08) !important;
}

.nav-logo,
.navbar .nav-logo,
.hamburger {
    color: #0f172a !important;
}

.navbar .nav-menu {
    background: transparent !important;
}

.navbar .nav-menu a {
    color: #667085 !important;
    background: transparent !important;
    border-color: transparent !important;
}

.navbar .nav-menu a:hover,
.navbar .nav-menu a.active {
    color: #315bff !important;
    background: #eef4ff !important;
    border-color: #dbe7ff !important;
}

.navbar .nav-menu a.nav-cta {
    background: linear-gradient(135deg,#315bff,#00aaff) !important;
    color: #fff !important;
    border-color: transparent !important;
}

/* Common layout polish */
main.container {
    width: min(1200px, 100%);
    padding-inline: clamp(14px, 3vw, 22px);
}

.site-section,
.hero,
.dashboard-container,
.settings-container,
.edit-container,
.unlock-shell,
.hero-container {
    max-width: 100%;
}

.card, .stat-card, .creator-card, .link-card, .settings-card, .edit-container,
.unlock-box, .feature-card, .auth-box, .settings-box, .table-card, .admin-header,
.final-card, .sponsor-container, .unlock-card:not(.task-btn), .profile-header,
.section-box, .empty-box, .page-card, .clean-card, .step-card, .faq-item, .password-card {
    border-radius: clamp(18px, 2vw, 26px) !important;
}

/* Responsive grids */
.input-grid,
.grid-2,
.grid-3,
.stats-grid,
.features-grid,
.steps-grid,
.clean-grid,
.admin-grid,
.settings-container {
    min-width: 0;
}

.grid-2 > *,
.grid-3 > *,
.input-grid > *,
.stats-grid > *,
.features-grid > *,
.steps-grid > *,
.clean-grid > *,
.admin-grid > *,
.settings-container > * {
    min-width: 0;
}

/* Better tables on dashboard/admin mobile */
.table-wrap,
.table-responsive,
.admin-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

table {
    max-width: 100%;
    border-collapse: collapse;
}

/* Accordion final polish */
.accordion-toggle {
    min-height: 64px;
}
.accordion-toggle:focus-visible,
.btn-action:focus-visible,
.btn-generate:focus-visible,
.btn-update:focus-visible,
.btn-submit:focus-visible,
.hero-btn:focus-visible,
.lang-btn:focus-visible,
.task-btn:focus-visible,
.action-btn:focus-visible {
    outline: 3px solid rgba(49,91,255,0.28) !important;
    outline-offset: 2px;
}

/* Tablet */
@media (max-width: 1100px) {
    :root { --nav-height: 70px; }

    .hamburger {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        border: 1px solid #dbe7ff !important;
        border-radius: 14px !important;
        background: #eef4ff !important;
        color: #0f172a !important;
    }

    .nav-menu {
        position: absolute !important;
        top: var(--nav-height) !important;
        left: -100% !important;
        width: 100% !important;
        max-height: calc(100vh - var(--nav-height)) !important;
        overflow-y: auto !important;
        background: rgba(255,255,255,0.99) !important;
        border-bottom: 1px solid #dbe5f4 !important;
        box-shadow: 0 18px 44px rgba(49,91,255,0.12) !important;
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 16px !important;
        gap: 10px !important;
        transition: left .25s ease !important;
    }

    .nav-menu.active { left: 0 !important; }

    .nav-menu li { width: 100% !important; }

    .nav-menu a {
        width: 100% !important;
        justify-content: center !important;
        padding: 14px 16px !important;
        background: #f6f9ff !important;
        border: 1px solid #e4ecf8 !important;
        border-radius: 14px !important;
    }

    .hero {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        padding: 34px 0 48px !important;
    }

    .hero h1 { text-align: left; }

    .hero-mock { max-width: 680px; width: 100%; margin-inline: auto; }

    .stats-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .link-card {
        grid-template-columns: 1fr !important;
    }

    .link-actions {
        width: 100%;
        grid-template-columns: repeat(4, minmax(0,1fr)) !important;
    }

    .btn-action {
        width: 100% !important;
        min-height: 52px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    :root { --nav-height: 66px; }

    main.container {
        padding: 14px !important;
    }

    .nav-logo {
        font-size: 20px !important;
    }

    .hero {
        padding-top: 28px !important;
    }

    .hero h1 {
        font-size: clamp(32px, 10vw, 44px) !important;
        letter-spacing: -0.8px !important;
    }

    .hero p,
    .section-sub,
    .section-desc {
        font-size: 15px !important;
        line-height: 1.65 !important;
    }

    .hero-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100%;
    }

    .hero-btn {
        width: 100%;
        justify-content: center;
    }

    .mock-actions,
    .input-grid,
    .grid-2,
    .grid-3,
    .settings-container,
    .stats-grid,
    .features-grid,
    .steps-grid,
    .clean-grid,
    .admin-grid {
        grid-template-columns: 1fr !important;
    }

    .action-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }

    .action-btn {
        min-height: 58px;
        padding: 12px !important;
        font-size: 13px !important;
    }

    .action-btn .toggle-symbol {
        width: 30px !important;
        height: 30px !important;
        flex-basis: 30px !important;
    }

    .creator-card,
    .unlock-box,
    .edit-container,
    .settings-card,
    .admin-header,
    .table-card,
    .page-card,
    .clean-card {
        padding: 18px !important;
    }

    .section-heading,
    .manage-heading {
        font-size: clamp(24px, 8vw, 34px) !important;
    }

    .short-link {
        font-size: 18px !important;
        line-height: 1.35 !important;
    }

    .target-url {
        align-items: flex-start !important;
        font-size: 13px !important;
    }

    .meta-badges {
        gap: 8px !important;
    }

    .badge {
        font-size: 12px !important;
        padding: 7px 10px !important;
    }

    .link-actions {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 10px !important;
    }

    .btn-action {
        height: 50px !important;
        min-height: 50px;
        border-radius: 14px !important;
    }

    .unlock-card {
        padding: 18px 14px 22px !important;
    }

    .task-list {
        grid-template-columns: 1fr !important;
    }

    .task-btn {
        min-height: 66px !important;
        padding: 13px !important;
    }

    .accordion-toggle {
        padding: 15px !important;
        font-size: 15px !important;
    }

    .accordion-toggle .acc-title {
        align-items: flex-start !important;
    }

    .accordion-body {
        padding: 0 16px 18px 16px !important;
    }

    /* Tables become cards */
    table, thead, tbody, th, td, tr { display: block; width: 100%; }
    thead tr { position: absolute; top: -9999px; left: -9999px; }
    tr {
        margin-bottom: 14px;
        background: #fff;
        border-radius: 16px;
        padding: 14px;
        border: 1px solid #dbe5f4;
        box-shadow: 0 10px 24px rgba(31,74,180,0.06);
    }
    td {
        border: none;
        position: relative;
        padding-left: 48%;
        text-align: right;
        padding-bottom: 11px;
        border-bottom: 1px solid #edf2fb;
        margin-bottom: 11px;
        font-size: 14px;
        min-height: 32px;
    }
    td:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
    td:before {
        position: absolute;
        left: 0;
        width: 44%;
        text-align: left;
        font-weight: 800;
        content: attr(data-label);
        color: #667085;
        font-size: 12px;
        text-transform: uppercase;
    }
}

/* Small mobile */
@media (max-width: 430px) {
    main.container {
        padding-inline: 12px !important;
    }

    .action-grid {
        grid-template-columns: 1fr !important;
    }

    .link-actions {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .hero-mock,
    .quick-create,
    .creator-card,
    .link-card,
    .unlock-card,
    .final-card,
    .site-footer2 .support-box {
        border-radius: 18px !important;
    }

    .mock-pill {
        padding: 13px 12px !important;
        font-size: 13px !important;
    }

    .badge {
        width: auto;
    }

    .footer-brand {
        font-size: 24px !important;
    }
}

/* Large screens polish */
@media (min-width: 1400px) {
    main.container,
    .nav-container,
    .site-footer2 .footer-wrap {
        max-width: 1240px !important;
    }
}

/* ===== Final audited polish: fonts, responsive ads, compact footer ===== */
html, body { font-family: Inter, "Noto Sans Devanagari", "Noto Sans Bengali", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; }
iframe { max-width: 100%; }
@media (max-width: 640px) {
    .site-footer2 .footer-wrap { padding-top: 24px !important; padding-bottom: 14px !important; }
    .site-footer2 .footer-grid { gap: 20px !important; }
    .unlock-ad-slot iframe, .final-ad-slot iframe { max-width: 100% !important; }
}

/* ================= DARK MODE ================= */
html.dark-mode {
    --bg-dark: #0b0e14;
    --card-bg: #151922;
    --accent: #4f7fff;
    --accent-hover: #22c1ff;
    --text-main: #e7ecf5;
    --text-muted: #9aa5b5;
    --border: #232a38;
    --soft-blue: #1b2233;
    --shadow: 0 14px 34px rgba(0,0,0,0.35);
}
html.dark-mode { background: linear-gradient(180deg, #0b0e14 0%, #0f1420 100%) !important; }
html.dark-mode .navbar { background: rgba(11,14,20,0.92) !important; border-bottom: 1px solid var(--border) !important; }
html.dark-mode .card, html.dark-mode .stat-card, html.dark-mode .creator-card, html.dark-mode .link-card,
html.dark-mode .settings-card, html.dark-mode .edit-container, html.dark-mode .unlock-box, html.dark-mode .feature-card,
html.dark-mode .auth-box, html.dark-mode .settings-box, html.dark-mode .table-card, html.dark-mode .admin-header,
html.dark-mode .final-card, html.dark-mode .sponsor-container, html.dark-mode .unlock-card:not(.task-btn),
html.dark-mode .profile-header, html.dark-mode .section-box, html.dark-mode .empty-box, html.dark-mode .page-card {
    background: var(--card-bg) !important; color: var(--text-main) !important; border: 1px solid var(--border) !important; box-shadow: var(--shadow) !important;
}
html.dark-mode .input-box, html.dark-mode .auth-input, html.dark-mode .admin-input, html.dark-mode textarea.admin-input,
html.dark-mode input[type="text"], html.dark-mode input[type="url"], html.dark-mode input[type="email"],
html.dark-mode input[type="password"], html.dark-mode input[type="number"], html.dark-mode textarea, html.dark-mode select {
    background: #0f1420 !important; color: var(--text-main) !important; border: 1px solid var(--border) !important;
}
html.dark-mode ::-webkit-scrollbar-track { background: #0f1420; }
html.dark-mode ::-webkit-scrollbar-thumb { background: #2a3242; }
html.dark-mode .lt-search input, html.dark-mode .lt-select, html.dark-mode .links-toolbar { background: #0f1420 !important; border-color: var(--border) !important; color: var(--text-main) !important; }
html.dark-mode .links-toolbar { background: #151922 !important; }

/* Toggle switch UI */
.theme-toggle-btn { display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:12px; border:1px solid var(--border); background:var(--soft-blue); color:var(--accent); cursor:pointer; font-size:15px; transition:.2s; }
.theme-toggle-btn:hover { background: var(--accent); color:#fff; }