/**
 * Account page (#account-app) — no Tailwind required
 */
.site-ui.account-page #account-app {
    display: grid;
    gap: 1.25rem;
}

.site-ui.account-page #account-app > section,
.site-ui.account-page #account-app > div {
    border-radius: var(--mb-radius-lg, 16px);
    border: 1px solid var(--mb-line, #d8e6f7);
    background: #fff;
    box-shadow: var(--mb-shadow-sm);
    padding: 1.5rem 1.6rem;
}

.site-ui.account-page #account-app .border-amber-200 {
    border-color: #fde68a !important;
    background: #fffbeb !important;
}

.site-ui.account-page #account-app .text-amber-950 {
    color: #78350f;
}

.site-ui.account-page #account-app .text-amber-900 {
    color: #92400e;
}

.site-ui.account-page #account-app .status-pill {
    display: inline-flex;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    background: #F2FEF9;
    color: #0B6B50;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.site-ui.account-page #account-app h1 {
    margin: 0.75rem 0 0.35rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--mb-navy, #172033);
    letter-spacing: -0.02em;
}

.site-ui.account-page #account-app h2 {
    margin: 0 0 0.75rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--mb-navy, #172033);
    letter-spacing: -0.01em;
}

.site-ui.account-page #account-app section > p.text-sm,
.site-ui.account-page #account-app section > p.text-muted {
    color: #64748b;
    line-height: 1.6;
}

.site-ui.account-page #account-app .animate-pulse {
    background: #e8f4eb !important;
    border-radius: 10px;
}

.site-ui.account-page #account-app button,
.site-ui.account-page #account-app .mb-btn {
    border-radius: 10px;
    font-weight: 700;
}

.site-ui.account-page main {
    padding-top: 2rem;
    padding-bottom: 3.5rem;
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 35%);
}

.site-ui.account-page #account-app > section:first-child,
.site-ui.account-page #account-app .account-login-card {
    border: 1px solid #e2e8f0;
}

.site-ui.account-page #account-app input,
.site-ui.account-page #account-app select,
.site-ui.account-page #account-app textarea {
    min-height: 44px;
    border-radius: 10px;
    border: 1px solid #cbd5e1;
}

.site-ui.account-page #account-app input:focus,
.site-ui.account-page #account-app select:focus,
.site-ui.account-page #account-app textarea:focus {
    outline: none;
    border-color: #7EE0BF;
    box-shadow: 0 0 0 3px rgba(15, 138, 102, 0.12);
}

.site-ui.account-page #account-app .grid {
    gap: 0.85rem;
}

@media (min-width: 900px) {
    .site-ui.account-page #account-app {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .site-ui.account-page #account-app > .account-login-card,
    .site-ui.account-page #account-app > section:only-child,
    .site-ui.account-page #account-app > div:only-child {
        grid-column: 1 / -1;
    }
}

.site-ui.account-page #account-app > section:first-child,
.site-ui.account-page #account-app .account-login-card {
    border-radius: var(--mb-radius-lg, 16px);
}

.site-ui.account-page #account-app .account-login-card h1 {
    margin: 0 0 0.5rem;
}

.site-ui.account-page #account-app dl > div.rounded-lg {
    border-radius: 12px !important;
    border-color: var(--mb-line, #d8e6f7) !important;
    background: #f8fafc;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.site-ui.account-page #account-app dl > div.rounded-lg:hover {
    border-color: #B9F0DD !important;
    box-shadow: var(--mb-shadow-sm);
}

.site-ui.account-page #account-app #delete-account {
    background: #fef2f2 !important;
    border-color: #fecaca !important;
    color: #b91c1c !important;
}

.site-ui.account-page #account-app #delete-account:hover {
    background: #fee2e2 !important;
    border-color: #fca5a5 !important;
    color: #991b1b !important;
}

.site-ui.account-page #account-app .rounded-xl.border.bg-white.p-6.text-sm {
    border-radius: var(--mb-radius-lg, 16px) !important;
    border-color: var(--mb-line, #d8e6f7) !important;
    color: #64748b;
    text-align: center;
    padding: 2rem 1.5rem !important;
}

.site-ui.account-page #account-app .grid.gap-4 > div,
.site-ui.account-page #account-app .grid.gap-6 > div {
    padding: 1rem;
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.site-ui.account-page #account-app dl {
    display: grid;
    gap: 0.85rem;
    margin-top: 1.25rem;
}

@media (min-width: 640px) {
    .site-ui.account-page #account-app dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .site-ui.account-page #account-app dl {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.site-ui.account-page #account-app dl > div {
    padding: 1rem;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fafc;
}

.site-ui.account-page #account-app .grid.gap-4,
.site-ui.account-page #account-app .grid.gap-6 {
    gap: 1rem;
}

.site-ui.account-page #account-app button.rounded-md,
.site-ui.account-page #account-app a.rounded-md {
    border-radius: 10px !important;
    min-height: 42px;
    font-weight: 700;
}

.site-ui.account-page #account-app button.bg-\[\#18A77B\],
.site-ui.account-page #account-app a.bg-\[\#18A77B\] {
    background: var(--mb-green) !important;
    color: #fff !important;
}

.site-ui.account-page #account-app button.bg-\[\#18A77B\]:hover {
    background: var(--mb-green-hover, #0B6B50) !important;
}

.site-ui.account-page #account-app dl dt {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.site-ui.account-page #account-app dl dd {
    margin: 0.35rem 0 0;
    font-weight: 700;
    color: var(--mb-navy, #172033);
}

.site-ui.account-page #account-app .border-green-200 {
    border-color: #bbf7d0 !important;
    background: #f0fdf4 !important;
    color: #14532d;
}

.site-ui.account-page #account-app .flex-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.site-ui.account-page #account-app .mt-5,
.site-ui.account-page #account-app .mt-6 {
    margin-top: 1.25rem;
}

.site-ui.account-page #account-app .mt-3 {
    margin-top: 0.75rem;
}

.site-ui.account-page #account-app .mt-2 {
    margin-top: 0.5rem;
}

.site-ui.account-page #account-app .mb-btn-soft {
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    color: #334155;
}

.site-ui.account-page #account-app .mb-btn-soft:hover {
    background: #F2FEF9;
    border-color: #7EE0BF;
    color: #0B6B50;
}

.site-ui.account-page #account-app section.rounded-xl.border.border-amber-200 {
    border-radius: var(--mb-radius-lg) !important;
}

.site-ui.account-page #account-app .rounded-lg.border.p-4 {
    border-radius: 12px !important;
    border-color: #e2e8f0 !important;
    background: #f8fafc;
}

.site-ui.account-page #account-app .text-sm {
    font-size: 0.875rem;
    line-height: 1.5;
}

.site-ui.account-page #account-app .text-gray-600 {
    color: #4b5563;
}

.site-ui.account-page .account-login-card,
.site-ui.account-page #account-app > .account-login-card {
    text-align: center;
    padding: 2rem 1.5rem !important;
}

.site-ui.account-page .account-login-card .mb-btn {
    min-height: 48px;
    min-width: 12rem;
}

.site-ui.account-page main {
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.site-ui.account-page #account-app > section > h2,
.site-ui.account-page #account-app section.rounded-xl > h2 {
    margin: 0 0 0.85rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e2e8f0;
    color: var(--mb-navy, #172033);
    letter-spacing: -0.01em;
    font-size: 1.15rem;
}

.site-ui.account-page #account-app dl {
    display: grid;
    gap: 0.65rem;
    margin: 0;
}

.site-ui.account-page #account-app dl div {
    padding: 0.65rem 0.75rem;
    border-radius: 10px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.site-ui.account-page #account-app dl dt {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    margin-bottom: 0.2rem;
}

.site-ui.account-page #account-app dl dd {
    margin: 0;
    color: var(--mb-navy, #172033);
    font-weight: 600;
}

.site-ui.account-page #account-app button[data-action="sign-out"],
.site-ui.account-page #account-app .account-sign-out {
    background: #fef2f2 !important;
    border-color: #fecaca !important;
    color: #b91c1c !important;
}

.site-ui.account-page #account-app button[data-action="sign-out"]:hover,
.site-ui.account-page #account-app .account-sign-out:hover {
    background: #fee2e2 !important;
}
