
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:Georgia,serif;background:#fdf8f0;color:#1a1a1a;font-size:14px}
input,select,textarea,button{font-family:Georgia,serif;font-size:14px}
a{text-decoration:none;color:inherit}
/* LOGIN */
.login-body{background:#2c1810;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.login-box{background:white;border-radius:18px;padding:36px;width:100%;max-width:390px;box-shadow:0 12px 50px rgba(0,0,0,.4)}
.login-logo{font-size:26px;font-weight:bold;color:#8B6914;letter-spacing:2px;text-align:center}
.login-sub{font-size:13px;color:#888;text-align:center;margin-top:4px;margin-bottom:24px}
.login-roles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.role-box{border-radius:10px;padding:12px;text-align:center;font-size:12px}
.role-box div{font-size:22px;margin-bottom:4px}.role-box strong{display:block;margin-bottom:2px}
.role-box small{color:#666;font-size:10px}
.role-box.green{background:#dcfce7;color:#166534}.role-box.blue{background:#dbeafe;color:#1e40af}
/* HEADER */
.app-header{background:#2c1810;color:white;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.header-brand{display:flex;align-items:center;gap:10px}
.header-logo{font-size:17px;font-weight:bold;color:#d4a853}
.header-badge{font-size:10px;font-weight:bold;color:white;padding:2px 8px;border-radius:10px}
.badge-rec{background:#22c55e}.badge-ch{background:#3b82f6}
.header-nav{display:flex;gap:5px;flex-wrap:wrap}
.nav-btn{padding:5px 13px;border-radius:18px;background:#4a3020;color:white;font-size:12px;transition:background .15s}
.nav-btn:hover,.nav-btn.active{background:#d4a853}
.nav-logout{border:1px solid #ef4444;background:transparent;color:#fca5a5}
.nav-logout:hover{background:#ef4444;color:white}
/* MAIN */
.app-main{padding:14px;max-width:1200px;margin:0 auto}
/* BUTTONS */
.btn-gold{background:#8B6914;color:white;border:none;border-radius:8px;padding:8px 18px;cursor:pointer;display:inline-block;text-align:center}
.btn-gold:hover{background:#a07820}.btn-block{display:block;width:100%;text-align:center}
.btn-outline{background:white;color:#8B6914;border:2px solid #8B6914;border-radius:8px;padding:7px 16px;cursor:pointer;display:inline-block}
.btn-sm{padding:3px 10px;border-radius:5px;font-size:12px;cursor:pointer;border:1px solid;display:inline-block}
.btn-blue{background:#eff6ff;color:#2563eb;border-color:#3b82f6}
.btn-orange{background:#fffbeb;color:#b45309;border-color:#f59e0b}
/* ALERTS */
.alert-error{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5;border-radius:8px;padding:10px 14px;margin-bottom:14px;font-size:13px}
.alert-success{background:#dcfce7;color:#166534;border:1px solid #86efac;border-radius:8px;padding:10px 14px;margin-bottom:14px;font-size:13px}
/* FORM */
.field{margin-bottom:12px}.field label{font-size:13px;color:#555;display:block;margin-bottom:4px}
.field input,.field select,.field textarea{width:100%;padding:8px 12px;border:1px solid #d4a853;border-radius:8px;background:white}
.field textarea{resize:vertical}.req{color:#dc2626}
fieldset{border:1px solid #e0d5c0;border-radius:10px;padding:14px;margin-bottom:14px}
legend{color:#8B6914;font-size:13px;padding:0 6px;font-weight:bold}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.radio-group{display:flex;gap:10px}
.radio-card{display:flex;align-items:center;gap:6px;flex:1;justify-content:center;padding:9px;border-radius:8px;border:2px solid #e0d5c0;cursor:pointer;background:white;font-size:13px}
.radio-card.active,.radio-card:has(input:checked){border-color:#8B6914;background:#fef3c7}
.montant-box{background:#fef3c7;border-radius:8px;padding:12px 14px;margin-top:10px}
.montant-row{display:flex;justify-content:space-between;margin-bottom:4px;font-size:13px;color:#92400e}
.montant-total{display:flex;justify-content:space-between;border-top:1px solid #d4a853;padding-top:8px;margin-top:4px;font-weight:bold;font-size:16px;color:#8B6914}
.form-page{max-width:580px;margin:0 auto}
.form-page h2{color:#2c1810;margin-bottom:16px;font-size:18px}
.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
/* LAYOUT */
.page-layout{display:grid;grid-template-columns:300px 1fr;gap:14px;align-items:start}
.sidebar{}
.content{}
.content-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.content-header h3{color:#8B6914;font-size:15px;margin:0}
.content-header span{font-size:12px;color:#888}
.empty-state{text-align:center;padding:40px;color:#aaa;background:white;border-radius:10px;font-size:14px}
.date-sep{font-size:11px;color:#888;font-weight:bold;margin:10px 0 4px}
/* CALENDRIER */
.cal-wrap{background:white;border-radius:12px;padding:14px;box-shadow:0 2px 10px rgba(0,0,0,.07)}
.cal-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.cal-arrow{background:#f0ebe0;color:#8B6914;padding:4px 12px;border-radius:8px;font-size:16px;display:inline-block}
.cal-title{text-align:center}.cal-title strong{display:block;font-size:14px;color:#2c1810}
.cal-title span{font-size:11px;color:#888}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:2px}
.cal-head div{text-align:center;font-size:10px;font-weight:bold;color:#888;padding:2px 0}
.cal-day{min-height:44px;border-radius:6px;padding:3px;background:white;border:1px solid #f0ebe0;display:flex;flex-direction:column;align-items:center}
.cal-day.sel{background:#fef3c7;border-color:#d4a853}
.cal-day.today{background:#fff8e6;border-color:#f59e0b}
.cal-num{font-size:11px;color:#333;margin-bottom:1px}
.cal-day.today .cal-num{font-weight:bold;color:#8B6914}
.cal-pip{border-radius:3px;font-size:8px;color:white;padding:1px 2px;width:100%;text-align:center;margin-top:1px}
.cal-pip.green{background:#22c55e}.cal-pip.blue{background:#3b82f6}.cal-pip.red{background:#ef4444}
.legende{background:white;border-radius:10px;padding:12px;margin-top:8px;font-size:12px;color:#888}
/* COURSE CARD */
.course-card{background:white;border-radius:10px;padding:12px;box-shadow:0 2px 8px rgba(0,0,0,.07);border-left:4px solid #ccc;margin-bottom:8px}
.course-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px;margin-bottom:6px}
.course-info{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.course-right{display:flex;align-items:center;gap:6px}
.client-name{font-size:14px;font-weight:bold;color:#2c1810}
.chambre,.pers{font-size:12px;color:#888}
.montant{font-size:13px;font-weight:bold}
.badge-type{font-size:10px;padding:1px 6px;border-radius:8px;font-weight:bold}
.badge-type.hotel{background:#dbeafe;color:#1e40af}.badge-type.exterieur{background:#fef3c7;color:#92400e}
.badge-retour{font-size:10px;padding:1px 6px;border-radius:8px;font-weight:bold;background:#f5f3ff;color:#6d28d9}
.badge-statut{font-size:11px;padding:2px 8px;border-radius:12px;font-weight:bold}
.course-meta{display:flex;gap:10px;font-size:12px;color:#555;flex-wrap:wrap;margin-bottom:6px}
.course-trajet{padding:8px 10px;background:#fdf8f0;border-radius:8px;margin-bottom:6px}
.trajet-row{display:flex;gap:6px;align-items:flex-start;margin-bottom:3px}
.trajet-row:last-child{margin-bottom:0}
.t-icon{font-size:13px;min-width:18px}
.t-comp{font-size:11px;color:#888;display:block}
.course-extras{display:flex;flex-direction:column;gap:3px;margin-bottom:6px}
.extra-box{font-size:12px;padding:3px 8px;border-radius:6px}
.extra-box.orange{background:#fef3c7;color:#92400e}
.extra-box.blue{background:#f0f9ff;color:#0369a1}
.extra-box.purple{background:#f5f3ff;color:#6d28d9}
.suivi-mini{display:flex;gap:3px;flex-wrap:wrap;margin-bottom:5px}
.suivi-pip{font-size:9px;padding:1px 5px;border-radius:6px;background:#f0ebe0;color:#bbb}
.suivi-pip.done{color:white}
.ann-info{font-size:11px;color:#ef4444;padding:3px 8px;background:#fef2f2;border-radius:6px;margin-bottom:5px}
.course-actions{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
/* SUIVI ETAPES */
.suivi-wrap{margin-top:10px;border-top:1px solid #f0ebe0;padding-top:10px}
.suivi-label{font-size:11px;color:#888;margin-bottom:8px}
.etapes-grid{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}
.etape-btn{flex:1 1 80px;padding:8px 4px;border-radius:8px;border:2px solid #e0d5c0;background:#fafaf8;color:#ccc;cursor:default;text-align:center;transition:all .15s;display:flex;flex-direction:column;align-items:center;width:100%}
.etape-btn.actif{cursor:pointer;transform:scale(1.04);box-shadow:0 3px 10px rgba(0,0,0,.12);background:#fffbf0}
.etape-btn.fait{color:white}
.etape-btn:disabled{opacity:.6;cursor:not-allowed}
.etape-icon{font-size:20px;margin-bottom:2px}
.etape-lbl{font-size:11px;font-weight:bold}
.etape-time{font-size:10px;margin-top:3px}
.prog-wrap{background:#f0ebe0;border-radius:20px;height:7px;overflow:hidden;margin-bottom:4px}
.prog-bar{height:100%;border-radius:20px;background:linear-gradient(90deg,#d4a853,#22c55e);transition:width .4s}
.prog-labels{display:flex;justify-content:space-between;font-size:11px;color:#888;margin-bottom:6px}
.histo{margin-top:5px}
.histo summary{font-size:12px;color:#8B6914;cursor:pointer;user-select:none}
.histo-list{margin-top:6px;display:flex;flex-direction:column;gap:3px}
.histo-row{display:flex;align-items:center;gap:8px;font-size:12px;background:#fdf8f0;padding:5px 10px;border-radius:5px;border:1px solid #f0ebe0}
/* RAPPORTS */
.rap-toolbar{background:white;border-radius:12px;padding:14px;margin-bottom:10px;box-shadow:0 2px 8px rgba(0,0,0,.07);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;align-items:center}
.rap-filtres{background:white;border-radius:12px;padding:12px;margin-bottom:10px;box-shadow:0 2px 8px rgba(0,0,0,.07);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.filter-btn{padding:4px 12px;border-radius:18px;border:1px solid #d4a853;font-size:12px;background:white;color:#8B6914;cursor:pointer;display:inline-block}
.filter-btn.active{background:#d4a853;color:white}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:10px}
.stat-card{background:white;border-radius:10px;padding:12px;text-align:center;box-shadow:0 2px 6px rgba(0,0,0,.07)}
.stat-card.stat-red{border:1px solid #fca5a5}
.stat-icon{font-size:20px}.stat-val{font-size:16px;font-weight:bold;margin-top:3px}.stat-lbl{font-size:11px;color:#888}
.table-wrap{background:white;border-radius:12px;padding:12px;box-shadow:0 2px 8px rgba(0,0,0,.07);overflow-x:auto}
.data-table{width:100%;border-collapse:collapse;font-size:12px}
.data-table th{background:#8B6914;color:white;padding:7px 8px;text-align:left;font-weight:normal;white-space:nowrap}
.data-table td{padding:6px 8px;border-bottom:1px solid #ede8de}
@media(max-width:700px){.page-layout{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}}
@media print{.app-header,.nav-btn,.course-actions,.btn,.btn-gold,.btn-outline{display:none!important}body{background:white}.app-main{padding:0;max-width:100%}body{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
