/* ZeConcept — habillage des pages de compte (login, 2FA) aligné sur le design system du front React. */
@font-face {
    font-family: 'Nunito Sans';
    src: url('/fonts/Nunito_Sans/NunitoSans-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Nunito Sans';
    src: url('/fonts/Nunito_Sans/NunitoSans-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Nunito Sans';
    src: url('/fonts/Nunito_Sans/NunitoSans-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Nunito Sans';
    src: url('/fonts/Nunito_Sans/NunitoSans-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

:root {
    --zc-background: #edeff4;
    --zc-card: #ffffff;
    --zc-primary: #C0AC94;
    --zc-primary-hover: #b09a80;
    --zc-primary-foreground: #ffffff;
    --zc-secondary: #FAF6F1;
    --zc-foreground: #0a0a0a;
    --zc-muted-foreground: #989898;
    --zc-border: #e5e5e5;
    --zc-destructive: #e7000b;
    --zc-radius: 8px;
    --zc-font: 'Nunito Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

html, body.abp-account-layout {
    min-height: 100vh;
    margin: 0;
    background: var(--zc-background) !important;
    font-family: var(--zc-font) !important;
    color: var(--zc-foreground);
}

.abp-account-container {
    min-height: 100vh;
    /*display: flex;*/
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

.zc-login-card {
    width: 100%;
    max-width: 560px;
    background: var(--zc-card);
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 71px 0 rgba(192, 172, 148, 0.33);
    padding: 3.5rem 3.5rem;
}

@media (max-width: 600px) {
    .zc-login-card { padding: 2rem 1.5rem; }
}

.zc-login-brand {
    display: flex;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.zc-login-brand-badge {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--zc-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px 0 rgba(192, 172, 148, 0.25);
}

.zc-login-brand-badge svg { width: 26px; height: auto; }

.zc-login-title {
    text-align: center;
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: -0.015em;
    color: var(--zc-foreground);
    margin: 0;
    margin-bottom: 0.5rem;
}

.zc-login-subtitle {
    text-align: center;
    font-size: 0.95rem;
    color: var(--zc-muted-foreground);
    margin: 0 0 2rem;
    font-weight: 400;
}

.zc-login-card .form-label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--zc-foreground);
    margin-bottom: 0.4rem;
}

.zc-login-card .form-control {
    height: 48px;
    border-radius: var(--zc-radius);
    border: 1px solid var(--zc-border);
    background: #fff;
    color: var(--zc-foreground);
    font-size: 0.95rem;
    font-family: var(--zc-font);
    padding: 0 1rem;
    box-shadow: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.zc-login-card .form-control.text-center { text-align: center; letter-spacing: 0.5em; font-weight: 700; }

.zc-login-card .form-control::placeholder { color: var(--zc-muted-foreground); letter-spacing: normal; }

.zc-login-card .form-control:focus {
    border-color: var(--zc-primary);
    box-shadow: 0 0 0 3px rgba(192, 172, 148, 0.4);
    outline: none;
}

.zc-login-card .form-check { margin: 1rem 0 1.5rem; padding-left: 0; display: flex; align-items: center; gap: 0.5rem; }
.zc-login-card .form-check-input {
    width: 1.05rem; height: 1.05rem; margin: 0;
    border: 1px solid var(--zc-border);
    border-radius: 5px;
    cursor: pointer;
}
.zc-login-card .form-check-input:checked {
    background-color: var(--zc-primary);
    border-color: var(--zc-primary);
}
.zc-login-card .form-check-input:focus {
    border-color: var(--zc-primary);
    box-shadow: 0 0 0 3px rgba(192, 172, 148, 0.4);
}
.zc-login-card .form-check-label {
    font-size: 0.88rem;
    color: var(--zc-foreground);
    cursor: pointer;
    margin: 0;
}

.zc-login-card .btn-primary,
.zc-login-card .btn-primary:active {
    height: 50px;
    background: var(--zc-primary) !important;
    border: none !important;
    border-radius: var(--zc-radius);
    color: var(--zc-primary-foreground) !important;
    font-family: var(--zc-font);
    font-weight: 700;
    font-size: 0.98rem;
    letter-spacing: 0.01em;
    box-shadow: none;
    transition: background 0.15s ease;
}

.zc-login-card .btn-primary:hover,
.zc-login-card .btn-primary:focus {
    background: var(--zc-primary-hover) !important;
    box-shadow: 0 0 0 3px rgba(192, 172, 148, 0.4);
}

.zc-login-card .field-validation-error,
.zc-login-card .text-danger {
    display: block;
    font-size: 0.8rem;
    color: var(--zc-destructive);
    margin-top: 0.35rem;
}

.zc-login-card .alert-danger {
    border: none;
    border-radius: var(--zc-radius);
    background: #fdecec;
    color: var(--zc-destructive);
    font-size: 0.85rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
}
.zc-login-card .alert-danger:empty { display: none; }

.zc-login-link {
    display: inline-block;
    margin-top: 1.25rem;
    font-size: 0.85rem;
    color: var(--zc-muted-foreground);
    text-decoration: none;
    transition: color 0.15s ease;
}
.zc-login-link:hover { color: var(--zc-primary); }

/* Sélecteur de tenant */
.zc-tenant-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    padding: 0.7rem 0.9rem;
    background: var(--zc-secondary);
    border: 1px solid var(--zc-border);
    border-radius: var(--zc-radius);
    font-size: 0.85rem;
}
.zc-tenant-box__label { color: var(--zc-muted-foreground); }
.zc-tenant-box__name { font-weight: 700; color: var(--zc-foreground); }
.zc-tenant-box__switch {
    margin-left: auto;
    font-weight: 600;
    color: var(--zc-primary);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s ease;
}
.zc-tenant-box__switch:hover { color: var(--zc-primary-hover); text-decoration: underline; }

/* Habillage du modal ABP de changement de tenant pour matcher le design du front */
.modal-content {
    border: none !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 71px 0 rgba(192, 172, 148, 0.33) !important;
    font-family: var(--zc-font);
    color: var(--zc-foreground);
}
.modal-header {
    border-bottom: 1px solid var(--zc-border) !important;
    padding: 1.25rem 1.5rem !important;
}
.modal-header .modal-title,
.modal-title {
    font-family: var(--zc-font);
    font-weight: 800;
    font-size: 1.15rem;
    color: var(--zc-foreground);
}
.modal-body { padding: 1.5rem !important; font-family: var(--zc-font); }
.modal-footer {
    border-top: 1px solid var(--zc-border) !important;
    padding: 1rem 1.5rem !important;
    gap: 0.5rem;
}
.modal-body .form-label,
.modal-body label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--zc-foreground);
    margin-bottom: 0.4rem;
}
.modal-body .form-control {
    height: 44px;
    border-radius: var(--zc-radius);
    border: 1px solid var(--zc-border);
    font-family: var(--zc-font);
    font-size: 0.95rem;
    padding: 0 0.875rem;
    box-shadow: none;
}
.modal-body .form-control:focus {
    border-color: var(--zc-primary);
    box-shadow: 0 0 0 3px rgba(192, 172, 148, 0.4);
}
.modal-body .form-text,
.modal-body small {
    color: var(--zc-muted-foreground);
    font-size: 0.8rem;
}
.modal .btn-primary,
.modal .btn-primary:active {
    background: var(--zc-primary) !important;
    border: none !important;
    border-radius: var(--zc-radius) !important;
    color: var(--zc-primary-foreground) !important;
    font-family: var(--zc-font);
    font-weight: 700;
    box-shadow: none;
}
.modal .btn-primary:hover,
.modal .btn-primary:focus {
    background: var(--zc-primary-hover) !important;
    box-shadow: 0 0 0 3px rgba(192, 172, 148, 0.4);
}
.modal .btn-secondary,
.modal .btn-secondary:active {
    background: #fff !important;
    border: 1px solid var(--zc-border) !important;
    border-radius: var(--zc-radius) !important;
    color: var(--zc-foreground) !important;
    font-family: var(--zc-font);
    font-weight: 600;
    box-shadow: none;
}
.modal .btn-secondary:hover { background: var(--zc-secondary) !important; }
.modal .btn-close:focus { box-shadow: 0 0 0 3px rgba(192, 172, 148, 0.4); }
.btn-outline-primary {
    border: 1px solid var(--zc-primary) !important;
    color : var(--zc-primary)
}
.btn-outline-primary:hover{
    background: var(--zc-primary-hover) !important;
    color: var(--zc-secondary) !important;
}