/*
 * Dog-Haus Auth Plugin — Frontend Styles
 * Farb-Palette gespiegelt vom Theme: olive #425118, sage #a7bab3,
 * green-dark #14532d, green #166534. Font: Inter (vom Theme global geladen).
 */

.dh-auth-page {
    padding: 40px 0 80px;
    background-color: #f3f4f6;
    min-height: calc(100vh - 200px);
}

.dh-auth-card {
    max-width: 480px;
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e5e5;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    padding: 36px 32px;
    border-radius: 0;
}

@media (max-width: 540px) {
    .dh-auth-card { padding: 24px 20px; }
}

.dh-auth-header {
    text-align: center;
    margin-bottom: 28px;
}

.dh-auth-title {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 8px;
    line-height: 1.2;
}

.dh-auth-subtitle {
    color: #6b7280;
    font-size: 0.95rem;
    margin: 0;
}

/* ----- Notices ----- */
.dh-auth-notice {
    padding: 12px 16px;
    margin-bottom: 20px;
    font-size: 0.9rem;
    line-height: 1.45;
    border-left: 3px solid;
}
.dh-auth-notice--error {
    background: #fef2f2;
    border-color: #dc2626;
    color: #991b1b;
}
.dh-auth-notice--success {
    background: #f0fdf4;
    border-color: #16a34a;
    color: #14532d;
}
.dh-auth-notice a { color: inherit; font-weight: 600; text-decoration: underline; }

/* ----- Form ----- */
.dh-auth-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dh-auth-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.dh-auth-field label {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1f2937;
}

.dh-auth-field input {
    padding: 10px 12px;
    font-size: 0.95rem;
    border: 1px solid #d1d5db;
    background: #ffffff;
    color: #1f2937;
    font-family: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    border-radius: 0;
}

.dh-auth-field input:focus {
    outline: none;
    border-color: #166534;
    box-shadow: 0 0 0 3px rgba(22, 101, 52, 0.15);
}

.dh-auth-hint {
    font-size: 0.75rem;
    color: #6b7280;
}

.dh-auth-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    color: #1f2937;
    cursor: pointer;
}
.dh-auth-checkbox input { margin: 0; }

/* ----- Turnstile Wrap ----- */
.dh-auth-turnstile {
    margin: 6px 0 2px;
    display: flex;
    justify-content: center;
    min-height: 65px;
}

/* ----- Submit Button ----- */
.dh-auth-btn {
    background: #14532d;
    color: #ffffff;
    border: none;
    padding: 13px 20px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    transition: background 0.2s ease, opacity 0.2s ease;
    font-family: inherit;
    border-radius: 0;
    display: inline-block;
}

.dh-auth-btn:hover:not(:disabled) {
    background: #166534;
}

.dh-auth-btn:disabled,
.dh-auth-btn[aria-disabled="true"] {
    background: #6b7280;
    cursor: not-allowed;
    opacity: 0.75;
}

.dh-auth-btn--ghost {
    background: transparent;
    color: #14532d;
    border: 1px solid #14532d;
    margin-right: 8px;
}
.dh-auth-btn--ghost:hover:not(:disabled) {
    background: #14532d;
    color: #ffffff;
}

/* ----- Footer ----- */
.dh-auth-footer {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #e5e5e5;
    text-align: center;
    font-size: 0.85rem;
    color: #6b7280;
}
.dh-auth-footer a {
    color: #14532d;
    font-weight: 600;
    text-decoration: none;
}
.dh-auth-footer a:hover { text-decoration: underline; }

/* ============================================================
 * SIDEBAR HIDE — nur die WP-Widget-Sidebar, NICHT die WC-Account-Nav!
 * Wildcards wie [class*="sidebar"] sind zu greedy und treffen
 * `.woocommerce-MyAccount-navigation`-Wrapper sowie generische
 * Bootstrap-Spalten — die müssen wir hier explizit verschonen.
 * ============================================================ */
body.dh-auth-page-body aside#sidebar,
body.dh-auth-page-body #sidebar.widget-area,
body.dh-auth-page-body #sidebar-widget-area,
body.dh-auth-page-body #secondary.widget-area,
body.dh-auth-page-body aside.widget-area,
body.dh-auth-page-body aside.sidebar,
body.dh-auth-page-body .sidebar.widget-area {
    display: none !important;
}

/* Content auf volle Breite ziehen, da WP-Sidebar-Spalte weg ist */
body.dh-auth-page-body #primary,
body.dh-auth-page-body .content-area,
body.dh-auth-page-body .site-main,
body.dh-auth-page-body main#main,
body.dh-auth-page-body main.content {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

/* Hinweis-Box auf Login-Page */
.dh-auth-info-box {
    margin: 14px 0 20px;
    padding: 12px 14px;
    background: #f0fdf4;
    border-left: 3px solid #16a34a;
    font-size: 0.85rem;
    line-height: 1.45;
    color: #14532d;
}
.dh-auth-info-box strong { font-weight: 600; }
.dh-auth-info-box a { color: #14532d; font-weight: 600; text-decoration: underline; }

/* ============================================================
 * MY ACCOUNT — komplett eigenes Layout via Plugin-Templates.
 * Kein Vertrauen mehr auf Parent-Theme-Grid. CSS Grid steuert
 * die Spalten direkt im Plugin-Markup (dh-myaccount-*).
 * ============================================================ */

/* Hauptcontainer — Nav-Spalte ist so breit wie das längste Menü-Item
   (kein Wrap), Content nimmt den Rest. */
body.dh-auth-page-body .dh-myaccount {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 32px;
    width: 100%;
    max-width: 100%;
    margin: 30px 0;
    align-items: start;
}

@media (max-width: 900px) {
    body.dh-auth-page-body .dh-myaccount {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

/* Navigation Spalte */
body.dh-auth-page-body .dh-myaccount-nav-wrap {
    min-width: 0;
}

body.dh-auth-page-body .dh-myaccount-nav {
    margin: 0;
}

body.dh-auth-page-body .dh-myaccount-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
}

body.dh-auth-page-body .dh-myaccount-nav li {
    margin: 0;
    padding: 0;
    list-style: none;
    min-width: 0;
}

body.dh-auth-page-body .dh-myaccount-nav li a {
    display: block;
    padding: 12px 20px;
    color: #1f2937;
    text-decoration: none;
    font-size: 0.92rem;
    line-height: 1.35;
    /* Kein Wrap — Nav-Spalte sizes sich auf max-content (s. .dh-myaccount Grid) */
    white-space: nowrap;
    border-left: 3px solid transparent;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

body.dh-auth-page-body .dh-myaccount-nav li + li {
    border-top: 1px solid #e5e7eb;
}

body.dh-auth-page-body .dh-myaccount-nav li a:hover {
    background: #ffffff;
    color: #14532d;
    border-left-color: #a7bab3;
}

body.dh-auth-page-body .dh-myaccount-nav li.is-active a {
    background: #ffffff;
    color: #14532d;
    font-weight: 600;
    border-left-color: #14532d;
}

/* Content Spalte */
body.dh-auth-page-body .dh-myaccount-content-wrap {
    min-width: 0;
}

body.dh-auth-page-body .dh-myaccount-content {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    padding: 28px 32px;
    min-width: 0;
}

body.dh-auth-page-body .dh-myaccount-content > p:first-child {
    margin-top: 0;
}

@media (max-width: 600px) {
    body.dh-auth-page-body .dh-myaccount-content {
        padding: 20px 18px;
    }
}

/* Adressen-Übersicht */
body.dh-auth-page-body .dh-myaccount-addresses-intro {
    color: #4b5563;
    margin: 0 0 20px;
}

body.dh-auth-page-body .dh-myaccount-addresses {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    width: 100%;
}

@media (max-width: 700px) {
    body.dh-auth-page-body .dh-myaccount-addresses {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

body.dh-auth-page-body .dh-myaccount-address {
    min-width: 0;
    border: 1px solid #e5e7eb;
    padding: 18px 20px;
    background: #f9fafb;
}

body.dh-auth-page-body .dh-myaccount-address-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

body.dh-auth-page-body .dh-myaccount-address-title {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.2;
    color: #1f2937;
}

body.dh-auth-page-body .dh-myaccount-address-edit {
    font-size: 0.85rem;
    color: #14532d;
    text-decoration: underline;
    font-weight: 500;
}
body.dh-auth-page-body .dh-myaccount-address-edit:hover {
    color: #166534;
}

body.dh-auth-page-body .dh-myaccount-address-body {
    font-style: normal;
    line-height: 1.55;
    color: #1f2937;
    font-size: 0.92rem;
    margin: 0;
}