/* ============================================================
   Latin PRO — Auth Pages CSS v1.4
   Color primario: #5841D8
   ============================================================ */

/* ── Neutralizar SOLO el container y el área de contenido ──
   Sin tocar .row, .col, footer ni nada global del theme      */

body:has(.lp-auth-wrap) {
    background: #f2f2f2;
}

body:has(.lp-auth-wrap) #content.container {
    max-width: 100% !important;
    width:     100% !important;
    padding:   0 !important;
    margin:    0 !important;
}

body:has(.lp-auth-wrap) #content {
    padding-top:    0 !important;
    padding-bottom: 0 !important;
}

/* Solo el .col que es padre directo del .entry-content que contiene .lp-auth-wrap */
body:has(.lp-auth-wrap) #primary {
    max-width: 100% !important;
    width:     100% !important;
    padding:   0 !important;
    margin:    0 !important;
}

body:has(.lp-auth-wrap) .entry-header {
    display: none !important;
}

body:has(.lp-auth-wrap) .entry-content {
    padding: 0 !important;
    margin:  0 !important;
}

body:has(.lp-auth-wrap) main#main,
body:has(.lp-auth-wrap) .site-main {
    padding: 0 !important;
    margin:  0 !important;
}

/* ── Wrap principal ── */

.lp-auth-wrap {
    display:      flex;
    min-height:   calc(100vh - 72px);
    width:        100vw;
    position:     relative;
    left:         50%;
    margin-left:  -50vw;
    font-family:  -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                  "Helvetica Neue", Arial, sans-serif;
    box-sizing:   border-box;
}

/* ── Panel izquierdo — 50% ── */

.lp-auth-left {
    width:            50%;
    flex-shrink:      0;
    background-color: #5841D8;
    display:          flex;
    align-items:      center;
    justify-content:  center;
    padding:          3rem 3rem;
    position:         relative;
    box-sizing:       border-box;
}

.lp-auth-left::before {
    content:        '';
    position:       absolute;
    inset:          0;
    background:     #1e1560;
    opacity:        0.12;
    pointer-events: none;
}

.lp-auth-left__inner {
    position:       relative;
    z-index:        1;
    display:        flex;
    flex-direction: column;
    align-items:    center;
    text-align:     center;
    max-width:      320px;
}

.lp-auth-logo {
    width:           90px;
    height:          90px;
    border-radius:   50%;
    background:      #ffffff;
    overflow:        hidden;
    display:         flex;
    align-items:     center;
    justify-content: center;
    margin-bottom:   1.75rem;
}

.lp-auth-logo .lp-auth-logo__img {
    width:      100%;
    height:     100%;
    object-fit: cover;
}

.lp-auth-brand {
    color:          #ffffff;
    font-size:      2.4rem;
    font-weight:    400;
    letter-spacing: -0.5px;
    margin:         0 0 0.85rem;
    line-height:    1.1;
}

.lp-auth-brand strong {
    font-weight: 800;
}

.lp-auth-tagline {
    color:       rgba(255, 255, 255, 0.78);
    font-size:   0.9rem;
    line-height: 1.65;
    max-width:   240px;
    margin:      0;
}

/* ── Panel derecho — 50% ── */

.lp-auth-right {
    width:           50%;
    flex-shrink:     0;
    background:      #ffffff;
    display:         flex;
    align-items:     center;
    justify-content: center;
    padding:         3rem 3rem;
    box-sizing:      border-box;
    overflow-y:      auto;
}

.lp-auth-form-wrap {
    width:     100%;
    max-width: 400px;
}

/* ── Header del form ── */

.lp-auth-header {
    display:       flex;
    align-items:   center;
    gap:           12px;
    margin-bottom: 6px;
}

.lp-auth-icon {
    width:       36px;
    height:      36px;
    flex-shrink: 0;
}

.lp-auth-title {
    font-size:   1.9rem;
    font-weight: 800;
    color:       #000000;
    margin:      0;
    line-height: 1.15;
    border:      none;
    padding:     0;
    letter-spacing: -0.5px;
}

.lp-auth-subtitle {
    font-size: 0.82rem;
    color:     #8e8e8e;
    margin:    0 0 1.4rem;
}

.lp-auth-divider {
    border:     none;
    border-top: 1px solid #e5e7eb;
    margin:     0 0 1.5rem;
}

/* ── Error ── */

.lp-auth-error {
    background:    #fef2f2;
    border:        1px solid #fca5a5;
    color:         #b91c1c;
    font-size:     0.8rem;
    border-radius: 8px;
    padding:       10px 14px;
    margin-bottom: 1rem;
    line-height:   1.5;
}

/* ── Campos ── */

.lp-auth-field {
    margin-bottom: 1rem;
}

.lp-auth-label {
    display:       block;
    font-size:     0.8rem;
    font-weight:   500;
    color:         #374151;
    margin-bottom: 5px;
}

.lp-auth-label-row {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    margin-bottom:   5px;
}

.lp-auth-label-row .lp-auth-label {
    margin-bottom: 0;
}

.lp-auth-forgot {
    font-size:       0.8rem;
    color:           #5841D8;
    text-decoration: none;
}

.lp-auth-forgot:hover {
    text-decoration: underline;
    color:           #5841D8;
}

.lp-auth-input-wrap {
    display:       flex;
    align-items:   center;
    background:    #f9fafb;
    border:        1px solid #e5e7eb;
    border-radius: 10px;
    height:        48px;
    padding:       0 14px;
    transition:    border-color 0.15s, background 0.15s;
}

.lp-auth-input-wrap:focus-within {
    border-color: #5841D8;
    background:   #ffffff;
}

.lp-auth-input-icon {
    width:        18px;
    height:       18px;
    flex-shrink:  0;
    color:        #9ca3af;
    margin-right: 10px;
}

.lp-auth-input {
    flex:        1;
    border:      none !important;
    background:  transparent !important;
    box-shadow:  none !important;
    outline:     none !important;
    font-size:   0.9rem;
    color:       #111827;
    padding:     0 !important;
    height:      auto !important;
    min-height:  unset !important;
    font-family: inherit;
}

.lp-auth-input::placeholder {
    color: #aab4be;
}

.lp-auth-eye {
    background:  none;
    border:      none;
    padding:     0;
    cursor:      pointer;
    color:       #9ca3af;
    display:     flex;
    align-items: center;
    margin-left: 8px;
    flex-shrink: 0;
}

.lp-auth-eye svg {
    width:  18px;
    height: 18px;
}

.lp-auth-remember {
    display:       flex;
    align-items:   center;
    gap:           8px;
    font-size:     0.82rem;
    color:         #374151;
    margin-bottom: 1.1rem;
    cursor:        pointer;
}

.lp-auth-remember input[type="checkbox"] {
    width:        15px;
    height:       15px;
    accent-color: #5841D8;
    cursor:       pointer;
}

/* ── Botón submit ── */

.lp-auth-btn {
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             8px;
    width:           100%;
    height:          50px;
    background:      #5841D8;
    color:           #ffffff;
    border:          none;
    border-radius:   999px;
    font-size:       0.92rem;
    font-weight:     600;
    font-family:     inherit;
    cursor:          pointer;
    letter-spacing:  0.01em;
    box-shadow:      0 4px 12px rgba(88, 65, 216, 0.25);
    transition:      background 0.15s, box-shadow 0.15s;
    margin-top:      6px;
}

.lp-auth-btn:hover {
    background:  #4835b8;
    box-shadow:  0 6px 16px rgba(88, 65, 216, 0.32);
}

.lp-auth-btn:active {
    background: #3c2da0;
    transform:  translateY(1px);
}

.lp-auth-btn svg {
    width:      17px;
    height:     17px;
    flex-shrink:0;
}

/* ── Link cambio de página ── */

.lp-auth-switch {
    text-align: center;
    font-size:  0.82rem;
    color:      #6b7280;
    margin:     1.3rem 0 0;
}

.lp-auth-switch a {
    color:           #5841D8;
    text-decoration: none;
    font-weight:     500;
}

.lp-auth-switch a:hover {
    text-decoration: underline;
}

/* ── Footer ── */

.lp-auth-footer {
    margin-top:  1.5rem;
    padding-top: 1rem;
    border-top:  1px solid #e5e7eb;
    text-align:  center;
}

.lp-auth-footer p {
    font-size:   0.72rem;
    color:       #9ca3af;
    line-height: 1.8;
    margin:      0;
}

/* ── Dashboard Mi Cuenta ── */

.lp-auth-right.lp-auth-right--dashboard {
    align-items:     flex-start;
    justify-content: flex-start;
    padding:         2.5rem 3rem;
    overflow-y:      auto;
}

.lp-dashboard-wrap {
    width:     100%;
    max-width: 640px;
}

.lp-dashboard-nav {
    margin-bottom: 1.5rem;
}

.lp-dashboard-nav__list {
    list-style: none;
    padding:    0;
    margin:     0;
    display:    flex;
    flex-wrap:  wrap;
    gap:        6px;
}

.lp-dashboard-nav__item a {
    display:         inline-block;
    padding:         6px 14px;
    border:          1px solid #e5e7eb;
    border-radius:   8px;
    font-size:       0.8rem;
    color:           #374151;
    text-decoration: none;
    background:      #f9fafb;
    white-space:     nowrap;
    transition:      background 0.15s, border-color 0.15s, color 0.15s;
}

.lp-dashboard-nav__item a:hover,
.lp-dashboard-nav__item.is-active a {
    background:   #5841D8;
    border-color: #5841D8;
    color:        #ffffff;
}

.lp-dashboard-nav__item.is-logout a {
    color:        #dc2626;
    border-color: #fca5a5;
    background:   #fff;
}

.lp-dashboard-nav__item.is-logout a:hover {
    background:   #dc2626;
    border-color: #dc2626;
    color:        #ffffff;
}

.lp-dashboard-content {
    font-size:   0.875rem;
    color:       #374151;
    line-height: 1.65;
}

.lp-dashboard-content table {
    width:           100%;
    border-collapse: collapse;
    font-size:       0.85rem;
}

.lp-dashboard-content table th {
    text-align:     left;
    padding:        8px 12px;
    background:     #f9fafb;
    border-bottom:  1px solid #e5e7eb;
    font-weight:    600;
    font-size:      0.75rem;
    color:          #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lp-dashboard-content table td {
    padding:        10px 12px;
    border-bottom:  1px solid #f3f4f6;
    vertical-align: middle;
}

.lp-dashboard-content .woocommerce-Button,
.lp-dashboard-content a.button {
    display:         inline-flex;
    align-items:     center;
    padding:         6px 14px;
    background:      #5841D8;
    color:           #fff !important;
    border:          none;
    border-radius:   8px;
    font-size:       0.8rem;
    font-weight:     600;
    text-decoration: none;
    cursor:          pointer;
    transition:      background 0.15s;
}

.lp-dashboard-content .woocommerce-Button:hover,
.lp-dashboard-content a.button:hover {
    background: #4835b8;
}

/* ── Responsive ── */

@media (max-width: 860px) {
    .lp-auth-wrap {
        flex-direction: column;
    }

    .lp-auth-left,
    .lp-auth-right {
        width:   100%;
        padding: 2rem 1.5rem;
    }

    .lp-auth-left {
        min-height: auto;
    }

    .lp-auth-right.lp-auth-right--dashboard {
        padding: 1.5rem;
    }

    .lp-auth-title {
        font-size: 1.5rem;
    }
}