* { box-sizing: border-box; margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
        [hidden] { display: none !important; }
        html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
        body { background: #fff; color: #333; padding: 10px; padding-top: max(10px, env(safe-area-inset-top)); padding-bottom: max(20px, env(safe-area-inset-bottom)); display: flex; justify-content: center; align-items: flex-start; min-height: 100vh; min-height: 100dvh; }
        .mobile-container { width: 100%; max-width: 480px; background: #fff; min-height: calc(100vh - max(10px, env(safe-area-inset-top)) - max(20px, env(safe-area-inset-bottom))); min-height: calc(100dvh - max(10px, env(safe-area-inset-top)) - max(20px, env(safe-area-inset-bottom))); position: relative; display: flex; flex-direction: column; }
        @media (orientation: landscape) and (max-height: 500px) {
            .mobile-container { max-width: none; }
        }
        
        .app-header { text-align: center; margin-bottom: 15px; display: flex; align-items: center; justify-content: center; gap: 10px; }
        .app-logo { width: 36px; height: 36px; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.15)); flex-shrink: 0; }
        .app-header h1 { font-size: 1.1rem; color: #2c3e50; font-weight: bold; line-height: 1.2; }

        .nav-tabs { display: flex; background: #eef2f5; border-radius: 8px; padding: 3px; margin-bottom: 15px; gap: 2px; }
        .tab-btn { flex: 1; text-align: center; padding: 8px 2px; text-decoration: none; color: #555; font-size: 0.72rem; font-weight: 600; border-radius: 6px; display: flex; align-items: center; justify-content: center; gap: 2px; min-height: 38px; white-space: nowrap; position: relative; }
        .tab-btn.active { background: #2c3e50; color: #fff; }
        
        .dropdown { position: relative; display: flex; flex: 1; }
        .dropdown-toggle { width: 100%; color: #2d83ba; border-radius: 6px; display: flex; align-items: center; justify-content: center; gap: 2px; text-decoration: none; font-size: 0.72rem; font-weight: 600; min-height: 38px; }
        .dropdown-content { display: none; position: absolute; right: 0; top: 100%; margin-top: 5px; background-color: #fff; min-width: 175px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); border-radius: 8px; z-index: 10; border: 1px solid #ddd; overflow: hidden; }        
        .nav-tabs .nav-tournee-dropdown .dropdown-content { left: 0; right: auto; }
        .nav-tabs .nav-pointeuse-dropdown .dropdown-content { left: 50%; right: auto; transform: translateX(-50%); }
        .nav-tabs .nav-menu-dropdown .dropdown-content { left: auto; right: 0; }
        .dropdown-content a, .dropdown-content button.logout-link { width: 100%; color: #333; padding: 10px 14px; text-decoration: none; display: flex; align-items: center; gap: 8px; font-size: 0.8rem; font-weight: 600; border: 0; background: #fff; cursor: pointer; }
        .dropdown-content a:hover, .dropdown-content button.logout-link:hover { background-color: #f1f1f1; }
        .dropdown-content button.logout-link { color: #c0392b; border-top: 1px solid #eee; }
        .dropdown-content button.theme-toggle { width: 100%; color: #34495e; padding: 10px 14px; border: 0; border-top: 1px solid #eee; background: #fff; display: flex; align-items: center; gap: 8px; font-size: 0.8rem; font-weight: 600; cursor: pointer; text-align: left; }
        .dropdown-content button.theme-toggle:hover { background: #f1f1f1; }
        .mobile-container .dropdown-content button[type="submit"].logout-link {
            width: 100%;
            color: #c0392b;
            padding: 10px 14px;
            margin: 0;
            min-height: auto;
            border: 0;
            border-top: 1px solid #eee;
            border-radius: 0;
            background: #fafafa;
            font-size: 0.8rem;
            font-weight: 600;
            text-align: left;
            cursor: pointer;
        }
        .mobile-container .dropdown-content button[type="submit"].logout-link:hover { background: #f1f1f1; }
        .dropdown-control:checked ~ .dropdown-content { display: block; }
        .dropdown-toggle { list-style: none; cursor: pointer; }
        .dropdown-toggle.active { background: #2d83ba; color: #fff; }
        .dropdown-toggle.tournee-toggle { color: #27ae60; }
        .dropdown-toggle.tournee-toggle.active { background: #27ae60; color: #fff; }
        .tab-btn.rules-tab { color: #8e44ad; }
        .tab-btn.rules-tab.active { background: #8e44ad; color: #fff; }
        .dropdown-toggle.pointeuse-toggle { color: #e67e22; }
        .dropdown-toggle.pointeuse-toggle.active { background: #e67e22; color: #fff; }
        .dropdown-toggle.menu-toggle { color: #2d83ba; }
        .dropdown-toggle.menu-toggle.active { background: #2d83ba; color: #fff; }

        @media (max-width: 480px) {
            .dropdown-content { min-width: 165px; max-width: calc(100vw - 20px); }
        }

        .alert { background: #d4edda; color: #155724; padding: 10px; border-radius: 6px; font-size: 0.85rem; margin-bottom: 12px; text-align: center; }
        .alert.error { background: #f8d7da; color: #721c24; }

        .section-box { background: #fafafa; border: 1px solid #e1e1e1; padding: 12px; border-radius: 8px; margin-bottom: 15px; overflow-x: auto; display: flex; flex-direction: column; gap: 10px; }
        .section-title { font-size: 0.9rem; font-weight: bold; color: #2c3e50; margin: 0; text-align: left; }

        .mobile-container form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 15px; background: #fafafa; padding: 12px; border-radius: 8px; border: 1px solid #eee; }
        
        form.form-changelog { display: block; flex-direction: row; gap: normal; margin-bottom: 0; background: transparent; padding: 0; border-radius: 0; border: none; }

        .form-group { display: flex; flex-direction: column; gap: 4px; position: relative; }
        label { font-size: 0.8rem; font-weight: 600; color: #555; }
        input[type="text"], input[type="password"], input[type="tel"], input[type="number"], textarea, select { width: 100%; padding: 12px; border: 1px solid #ccc; border-radius: 6px; background: #fff; }
        .vacances-form,
        .vacances-form .form-group { width: 100%; min-width: 0; max-width: 100%; overflow: hidden; }
        .vacances-date-input { width: 100% !important; min-width: 0 !important; max-width: 100% !important; inline-size: 100% !important; min-inline-size: 0 !important; padding: 12px; border: 1px solid #ccc; border-radius: 6px; background: #fff; display: block; }
        textarea { resize: vertical; height: 70px; }
        
        .search-online-box { background: #eef9ff; border: 1px solid #bce8f1; padding: 10px; border-radius: 8px; margin-bottom: 5px; position: relative; }
        .suggestions-list { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #ccc; border-radius: 0 0 6px 6px; max-height: 200px; overflow-y: auto; z-index: 999; box-shadow: 0 4px 8px rgba(0,0,0,0.15); display: none; }
        .suggestion-item { padding: 12px; font-size: 0.85rem; border-bottom: 1px solid #f1f1f1; cursor: pointer; color: #333; }
        .suggestion-item:hover { background: #f8f9fa; }

        .mobile-container button[type="submit"]:not(:disabled) { background: #2ecc71; color: white; border: none; border-radius: 6px; font-weight: bold; cursor: pointer; min-height: 44px; }
        .mobile-container button[type="submit"].changelog-toggle-button.is-enabled:not(:disabled) { background: #c0392b; }
        .mobile-container button[type="submit"].changelog-toggle-button.is-disabled:not(:disabled) { background: #2980b9; }
        .mobile-container button[type="submit"]:disabled { background: #bdc3c7 !important; color: #fff !important; cursor: not-allowed; border: none; padding: 12px; border-radius: 6px; font-size: 1rem; font-weight: bold; min-height: 44px; margin-top: 5px; opacity: 0.7; }
        
        .form-changelog button[type="submit"]:not(:disabled) { background: #2ecc71; color: white; border: none; padding: 12px; border-radius: 6px; font-size: 1rem; font-weight: bold; cursor: pointer; min-height: 44px; margin-top: 5px; }
        .form-changelog button[type="submit"]:disabled { background: #bdc3c7 !important; color: #fff !important; cursor: not-allowed; border: none; padding: 12px; border-radius: 6px; font-size: 1rem; font-weight: bold; min-height: 44px; margin-top: 5px; opacity: 0.7; }

        .btn-cancel { background: #7f8c8d; color: white; text-align: center; text-decoration: none; padding: 10px; border-radius: 6px; font-size: 0.9rem; font-weight: bold; display: block; line-height: 22px; }
        .incomplete-back-btn { align-self: flex-end; background: #7f8c8d; color: #fff; text-decoration: none; padding: 8px 10px; border-radius: 6px; font-size: 0.8rem; font-weight: 700; display: inline-flex; align-items: center; gap: 6px; }
        .management-page-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; }
        .management-page-header .incomplete-back-btn { align-self: auto; flex-shrink: 0; }

        .card-list { display: flex; flex-direction: column; gap: 10px; }
        .item-card { display: flex; flex-direction: column; gap: 6px; border: 1px solid #e4e4e4; padding: 10px; border-radius: 8px; background: #fff; position: relative; touch-action: pan-y; transition: transform 0.15s ease, box-shadow 0.15s ease; }
        .item-card.dragging { opacity: 0.5; background: #ecf0f1; border: 2px dashed #3498db; box-shadow: 0 8px 16px rgba(0,0,0,0.2); }
        .item-card.fin-tournee-card { border-color: #2980b9; background: #f0f7fc; }
        
        .drag-handle { position: absolute; top: 10px; right: 12px; color: #95a5a6; cursor: grab; font-size: 1.1rem; padding: 4px; display: flex; align-items: center; justify-content: center; }
        .drag-handle:active { cursor: grabbing; color: #2c3e50; }

        .item-header { display: flex; justify-content: space-between; align-items: center; font-weight: bold; font-size: 0.75rem; color: #2c3e50; }
        .item-body { font-size: 0.75rem; color: #555; display: flex; flex-direction: column; gap: 3px; }
        
        .actions-row { display: flex; gap: 8px; margin-top: 6px; }
        .action-link { flex: 1; text-align: center; background: #3498db; color: white; text-decoration: none; padding: 8px; border-radius: 6px; font-size: 0.8rem; font-weight: bold; display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 36px; border: none; cursor: pointer; }
        .action-link.gps { background: #e67e22; }
        .action-link.tournee-vacances { background: #3498db; flex: 0.5; }
        .action-link.geolocate-pro { background: #16a085; flex: 0.5; }
        .action-link.tel { background: #27ae60; }
        .action-link.traiter { background: #8e44ad; }
        .mobile-container .actions-row button[type="submit"].action-link.traiter:not(:disabled) { background: #8e44ad; min-height: 36px; }
        .actions-row > form { display: contents; }
        @media (max-width: 480px) {
            .actions-row { flex-wrap: nowrap; gap: 4px; }
            .actions-row .action-link { flex: 1 1 0; min-width: 0; padding: 8px 4px; font-size: 0.72rem; gap: 3px; white-space: nowrap; }
            .actions-row .action-link.tournee-vacances { flex: 0.5; }
            .actions-row .action-link.geolocate-pro { flex: 0.5; }
        }
        .mobile-container .dropdown-content form {
            display: block;
            margin: 0;
            padding: 0;
            border: 0;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
        }

        .list-row-item { display: flex; align-items: center; justify-content: space-between; background: #fff; border: 1px solid #e4e4e4; padding: 10px; border-radius: 8px; font-size: 0.85rem; gap: 10px; }
        .list-row-left { display: flex; align-items: center; gap: 10px; flex: 1; }
        .list-row-left input[type="checkbox"] { width: 20px; height: 20px; cursor: pointer; flex-shrink: 0; }
        .client-name-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0; }
        .client-name-line > .legacy-style-014,
        .client-name-line > .type-code { flex-shrink: 0; }
        
        .icon-btn { color: #e74c3c; background: none; border: none; font-size: 1rem; cursor: pointer; text-decoration: none; padding: 5px; }
        .edit-icon-btn { color: #f39c12; }
        .vacances-icon-btn { color: #3498db; }
        .liste-action-buttons { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; flex-shrink: 0; }
        .liste-action-buttons > .icon-btn,
        .liste-action-buttons > form,
        .liste-action-buttons > form .icon-btn { width: 28px; height: 28px; }
        .liste-action-buttons > .icon-btn,
        .liste-action-buttons > form .icon-btn { display: inline-flex; align-items: center; justify-content: center; padding: 4px; }

        .pagination { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; gap: 10px; }
        .page-btn { flex: 1; text-align: center; background: #3498db; color: white; text-decoration: none; padding: 10px; border-radius: 6px; font-size: 0.85rem; font-weight: bold; }
        .page-btn.disabled { background: #bdc3c7; pointer-events: none; }
        .page-info { font-size: 0.8rem; color: #555; font-weight: 600; text-align: center; white-space: nowrap; }

        .login-card { width: 100%; max-width: 480px; background: #fff; padding: 25px; }
        .login-card.changelog-page-card { border-radius: 0; box-shadow: none; }
        .login-card label { font-size: 0.85rem; font-weight: 600; color: #555; display: block; margin-bottom: 5px; }
        .login-card input[type="text"], .login-card input[type="password"] { width: 100%; padding: 12px; border: 1px solid #ccc; border-radius: 6px; margin-bottom: 15px; }
        .login-card button[type="submit"] { width: 100%; background: #2ecc71; color: white; border: none; padding: 12px; border-radius: 6px; font-size: 1rem; font-weight: bold; cursor: pointer; min-height: 44px; }
        .default-hint { font-size: 0.75rem; color: #7f8c8d; text-align: center; margin-top: 15px; }
        .error { background: #f8d7da; color: #721c24; padding: 10px; border-radius: 6px; font-size: 0.85rem; text-align: center; margin-bottom: 15px; }

        .pwa-banner { display: none; align-items: center; justify-content: space-between; background: #2c3e50; color: #fff; padding: 10px 14px; border-radius: 8px; margin-bottom: 15px; font-size: 0.85rem; gap: 10px; }
        .pwa-banner button { background: #2ecc71; color: white; border: none; padding: 6px 12px; border-radius: 4px; font-weight: bold; cursor: pointer; font-size: 0.8rem; min-height: auto; }
        .pwa-banner-copy { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
        .pwa-banner-copy small { color: #ecf0f1; font-size: 0.72rem; line-height: 1.35; }

        #gps-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 1000; justify-content: center; align-items: flex-end; }
        .gps-modal-content { background: #fff; width: 100%; max-width: 480px; border-radius: 16px 16px 0 0; padding: 20px; display: flex; flex-direction: column; gap: 12px; animation: slideUp 0.3s ease-out; }
        @keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
        .gps-option { display: flex; align-items: center; gap: 12px; padding: 14px; background: #f8f9fa; border: 1px solid #e1e1e1; border-radius: 10px; text-decoration: none; color: #333; font-weight: bold; font-size: 0.95rem; }
        .gps-option.waze { color: #00bcd4; }
        .gps-option.gmaps { color: #ea4335; }
        .gps-option.apple { color: #000; }
        .gps-option.other-gps { color: #2d83ba; }
        .gps-close-btn { background: #e74c3c; color: white; border: none; padding: 12px; border-radius: 10px; font-weight: bold; font-size: 0.95rem; cursor: pointer; text-align: center; margin-top: 5px; }

        .app-footer { margin-top: auto; padding-top: 15px; border-top: 1px solid #eaeaea; text-align: center; font-size: 0.75rem; color: #7f8c8d; display: flex; flex-direction: column; gap: 4px; }
        .app-footer a { color: #3498db; text-decoration: none; font-weight: 600; }
        .app-footer a:hover { text-decoration: underline; }

        .pointeuse-form { display: flex; flex-direction: column; width: 100%; min-width: 0; max-width: 100%; overflow: hidden; gap: 15px; margin-bottom: 15px; background: #fafafa; padding: 12px; border-radius: 8px; border: 1px solid #eee; }
        .pointeuse-entry-form { width: 100%; min-width: 0; max-width: 100%; overflow: hidden; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
        .pointeuse-entry-form .form-group { width: 100%; min-width: 0; max-width: 100%; overflow: hidden; }
        .pointeuse-form-title { font-size: 1rem; color: #2c3e50; margin: 0 0 5px; }
        .pointeuse-edit-title { font-size: 0.85rem; font-weight: bold; color: #e67e22; }
        .pointeuse-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: 100%; gap: 8px; align-items: flex-start; }
        .pointeuse-row > .form-group { width: 100%; min-width: 0; max-width: 100%; overflow: hidden; }
        .pointeuse-input { width: 100% !important; min-width: 0 !important; max-width: 100% !important; inline-size: 100% !important; min-inline-size: 0 !important; padding: 12px 8px; border: 1px solid #ccc; border-radius: 6px; background: #fff; display: block; overflow: hidden; }
        input[type="date"], input[type="time"] {
            box-sizing: border-box !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            inline-size: 100% !important;
            min-inline-size: 0 !important;
            display: block;
            margin: 0;
            overflow: hidden;
            font-family: inherit;
            font-size: 0.85rem;
            line-height: 1.2;
            -webkit-appearance: none;
            appearance: none;
        }
        input[type="date"]::-webkit-date-and-time-value,
        input[type="time"]::-webkit-date-and-time-value {
            display: block;
            box-sizing: border-box;
            width: 100%;
            min-width: 0;
            margin: 0;
            padding: 0;
            text-align: left;
        }
        input[type="date"]::-webkit-calendar-picker-indicator,
        input[type="time"]::-webkit-calendar-picker-indicator {
            flex: 0 0 auto;
            margin: 0;
            padding: 0;
        }

        .pointeuse-break-section { background: #fff; border: 1px dashed #bbb; padding: 10px; border-radius: 6px; }
        .pointeuse-break-title { font-size: 0.8rem; font-weight: bold; color: #444; margin-bottom: 6px; }
        .pointeuse-break-row { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
        .pointeuse-break-row .pointeuse-input { flex: 1; min-width: 0; }
        .pointeuse-add-break { background: #3498db; color: white; border: none; padding: 10px; border-radius: 4px; font-size: 0.85rem; font-weight: bold; width: 100%; cursor: pointer; min-height: 42px; }
        .pointeuse-summary { background: #2c3e50; color: white; padding: 12px; border-radius: 8px; }
        .pointeuse-summary h2 { font-size: 0.95rem; margin-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 4px; }
        .pointeuse-summary-row { display: flex; justify-content: space-between; font-size: 0.85rem; margin-bottom: 4px; }
        .pointeuse-summary-total { font-size: 1rem; font-weight: bold; margin-top: 6px; border-top: 1px solid rgba(255,255,255,0.2); padding-top: 4px; color: #2ecc71; }
        .pointeuse-log-list { display: flex; flex-direction: column; gap: 8px; }
        .pointeuse-log-list h2 { font-size: 0.95rem; color: #333; margin-bottom: 4px; }
        .pointeuse-log-item { display: flex; justify-content: space-between; align-items: center; background: #fff; padding: 10px; border: 1px solid #e1e1e1; border-radius: 6px; font-size: 0.85rem; gap: 8px; }
        .pointeuse-log-info div { font-weight: 600; }
        .pointeuse-log-info span { font-size: 0.75rem; color: #7f8c8d; }
        .pointeuse-log-actions { display: flex; align-items: center; gap: 8px; }
        .pointeuse-delete-form { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
        .pointeuse-delete-form button[type="submit"] { background: none !important; color: #e74c3c !important; border: none !important; padding: 5px !important; margin: 0 !important; min-height: auto !important; font-size: 1rem !important; }
        .edit-btn { color: #f39c12; text-decoration: none; font-size: 1.1rem; padding: 5px; }
        .delete-btn { color: #e74c3c; background: none; border: none; cursor: pointer; font-size: 1.1rem; padding: 5px; text-decoration: none; }
        .pointeuse-chart-box { background: #fff; border: 1px solid #e1e1e1; padding: 10px 8px; border-radius: 8px; margin-bottom: 15px; overflow-x: auto; }
        .pointeuse-chart-title { font-size: 0.9rem; font-weight: bold; color: #2c3e50; margin-bottom: 10px; text-align: center; }
        .pointeuse-table { width: 100%; border-collapse: collapse; font-size: 0.75rem; margin-top: 6px; white-space: nowrap; }
        .pointeuse-table th, .pointeuse-table td { padding: 6px 4px; text-align: left; border-bottom: 1px solid #eee; }
        .pointeuse-table th { background: #f8f9fa; color: #555; }
        .pointeuse-year-nav { display: flex; justify-content: space-between; align-items: center; background: #eef2f5; padding: 6px 8px; border-radius: 6px; margin-bottom: 10px; font-size: 0.8rem; }
        .pointeuse-year-btn { background: #e67e22; color: white; text-decoration: none; padding: 4px 8px; border-radius: 4px; font-weight: bold; font-size: 0.75rem; min-height: 28px; display: inline-flex; align-items: center; justify-content: center; }
        .pointeuse-year-btn.disabled { background: #ccc; pointer-events: none; }
        .pointeuse-year-title { font-weight: bold; color: #2c3e50; }
        .pointeuse-total-row { background: #f8f9fa; font-weight: bold; border-top: 2px solid #ddd; }
.pointeuse-empty { text-align: center !important; color: #888; font-size: 0.8rem; padding: 10px; }
.reindex-orders-btn { background: #e67e22 !important; color: white; border: none; padding: 10px 12px; border-radius: 6px; font-size: 0.85rem; font-weight: bold; cursor: pointer; width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; }
.user-role-badge { font-size: 0.75rem; }
.user-role-admin { color: #2980b9; }
.user-role-driver { color: #27ae60; }
.is-hidden { display: none !important; }
.is-visible-block { display: block !important; }
.is-visible-flex { display: flex !important; }

/* Styles historiques extraits des vues pour une CSP stricte. */
.legacy-style-001 { background: #27ae60; color: white; text-decoration: none; padding: 10px 12px; border-radius: 6px; font-size: 0.85rem; font-weight: bold; display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 5px; }
.legacy-style-002 { background: #3498db; color: white; border: none; padding: 10px; border-radius: 6px; font-size: 0.85rem; font-weight: bold; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 5px; }
.legacy-style-003 { background: #3498db; color: white; text-decoration: none; padding: 10px 12px; border-radius: 6px; font-size: 0.85rem; font-weight: bold; display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 5px; }
.legacy-style-004 { background: #7f8c8d; color: white; text-decoration: none; padding: 6px 10px; border-radius: 6px; font-size: 0.8rem; font-weight: bold; }
.legacy-style-005 { background: #8e44ad; color: white; text-decoration: none; padding: 10px 12px; border-radius: 6px; font-size: 0.85rem; font-weight: bold; display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 5px; }
.legacy-style-006 { background: #fff; }
.legacy-style-007 { background: #fff; margin-bottom: 0; }
.legacy-style-008 { border: 0; border-top: 1px solid #eee; margin: 5px 0; }
.legacy-style-009 { color: #27ae60; }
.legacy-style-010 { color: #2980b9; }
.legacy-style-011 { color: #3498db; font-weight: 600; }
.legacy-style-012 { color: #8e44ad; }
.legacy-style-013 { color: #d35400; font-weight: 600; }
.legacy-style-014 { color: #e67e22; }
.legacy-style-015 { color:#27ae60; }
.legacy-style-016 { color:#2980b9; }
.legacy-style-017 { color:#2c3e50; font-size: 0.85rem; }
.legacy-style-018 { color:#8e44ad; }
.type-code { font-weight: 700; }
.type-code-sp8 { color: #8e44ad; }
.type-code-hn { color: #212121; }
.type-code-h9 { color: #c0392b; }
.type-code-h10 { color: #d35400; }
.type-code-h12 { color: #27ae60; }
.type-code-h13 { color: #2980b9; }
.type-code-h18 { color: #795548; }
.legacy-style-019 { color:#e67e22; }
.legacy-style-020 { color:#e74c3c; }
.legacy-style-021 { display: flex; align-items: center; gap: 4px; }
.legacy-style-022 { display: flex; align-items: center; gap: 6px; }
.legacy-style-023 { display: flex; align-items: center; justify-content: center; text-align: left; gap: 12px; margin-bottom: 15px; }
.legacy-style-024 { display: flex; flex-direction: column; gap: 12px; }
.legacy-style-025 { display: flex; flex-direction: column; gap: 2px; }
.legacy-style-026 { display: flex; justify-content: space-between; align-items: center; }
.legacy-style-027 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.legacy-style-028 { display: none; text-align: center; color: #777; font-size: 0.85rem; padding: 20px 0; }
.legacy-style-029 { font-size: 0.75rem; color: #27ae60; font-weight: 600; }
.legacy-style-029 a[x-apple-data-detectors] { color: inherit !important; font: inherit !important; text-decoration: none !important; }
.legacy-style-030 { font-size: 0.75rem; color: #2980b9; }
.legacy-style-031 { font-size: 0.75rem; color: #3498db; font-weight: 600; }
.legacy-style-032 { font-size: 0.75rem; color: #666; }
.legacy-style-033 { font-size: 0.75rem; color: #666; margin-bottom: 5px; }
.legacy-style-034 { font-size: 0.75rem; color: #7f8c8d; font-weight: 600; }
.legacy-style-035 { font-size: 0.75rem; color: #d35400; font-weight: 600; }
.legacy-style-036 { font-size: 0.75rem; color:#777; }
.legacy-style-037 { font-size: 0.75rem; padding: 3px 6px; border-radius: 4px; border: 1px solid #bce8f1; background: #fff; width: auto; }
.legacy-style-038 { font-size: 1rem; color: #2c3e50; line-height: 1.2; }
.legacy-style-039 { font-size: 1rem; color: #2c3e50; margin-top: 0; margin-bottom: 2px; }
.legacy-style-040 { font-size: 1rem; color: #2c3e50; margin-top: 0; margin-bottom: 5px; }
.legacy-style-041 { font-size: 1rem; color: #2c3e50; margin: 0; }
.legacy-style-042 { font-size: 1rem; color: #2c3e50; text-align: center; margin-bottom: 5px; }
.legacy-style-043 { font-size:0.75rem; color:#7f8c8d; font-weight:normal; display:block; }
.legacy-style-044 { font-size:0.75rem;color:#666; }
.legacy-style-045 { font-weight: normal; font-size: 0.75rem; color: #777; }
.legacy-style-046 { margin-bottom: 0; }
.legacy-style-047 { margin-bottom: 10px; }
.legacy-style-048 { margin-bottom: 10px; background: none; border: none; padding: 0; }
.legacy-style-049 { margin-bottom: 10px; position: relative; }
.legacy-style-050 { margin-bottom: 20px; }
.legacy-style-051 { margin-bottom: 20px; justify-content: center; }
.legacy-style-052 { margin-bottom: 5px; }
.legacy-style-053 { margin-top: 10px; }
.legacy-style-054 { margin-top: 10px; display: flex; flex-direction: column; gap: 12px; }
.legacy-style-055 { margin-top: 12px; }
.legacy-style-056 { margin-top: 15px; }
.legacy-style-057 { margin-top: 2px; position: relative; }
.legacy-style-058 { margin-top: 5px; }
.legacy-style-059 { max-width: 480px; }
.legacy-style-060 { padding: 10px 12px; font-size: 0.85rem; border-radius: 6px; border: 1px solid #ccc; width: 100%; background: #fff; }
.legacy-style-061 { padding: 8px 10px; font-size: 0.8rem; border-radius: 6px; border: 1px solid #ccc; width: 100%; background: #fff; }
.legacy-style-062 { text-align: center; }
.legacy-style-063 { text-align: center; color: #777; font-size: 0.85rem; padding: 10px 0; }
.legacy-style-064 { text-align: center; color: #777; font-size: 0.85rem; padding: 20px 0; }
.legacy-style-065 { text-align:center;color:#777;font-size:.85rem; }
.legacy-style-066 { white-space: pre-line; color: #333; }
.legacy-style-067 { white-space: pre-line; color: #333; margin-top: 5px; }
.legacy-style-068 { width: 40px; height: 40px; flex-shrink: 0; }

.tournee-code-summary { min-width: 0; }
.tournee-counters { display: flex; flex-wrap: wrap; gap: 2px 6px; margin-top: 3px; font-size: 0.72rem; font-weight: 700; }
.tournee-counter-professionnels { color: #2980b9; }
.tournee-counter-particuliers { color: #8e44ad; }
.tournee-counter-incomplets { color: #e67e22; }
.incomplete-list-icon-btn { color: #3498db; }

.rules-management-link { background: #16a085; color: #fff; text-decoration: none; padding: 10px 12px; border-radius: 6px; font-size: 0.85rem; font-weight: bold; display: flex; align-items: center; justify-content: center; gap: 8px; }
.rules-page, .rules-admin-page { display: flex; flex-direction: column; gap: 12px; }
.rules-page-title { padding-bottom: 6px; border-bottom: 1px solid #eee; }
.rule-card { border: 1px solid #ddd; border-left: 4px solid #8e44ad; border-radius: 8px; padding: 12px; background: #fff; }
.rule-card h2 { color: #2c3e50; font-size: 1rem; margin-bottom: 10px; }
.rule-content { font-size: 0.84rem; line-height: 1.55; overflow-wrap: anywhere; white-space: normal; }
.rule-content h2, .rule-content h3 { margin: 10px 0 5px; color: #2c3e50; }
.rule-content blockquote { margin: 8px 0; padding: 8px 10px; border-left: 3px solid #8e44ad; background: #f7f2fa; }
.rule-content ul { padding-left: 22px; margin: 8px 0; }
.rule-content a { color: #2980b9; }
.rule-code { position: relative; margin: 10px 0; padding: 30px 10px 10px; border-radius: 7px; background: #1f2933; color: #e8eef3; overflow-x: auto; white-space: pre; font-size: 0.75rem; line-height: 1.5; }
.rule-code code { font-family: Consolas, Monaco, monospace; }
.rule-code-language { position: absolute; top: 6px; right: 8px; color: #95a5a6; font-size: 0.65rem; font-weight: 700; }
.syntax-comment { color: #7f8c8d; }
.syntax-string { color: #a3d977; }
.syntax-keyword { color: #c792ea; font-weight: 600; }
.syntax-number { color: #f78c6c; }
.syntax-property { color: #82aaff; }
.syntax-tag { color: #f07178; }
.rule-form-row { display: grid; grid-template-columns: 1fr 90px; gap: 8px; }
.bbcode-toolbar { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px; border: none; border-radius: 6px; background: #eef2f5; }
html:not([data-theme="dark"]) .bbcode-toolbar { border: none; border-radius: 6px; }
.bbcode-toolbar button { min-width: 34px; min-height: 32px; border: 1px solid #ccd4da; border-radius: 4px; background: #fff; color: #2c3e50; cursor: pointer; }
.bbcode-toolbar select { width: auto; min-height: 32px; padding: 4px 6px; }
#rule-content, #changelog-content { min-height: 260px; border-radius: 0 0 6px 6px; font-family: Consolas, Monaco, monospace; font-size: 0.78rem; }
.rule-editor-help { color: #777; font-size: 0.7rem; }
.rule-active-label { display: flex; align-items: center; gap: 7px; }
.rules-admin-list { margin-top: 8px; }
.rule-state { display: inline-block; margin-left: 4px; padding: 2px 5px; border-radius: 4px; color: #fff; font-size: 0.65rem; }
.rule-state.is-active { background: #27ae60; }
.rule-state.is-inactive { background: #7f8c8d; }
.rule-color-red { color: #e74c3c; }
.rule-color-blue { color: #3498db; }
.rule-color-green { color: #27ae60; }
.rule-color-purple { color: #8e44ad; }
.rule-color-orange { color: #e67e22; }
.rule-color-dark { color: #2c3e50; }

/* Thème sombre optionnel — le thème clair reste le thème par défaut. */
html[data-theme="light"] { color-scheme: light; background: #fff; }
html[data-theme="dark"] { color-scheme: dark; background: #171e27; }
html[data-theme="dark"] body { background: #171e27; color: #e6edf3; }
html[data-theme="dark"] .mobile-container,
html[data-theme="dark"] .login-card { background: #171e27; color: #e6edf3; }
html[data-theme="dark"] .app-header h1,
html[data-theme="dark"] .section-title,
html[data-theme="dark"] .item-header,
html[data-theme="dark"] .pointeuse-form-title,
html[data-theme="dark"] .rule-card h2,
html[data-theme="dark"] .rule-content h2,
html[data-theme="dark"] .rule-content h3,
html[data-theme="dark"] .legacy-style-017,
html[data-theme="dark"] .legacy-style-038,
html[data-theme="dark"] .legacy-style-039,
html[data-theme="dark"] .legacy-style-040,
html[data-theme="dark"] .legacy-style-041,
html[data-theme="dark"] .legacy-style-042 { color: #edf3f8; }
html[data-theme="dark"] .nav-tabs { background: #252e3a; }
html[data-theme="dark"] .dropdown-content { background: #202935; border-color: #3a4655; box-shadow: 0 8px 18px rgba(0,0,0,0.45); }
html[data-theme="dark"] .dropdown-content a,
html[data-theme="dark"] .dropdown-content button.theme-toggle { background: #202935; color: #e6edf3; border-color: #3a4655; }
html[data-theme="dark"] .dropdown-content a:hover,
html[data-theme="dark"] .dropdown-content button.theme-toggle:hover { background: #2b3745; }
html[data-theme="dark"] .mobile-container .dropdown-content button[type="submit"].logout-link { background: #202935; border-color: #3a4655; }
html[data-theme="dark"] .section-box,
html[data-theme="dark"] .mobile-container form,
html[data-theme="dark"] .pointeuse-form { background: #1d2631; border-color: #364252; }
html[data-theme="dark"] .item-card,
html[data-theme="dark"] .list-row-item,
html[data-theme="dark"] .rule-card,
html[data-theme="dark"] .pointeuse-log-item { background: #222c38; border-color: #3b4858; }
html[data-theme="dark"] .search-online-box { background: #1b3140; border-color: #31566c; }
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="time"],
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .vacances-date-input,
html[data-theme="dark"] .pointeuse-input { background: #111820; border-color: #465466; color: #edf3f8; }
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #8795a5; }
html[data-theme="dark"] label,
html[data-theme="dark"] .item-body,
html[data-theme="dark"] .page-info,
html[data-theme="dark"] .legacy-style-032,
html[data-theme="dark"] .legacy-style-033,
html[data-theme="dark"] .legacy-style-036,
html[data-theme="dark"] .legacy-style-044,
html[data-theme="dark"] .legacy-style-045,
html[data-theme="dark"] .legacy-style-066,
html[data-theme="dark"] .legacy-style-067 { color: #bdc8d4; }
html[data-theme="dark"] .suggestions-list,
html[data-theme="dark"] .gps-modal-content { background: #202935; border-color: #3a4655; }
html[data-theme="dark"] .suggestion-item { color: #e6edf3; border-color: #344151; }
html[data-theme="dark"] .suggestion-item:hover,
html[data-theme="dark"] .gps-option { background: #283341; border-color: #3d4b5b; }
html[data-theme="dark"] .gps-option.apple { color: #f2f5f7; }
html[data-theme="dark"] .gps-option.other-gps { color: #74c0e8; }
html[data-theme="dark"] .rule-content blockquote { background: #292333; }
html[data-theme="dark"] .bbcode-toolbar { background: #252e3a; border-color: #465466; }
html[data-theme="dark"] .bbcode-toolbar button { background: #17202a; border-color: #465466; color: #edf3f8; }
html[data-theme="dark"] .app-footer { border-color: #354151; color: #94a3b3; }
html[data-theme="dark"] .type-code-hn { color: #aeb9c5; }
html[data-theme="dark"] .pointeuse-break-section { background: #222c38; border-color: #536174; }

.tournee-card-identity { display: flex; align-items: flex-start; gap: 15px; min-width: 0; }
.fin-tournee-card .item-header { display: block; }
.fin-tournee-card .tournee-card-identity { display: inline; }
.tournee-badges-stack { display: inline-flex; flex-direction: column; align-items: stretch; gap: 3px; flex-shrink: 0; }
#tournee-list-container .tournee-badges-stack .type-code,
#tournee-list-container .tournee-badges-stack .order-badge { min-width: 35px; padding: 5px 7px; border-radius: 5px; color: #fff; font-size: .76rem; font-weight: 800; line-height: 1; text-align: center; }
#tournee-list-container .tournee-badges-stack .type-code { background: #607d8b; }
#tournee-list-container .tournee-badges-stack .order-badge { background: #0d6efd; }
#tournee-list-container .tournee-badges-stack .type-code-sp8 { background: #8e44ad; }
#tournee-list-container .tournee-badges-stack .type-code-hn { background: #212121; }
#tournee-list-container .tournee-badges-stack .type-code-h9 { background: #c0392b; }
#tournee-list-container .tournee-badges-stack .type-code-h10 { background: #d35400; }
#tournee-list-container .tournee-badges-stack .type-code-h12 { background: #27ae60; }
#tournee-list-container .tournee-badges-stack .type-code-h13 { background: #2980b9; }
#tournee-list-container .tournee-badges-stack .type-code-h18 { background: #795548; }
.tournee-client-info { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; line-height: 1.35; }
.tournee-client-name { min-width: 0; display: inline-flex; align-items: center; gap: 6px; }
.tournee-client-address,
.tournee-client-phone { color: #555; font-size: .72rem; font-weight: 400; }
.tournee-client-address,
.tournee-client-phone { display: inline-flex; align-items: flex-start; gap: 5px; }
.tournee-client-address > i,
.tournee-client-phone > i { width: 14px; margin-top: 2px; flex-shrink: 0; text-align: center; }
.tournee-client-address > i { color: #e74c3c; }
.tournee-client-phone > i { color: #27ae60; }
.tournee-client-address > span { white-space: pre-line; }
.tournee-client-kind-icon { color: #607d8b; width: 14px; text-align: center; flex-shrink: 0; }
.tournee-client-item .item-body { padding-left: 42px; }
.item-card.has-opening-status .item-header,
.item-card.has-opening-status .item-body { padding-right: 100px; }
.tournee-client-item .item-header { align-items: flex-start; }
.item-card.has-opening-status .item-header { min-height: auto; }
.tournee-opening-block { position: absolute; top: 10px; right: 10px; width: 86px; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; }
.opening-status { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 6px; font-size: .72rem; font-weight: 800; line-height: 1; }
.opening-status.is-open { color: #16835d; background: #def7ec; }
.opening-status.is-closed { color: #b42318; background: #fee4e2; }
.tournee-hours-lines { display: flex; flex-direction: column; color: #d35400; font-size: .65rem; font-weight: 700; line-height: 1.35; white-space: nowrap; }
#tournee-list-container .actions-row { padding-top: 8px; border-top: 1px solid #e5e7eb; }
#tournee-list-container .actions-row .tournee-drag-action { position: static; flex: .5; min-width: 0; margin: 0; padding: 8px 4px; background: transparent; color: #7f8c8d; cursor: grab; font-size: .8rem; }
#tournee-list-container .actions-row .tournee-drag-action:active { cursor: grabbing; color: #fff; }
html[data-theme="dark"] .opening-status.is-open { color: #6ce9bd; background: #164c3b; }
html[data-theme="dark"] .opening-status.is-closed { color: #fda29b; background: #551c1c; }
html[data-theme="dark"] .tournee-hours-lines { color: #fff; }
html[data-theme="dark"] .tournee-client-kind-icon { color: #cbd5e1; }
html[data-theme="dark"] .tournee-client-address,
html[data-theme="dark"] .tournee-client-phone { color: #bdc8d4; }
html[data-theme="dark"] #tournee-list-container .actions-row { border-top-color: #3b4858; }
html[data-theme="dark"] #tournee-list-container .actions-row .tournee-drag-action { background: transparent; color: #aab6c4; }
html[data-theme="dark"] #tournee-list-container .tournee-badges-stack .type-code { background: #526b78; }
html[data-theme="dark"] #tournee-list-container .tournee-badges-stack .type-code-sp8 { background: #8e44ad; }
html[data-theme="dark"] #tournee-list-container .tournee-badges-stack .type-code-hn { background: #212121; }
html[data-theme="dark"] #tournee-list-container .tournee-badges-stack .type-code-h9 { background: #c0392b; }
html[data-theme="dark"] #tournee-list-container .tournee-badges-stack .type-code-h10 { background: #d35400; }
html[data-theme="dark"] #tournee-list-container .tournee-badges-stack .type-code-h12 { background: #27ae60; }
html[data-theme="dark"] #tournee-list-container .tournee-badges-stack .type-code-h13 { background: #2980b9; }
html[data-theme="dark"] #tournee-list-container .tournee-badges-stack .type-code-h18 { background: #795548; }
html[data-theme="dark"] .pointeuse-break-title,
html[data-theme="dark"] .pointeuse-log-list h2,
html[data-theme="dark"] .pointeuse-chart-title,
html[data-theme="dark"] .pointeuse-year-title { color: #edf3f8; }
html[data-theme="dark"] .pointeuse-chart-box { background: #1d2631; border-color: #3b4858; }
html[data-theme="dark"] .pointeuse-year-nav { background: #283442; }
html[data-theme="dark"] .pointeuse-table th { background: #283442; color: #dce5ed; }
html[data-theme="dark"] .pointeuse-table th,
html[data-theme="dark"] .pointeuse-table td { border-color: #3b4858; }
html[data-theme="dark"] .pointeuse-total-row { background: #283442; border-color: #536174; }
html[data-theme="dark"] .pointeuse-year-btn.disabled { background: #4a5665; color: #aeb9c5; }
html[data-theme="dark"] .pointeuse-empty,
html[data-theme="dark"] .pointeuse-log-info span { color: #aeb9c5; }
html[data-theme="dark"] .pointeuse-summary { background: #111820; }
html[data-theme="dark"] .pointeuse-form .legacy-style-008 { border-top-color: #3b4858; }