/* Shared premium visual layer (glass + modern palette) */
:root {
    --premium-ink: #111a2e;
    --premium-muted: #54617a;
    --premium-line: rgba(140, 156, 184, 0.34);
    --premium-line-strong: rgba(114, 134, 170, 0.52);
    --premium-glass: rgba(255, 255, 255, 0.68);
    --premium-glass-soft: rgba(255, 255, 255, 0.56);
    --premium-shadow: 0 20px 52px rgba(19, 30, 52, 0.18);
    --premium-shadow-soft: 0 12px 28px rgba(19, 30, 52, 0.12);
    --premium-brand: #0d9f8a;
    --premium-brand-dark: #0b7d74;
    --premium-accent: #2f67ec;
}

body.theme-landing,
body.theme-auth,
body.theme-admin,
body.theme-public-survey {
    position: relative;
    isolation: isolate;
}

body.theme-landing::before,
body.theme-auth::before,
body.theme-admin::before,
body.theme-public-survey::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(circle at 8% 12%, rgba(28, 189, 166, 0.2), transparent 32%),
        radial-gradient(circle at 84% 10%, rgba(55, 112, 236, 0.2), transparent 28%),
        radial-gradient(circle at 18% 88%, rgba(77, 153, 246, 0.16), transparent 30%),
        linear-gradient(180deg, #f5f9ff 0%, #f6fffb 42%, #f8f8ff 100%);
}

body.theme-landing {
    color: var(--premium-ink);
}

.theme-landing .site-nav {
    border-bottom: 1px solid var(--premium-line);
    background: rgba(255, 255, 255, 0.64);
    backdrop-filter: blur(18px) saturate(140%);
    box-shadow: 0 10px 34px rgba(19, 30, 52, 0.08);
}

.theme-landing .brand {
    letter-spacing: 0;
}

.theme-landing .hero {
    background: transparent;
    border-bottom: 0;
}

.theme-landing .hero-img {
    border-color: rgba(126, 154, 196, 0.32);
    box-shadow: 0 24px 54px rgba(20, 34, 62, 0.24);
}

.theme-landing .feature-card,
.theme-landing .pricing-box {
    border: 1px solid var(--premium-line);
    background: var(--premium-glass);
    backdrop-filter: blur(18px) saturate(140%);
    box-shadow: var(--premium-shadow-soft);
}

.theme-landing .pricing-box {
    border-color: rgba(70, 120, 215, 0.35);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.06)),
        linear-gradient(135deg, #1848a6 0%, #0e8f8c 100%);
}

.theme-landing .btn-main {
    background: linear-gradient(135deg, var(--premium-accent), var(--premium-brand));
    border-color: transparent;
    box-shadow: 0 12px 24px rgba(40, 108, 227, 0.24);
}

.theme-landing .btn-main:hover {
    background: linear-gradient(135deg, #2a58c4, #0b7d74);
}

.theme-landing .btn-ghost {
    background: rgba(255, 255, 255, 0.62);
    border-color: var(--premium-line);
    backdrop-filter: blur(12px) saturate(130%);
}

body.theme-auth {
    min-height: 100vh;
    background: transparent;
}

.theme-auth .auth-card {
    border: 1px solid var(--premium-line);
    background: var(--premium-glass);
    backdrop-filter: blur(20px) saturate(142%);
    box-shadow: var(--premium-shadow);
}

.theme-auth .form-control {
    border-radius: 8px;
    border-color: rgba(126, 148, 182, 0.48);
    background: rgba(255, 255, 255, 0.78);
}

.theme-auth .form-control:focus {
    border-color: rgba(47, 103, 236, 0.72);
    box-shadow: 0 0 0 0.18rem rgba(47, 103, 236, 0.16);
}

.theme-auth .btn-primary {
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--premium-accent), var(--premium-brand));
    box-shadow: 0 12px 24px rgba(40, 108, 227, 0.24);
}

.theme-auth .btn-primary:hover {
    background: linear-gradient(135deg, #2b5bc9, #0b7d74);
}

body.theme-admin {
    background: transparent;
    color: var(--premium-ink);
}

.theme-admin .admin-shell-nav {
    background: rgba(255, 255, 255, 0.6);
    border-bottom-color: var(--premium-line);
    box-shadow: 0 10px 32px rgba(17, 29, 52, 0.1);
    backdrop-filter: blur(20px) saturate(145%);
}

.theme-admin .admin-brand-mark {
    border-color: rgba(91, 208, 177, 0.45);
    background: linear-gradient(150deg, rgba(239, 255, 250, 0.98), rgba(233, 241, 255, 0.95));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.62);
}

.theme-admin .admin-nav-link {
    color: #344264;
}

.theme-admin .admin-nav-link.active {
    background: linear-gradient(135deg, #2158cb, #0d9f8a);
    box-shadow: 0 10px 24px rgba(26, 82, 181, 0.3);
}

.theme-admin .admin-logout {
    background: rgba(255, 255, 255, 0.64);
    border-color: var(--premium-line);
    backdrop-filter: blur(10px);
}

.theme-admin .admin-page,
.theme-admin .results-page,
.theme-admin .builder-shell {
    position: relative;
    z-index: 1;
}

.theme-admin .idea-card,
.theme-admin .plan-card,
.theme-admin .metric-card,
.theme-admin .recent-panel,
.theme-admin .empty-panel,
.theme-admin .toolbar,
.theme-admin .survey-panel,
.theme-admin .surface,
.theme-admin .section-card,
.theme-admin .question-card,
.theme-admin .table-shell,
.theme-admin .response-detail-panel,
.theme-admin .editor-card,
.theme-admin .preview-card,
.theme-admin .side-panel,
.theme-admin .public-link-card,
.theme-admin .mini-survey,
.theme-admin .logo-upload,
.theme-admin .template-card,
.theme-admin .status-note {
    background: var(--premium-glass);
    border-color: var(--premium-line);
    backdrop-filter: blur(18px) saturate(138%);
    box-shadow: var(--premium-shadow-soft);
}

.theme-admin .list-head {
    background:
        linear-gradient(135deg, rgba(47, 103, 236, 0.88), rgba(13, 159, 138, 0.9));
}

.theme-admin .ui-btn.primary,
.theme-admin .icon-action.primary,
.theme-admin .btn-main,
.theme-admin .small-btn.primary {
    background: linear-gradient(135deg, var(--premium-accent), var(--premium-brand-dark));
    border-color: transparent;
    box-shadow: 0 12px 24px rgba(28, 92, 205, 0.24);
}

.theme-admin .ui-btn,
.theme-admin .small-btn,
.theme-admin .icon-action,
.theme-admin .pill-btn,
.theme-admin .link-icon-btn,
.theme-admin .copy-url-btn,
.theme-admin .back-link,
.theme-admin .response-detail-close,
.theme-admin .icon-btn {
    background: rgba(255, 255, 255, 0.66);
    border-color: var(--premium-line);
    backdrop-filter: blur(8px) saturate(130%);
}

.theme-admin .form-control,
.theme-admin .form-select,
.theme-admin .control,
.theme-admin .control-with-icon input,
.theme-admin .public-link-row input,
.theme-admin .toolbar input,
.theme-admin .toolbar select {
    border-color: rgba(125, 146, 178, 0.44);
    background: rgba(255, 255, 255, 0.76);
}

.theme-admin .form-control:focus,
.theme-admin .form-select:focus,
.theme-admin .control:focus,
.theme-admin .control-with-icon input:focus,
.theme-admin .toolbar input:focus,
.theme-admin .toolbar select:focus,
.theme-admin .public-link-row input:focus {
    border-color: rgba(47, 103, 236, 0.72);
    box-shadow: 0 0 0 0.18rem rgba(47, 103, 236, 0.15);
}

.theme-admin .chart-shell {
    background: rgba(255, 255, 255, 0.68);
    border-color: var(--premium-line);
}

.theme-admin .metric-grid,
.theme-admin .highlight-grid {
    background: rgba(255, 255, 255, 0.34);
}

.theme-admin .survey-row:hover,
.theme-admin .responses-table tr:hover td,
.theme-admin .mobile-response-card:hover,
.theme-admin .question-card:hover {
    background: rgba(255, 255, 255, 0.84);
}

body.theme-public-survey {
    background: transparent;
}

.theme-public-survey .survey-card {
    background:
        linear-gradient(
            160deg,
            color-mix(in srgb, var(--card) 58%, #ffffff 42%) 0%,
            color-mix(in srgb, var(--card) 22%, transparent 78%) 100%
        );
    border-color: color-mix(in srgb, var(--line) 62%, #ffffff 38%);
    box-shadow:
        0 34px 76px rgba(19, 30, 52, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.52);
    backdrop-filter: blur(24px) saturate(152%);
}

.theme-public-survey .survey-head {
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--card) 44%, transparent 56%) 0%,
            color-mix(in srgb, var(--card) 16%, transparent 84%) 100%
        );
    border-bottom-color: color-mix(in srgb, var(--line) 70%, #ffffff 30%);
}

.theme-public-survey .survey-body {
    background: color-mix(in srgb, var(--card) 16%, transparent 84%);
}

.theme-public-survey .preview-banner,
.theme-public-survey .choice,
.theme-public-survey .scale-choice,
.theme-public-survey .rating-choice,
.theme-public-survey textarea,
.theme-public-survey input[type="text"],
.theme-public-survey input[type="email"],
.theme-public-survey input[type="tel"],
.theme-public-survey input[type="date"] {
    backdrop-filter: blur(8px) saturate(135%);
    background: color-mix(in srgb, var(--card) 22%, #ffffff 78%);
    border-color: color-mix(in srgb, var(--line) 68%, #ffffff 32%);
}

.theme-public-survey .survey-brand {
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
    justify-content: flex-start;
    min-height: 0;
    margin-bottom: 26px;
}

.theme-public-survey .brand-logo {
    filter: drop-shadow(0 8px 18px rgba(19, 30, 52, 0.16));
}

.theme-public-survey .submit-btn {
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 72%, #2f67ec 28%), var(--primary));
    box-shadow: 0 14px 28px color-mix(in srgb, var(--primary) 34%, transparent);
}

.theme-public-survey .scale-choice.selected,
.theme-public-survey .scale-choice:has(input:checked) {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary) 26%, transparent);
}

.theme-public-survey .success-icon,
.theme-public-survey .art-check {
    font-size: 0;
}

.theme-public-survey .success-icon::before {
    content: "\2713";
    font-size: 34px;
    line-height: 1;
}

.theme-public-survey .art-check::before {
    content: "\2713";
    font-size: 42px;
    line-height: 1;
}

.theme-public-survey .rating-choice span {
    font-size: 0;
    line-height: 1;
}

.theme-public-survey .rating-choice span::before {
    content: "\2605";
    font-size: 31px;
    line-height: 1;
}

.theme-public-survey .powered {
    background: color-mix(in srgb, var(--card) 72%, #ffffff 28%);
}

@media (max-width: 980px) {
    .theme-admin .side-panel,
    .theme-admin .preview-card {
        backdrop-filter: blur(14px) saturate(130%);
    }
}

@media (max-width: 760px) {
    .theme-landing .site-nav,
    .theme-admin .admin-shell-nav {
        backdrop-filter: blur(14px) saturate(130%);
    }
}

body.premium-dialog-open {
    overflow: hidden;
}

.premium-dialog-overlay {
    position: fixed;
    inset: 0;
    z-index: 2200;
    display: grid;
    place-items: center;
    padding: 22px;
    background: rgba(16, 23, 38, 0.44);
    backdrop-filter: blur(8px) saturate(140%);
    opacity: 0;
    transition: opacity .18s ease;
}

.premium-dialog-overlay.is-open {
    opacity: 1;
}

.premium-dialog {
    width: min(100%, 460px);
    border: 1px solid rgba(145, 166, 203, 0.45);
    border-radius: 8px;
    padding: 16px;
    background:
        linear-gradient(165deg, rgba(255, 255, 255, 0.9), rgba(248, 252, 255, 0.82));
    box-shadow: 0 26px 64px rgba(14, 27, 52, 0.28);
    backdrop-filter: blur(18px) saturate(145%);
}

.premium-dialog-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.premium-dialog-icon {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
}

.premium-dialog-title {
    margin: 0;
    color: #14213d;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0;
}

.premium-dialog-message {
    margin: 0;
    color: #41516f;
    line-height: 1.5;
    font-size: 14px;
}

.premium-dialog-actions {
    margin-top: 14px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.premium-dialog-btn {
    min-height: 36px;
    border-radius: 8px;
    border: 1px solid transparent;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0;
}

.premium-dialog-btn-ghost {
    border-color: rgba(126, 145, 180, 0.48);
    background: rgba(255, 255, 255, 0.64);
    color: #203151;
}

.premium-dialog-btn-main {
    background: linear-gradient(135deg, #2f67ec, #0d9f8a);
    color: #fff;
    box-shadow: 0 10px 20px rgba(43, 97, 216, 0.24);
}

.premium-dialog-btn:hover {
    filter: brightness(.98);
}

.premium-dialog-overlay.tone-info .premium-dialog-icon {
    background: rgba(56, 121, 238, 0.16);
    color: #2f67ec;
}

.premium-dialog-overlay.tone-success .premium-dialog-icon {
    background: rgba(16, 185, 129, 0.16);
    color: #0c8b67;
}

.premium-dialog-overlay.tone-warn .premium-dialog-icon {
    background: rgba(245, 158, 11, 0.2);
    color: #a26102;
}

.premium-dialog-overlay.tone-danger .premium-dialog-icon {
    background: rgba(239, 68, 68, 0.18);
    color: #b71f1f;
}

.premium-dialog-overlay.tone-danger .premium-dialog-btn-main {
    background: linear-gradient(135deg, #dc2626, #f97316);
}

@media (max-width: 560px) {
    .premium-dialog {
        padding: 14px;
    }

    .premium-dialog-actions {
        flex-direction: column-reverse;
    }

    .premium-dialog-btn {
        width: 100%;
    }
}