@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&display=swap');

.lieu-form-container { 
    background: #fff; 
    padding: 20px; 
    margin: 20px 0; 
    border: 1px solid #ccd0d4; 
    box-shadow: 0 1px 1px rgba(0,0,0,.04); 
}

.lieu-form-container h2 { 
    margin-top: 0; 
    padding-bottom: 10px; 
    border-bottom: 1px solid #ccd0d4; 
    font-family: 'DM Serif Display', serif;
}

/* Apply DM Serif Display to admin headings */
.wrap h1,
.wrap h2,
.transfert-stats-cards .stat-card h3,
.transfert-detail-modal .modal-header h3,
.transfert-detail-modal .detail-label,
#transfertDetailsModal .modal-header h3,
.transfert-filters label,
.form-table th label {
    font-family: 'DM Serif Display', serif;
}

/* Keep table content readable */
.wp-list-table,
.form-table,
.notice,
.button,
.transfert-filters select,
.transfert-filters input,
.modal-body,
.detail-value,
.summary-value {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
}

.lieu-categorie { 
    display: inline-block; 
    padding: 4px 8px; 
    border-radius: 3px; 
    font-size: 12px; 
    font-weight: 500; 
}

.cat-aeroport { 
    background-color: #e0f2fe; 
    color: #0369a1; 
    border: 1px solid #7dd3fc; 
}

.cat-ville { 
    background-color: #dcfce7; 
    color: #166534; 
    border: 1px solid #86efac; 
}

.wp-list-table { 
    margin-top: 20px; 
}

.form-table select { 
    min-width: 300px; 
}

.notice { 
    margin: 20px 0; 
}

.wrap h1 { 
    margin-bottom: 20px; 
}

/* Modal spinner */
.transfert-detail-modal .spinner {
    float: none;
    margin: 0 auto;
    display: inline-block;
    visibility: visible;
}

/* Modal responsive with reduced font sizes */
@media (max-width: 768px) {
    .transfert-detail-modal .modal-content {
        width: 95%;
        margin: 10% auto;
    }
    
    .transfert-detail-modal .detail-row {
        flex-direction: column;
    }
    
    .transfert-detail-modal .detail-label,
    .transfert-detail-modal .detail-value {
        width: 100%;
    }
    
    .transfert-detail-modal .detail-label {
        margin-bottom: 5px;
        font-size: 12px;
    }
    
    .transfert-detail-modal .detail-value {
        font-size: 11px;
    }
    
    .transfert-detail-modal .modal-header h3 {
        font-size: 14px;
    }
    
    /* Stats cards responsive */
    .transfert-stats-cards {
        gap: 10px !important;
    }
    
    .stat-card {
        min-width: 120px !important;
        padding: 10px 15px !important;
    }
    
    .stat-card h3 {
        font-size: 20px !important;
    }
    
    .stat-card p {
        font-size: 11px !important;
    }
    
    /* Form table responsive */
    .form-table th,
    .form-table td {
        padding: 10px 5px;
        font-size: 12px;
    }
    
    .form-table select {
        min-width: 200px;
        font-size: 12px;
    }
    
    .form-table input[type="text"],
    .form-table input[type="email"],
    .form-table input[type="number"] {
        font-size: 12px;
        padding: 5px 8px;
    }
    
    /* Table responsive */
    .wp-list-table {
        font-size: 11px;
    }
    
    .wp-list-table th,
    .wp-list-table td {
        padding: 8px 5px;
    }
    
    .wp-list-table .button-small {
        font-size: 10px;
        padding: 2px 6px;
    }
}

@media (max-width: 576px) {
    .transfert-stats-cards {
        flex-direction: column;
        gap: 8px !important;
    }
    
    .stat-card {
        width: 100%;
        min-width: auto !important;
    }
    
    .transfert-filters form {
        flex-direction: column;
        gap: 10px !important;
    }
    
    .transfert-filters form > div {
        width: 100%;
    }
    
    .transfert-filters select,
    .transfert-filters input {
        width: 100%;
        font-size: 12px;
    }
    
    .wrap h1 {
        font-size: 20px;
    }
    
    .lieu-form-container h2 {
        font-size: 16px;
    }
    
    .form-table th,
    .form-table td {
        display: block;
        width: 100%;
        padding: 5px;
    }
    
    .form-table th {
        padding-bottom: 0;
    }
    
    .form-table select {
        width: 100%;
        min-width: auto;
    }
    
    .wp-list-table {
        display: block;
        overflow-x: auto;
    }
    
    .wp-list-table th,
    .wp-list-table td {
        font-size: 10px;
        white-space: nowrap;
    }
    
    .wp-list-table .button-small {
        font-size: 9px;
        padding: 1px 4px;
    }
    
    .transfert-detail-modal .modal-body {
        padding: 10px;
        font-size: 11px;
    }
    
    .transfert-detail-modal .detail-label {
        font-size: 11px;
    }
    
    .transfert-detail-modal .detail-value {
        font-size: 10px;
    }
}
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&display=swap');

:root { 
    --primary-orange: #C2A463; 
    --primary-orange-hover: #C2A463; 
    --dark-red: #C2A463; 
    --dark-red-hover: #C2A463; 
    --validate-orange: #C2A463; 
    --validate-orange-hover: #C2A463;
    --border-light: #e5e7eb;
    --bg-gray: #f9fafb;
    --text-dark: #1f2937;
    --text-gray: #6b7280;
}

/* Apply DM Serif Display with !important to all text elements */
.transfert-search-wrapper,
.transfert-search-wrapper *,
.transfert-search-wrapper .form-label-custom,
.transfert-search-wrapper .dropdown-toggle-custom,
.transfert-search-wrapper .passenger-label,
.transfert-search-wrapper .btn-validate,
.transfert-search-wrapper .btn-search,
.transfert-search-wrapper h1,
.transfert-search-wrapper h2,
.transfert-search-wrapper h3,
.transfert-search-wrapper h4,
.transfert-search-wrapper p,
.transfert-search-wrapper span,
.transfert-search-wrapper label,
.transfert-search-wrapper input,
.transfert-search-wrapper select,
.transfert-search-wrapper textarea,
.transfert-search-wrapper button,
.transfert-search-wrapper .modal-header h3,
.confirmation-modal .modal-header h3,
.transfert-search-wrapper .price-box,
.transfert-search-wrapper .summary-label,
.transfert-search-wrapper .summary-value,
.transfert-search-wrapper .detail-label,
.transfert-search-wrapper .detail-value,
.transfert-search-wrapper .form-check-label,
.transfert-search-wrapper .form-message,
.transfert-search-wrapper .text-danger,
.transfert-search-wrapper #dateRetourError {
    font-family: 'DM Serif Display', 'Segoe UI', Tahoma, Geneva, Verdana, serif !important;
}

/* If you want only specific elements to use DM Serif Display (recommended for better readability) */
/* Uncomment this section and comment the one above if you prefer this approach */


.transfert-search-wrapper .form-label-custom,
.transfert-search-wrapper .dropdown-toggle-custom,
.transfert-search-wrapper .passenger-label,
.transfert-search-wrapper .btn-validate,
.transfert-search-wrapper .btn-search,
.transfert-search-wrapper h1,
.transfert-search-wrapper h2,
.transfert-search-wrapper h3,
.transfert-search-wrapper .modal-header h3,
.confirmation-modal .modal-header h3,
.transfert-search-wrapper .price-box span:first-child,
.transfert-search-wrapper .summary-label,
.transfert-search-wrapper .detail-label {
    font-family: 'DM Serif Display', 'Segoe UI', Tahoma, Geneva, Verdana, serif !important;
}

.transfert-search-wrapper .form-control-custom,
.transfert-search-wrapper .form-select-custom,
.transfert-search-wrapper input,
.transfert-search-wrapper select,
.transfert-search-wrapper textarea,
.transfert-search-wrapper .summary-value,
.transfert-search-wrapper .detail-value,
.transfert-search-wrapper .form-check-label,
.transfert-search-wrapper #formMessage {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}
