/* Chrome generic pentru modalele de tip "formular" (Bootstrap modal) */

.form-modal-dialog {
    max-width: 34rem;
}

/* Layout flex + înălțime limitată la viewport */
.form-modal-content {
    border: 0;
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-height: calc(100vh - 3.5rem);
    max-height: calc(100dvh - 3.5rem);
}

/* Antetul (titlu + buton închidere) */
.form-modal-header {
    flex-shrink: 0;
}

/* Corpul scrollabil — fade jos (mask-image) via form-modal.js */
.form-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.form-modal-body.form-modal-body-fade {
    mask-image: linear-gradient(to bottom, #000 80%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, #000 80%, transparent 100%);
}

/* santinelă invizibilă pentru IntersectionObserver */
.form-modal-body-sentinel {
    display: block;
    height: 1px;
}

.form-modal-title {
    font-size: var(--heading-s-size);
    color: var(--color-content-primary);
}

.form-modal-close {
    width: 2.5rem;
    height: 2.5rem;
    background-color: var(--color-bg-secondary);
    border: none;
    flex-shrink: 0;
}

.form-modal-section-title {
    font-size: var(--heading-xs-size);
    color: var(--color-content-primary);
}

/* ===== Rezumat produs (imagine + titlu + meta) ===== */

.form-product-summary {
    border-color: var(--color-border-primary);
}

.form-product-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-content-primary);
}

.form-product-meta {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

/* ===== Câmp de formular (input SAU textarea, fundal gri, fără bordură) ===== */
.form-field {
    background-color: var(--color-bg-secondary);
    border: 1px solid transparent;
    resize: none;
    font-size: var(--text-m-size);
    color: var(--color-content-primary);
}

.form-field:focus {
    background-color: var(--color-bg-primary);
    border-color: var(--color-border-brand);
    box-shadow: none;
}

.form-field:disabled {
    color: var(--color-content-tertiary);
    opacity: 1;
}

/* Etichetă mică deasupra unui .form-field (Nume adresă, Titular card etc.) */
.form-field-label {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

/* Text ajutător sub un .form-field (ex. "Numărul cardului nu poate fi editat", "Folosită implicit la checkout") */
.form-field-hint {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

/* ===== Acțiuni (Renunță / acțiune principală) ===== */

.form-modal-actions {
    flex-direction: column;
}

@media (min-width: 768px) {
    .form-modal-actions {
        flex-direction: row;
    }
}

/* ===== Modal de confirmare — icon rotund + text ===== */

.form-confirm-icon {
    width: 4rem;
    height: 4rem;
    background-color: var(--color-bg-positive);
}

.form-confirm-text {
    color: var(--color-content-tertiary);
}

/* Mobil (<768px): modalul devine un panou ancorat jos, cu animație de glisare */
@media (max-width: 767.98px) {
    .form-modal .modal-dialog {
        align-items: flex-end;
        min-height: 100%;
        margin: 0 !important;
        max-width: 100% !important;
        transform: translateY(100%) !important;
    }

    .form-modal.show .modal-dialog {
        transform: translateY(0) !important;
    }

    .form-modal-content {
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
        max-height: calc(100vh - 70px);
        max-height: calc(100dvh - 70px);
    }
}