:root {
      --sidebar-bg: #092E43;
      --sidebar-hover: #0E3550;
      --sidebar-active: #19529E;
      --bg-primary: #f1f5f9;
      --bg-secondary: #ffffff;
      --text-primary: #092E43;
      --text-secondary: #475569;
      --text-muted: #94a3b8;
      --accent: #19529E;
      --accent-light: #D3E2F2;
      --accent-dark: #123E78;
      --success: #07A385;
      --success-light: #D0EFE8;
      --warning: #DCBF1B;
      --warning-light: #FAF3D2;
      --danger: #E21838;
      --danger-light: #FBD9DE;
      --purple: #5C2A83;
      --purple-light: #EFE6F5;
      --cyan: #008DD1;
      --border: #e2e8f0;
      --shadow: 0 1px 3px rgba(0,0,0,0.1);
    }
    .dark {
      --sidebar-bg: #061B27;
      --sidebar-hover: #0B2A3C;
      --bg-primary: #071F2C;
      --bg-secondary: #0B2A3C;
      --text-primary: #f1f5f9;
      --text-secondary: #94a3b8;
      --text-muted: #64748b;
      --border: #334155;
    }
    * { box-sizing: border-box; margin: 0; padding: 0; }

    /* Fix global pour empêcher les débordements de texte */
    html, body {
      overflow-x: hidden;
      max-width: 100vw;
    }
    body {
      font-family: 'Glacial Indifference', 'Nunito', -apple-system, sans-serif;
      background: var(--bg-primary);
      color: var(--text-primary);
      font-size: 14px;
      line-height: 1.5;
      word-wrap: break-word;
      overflow-wrap: break-word;
    }
    h1, h2, h3, h4, h5, h6, p, span, div, label, a, td, th {
      overflow-wrap: break-word;
      word-break: break-word;
    }
    .app-container { display: flex; min-height: 100vh; overflow-x: hidden; }

    /* Sidebar */
    /* ==========================================
       SIDEBAR RÉTRACTABLE
       ========================================== */
    .sidebar {
      width: 72px;
      background: var(--sidebar-bg);
      position: fixed;
      height: 100vh;
      z-index: 100;
      display: flex;
      flex-direction: column;
      transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      overflow: hidden;
    }
    .sidebar:hover {
      width: 280px;
    }
    .sidebar-header {
      padding: 16px;
      display: flex;
      align-items: center;
      gap: 12px;
      min-height: 72px;
    }
    .sidebar-logo {
      width: 40px;
      height: 40px;
      min-width: 40px;
      background: linear-gradient(135deg, #19529E, #5C2A83);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      font-weight: 800;
      font-size: 14px;
    }
    .sidebar-brand {
      opacity: 0;
      white-space: nowrap;
      transition: opacity 0.2s ease;
    }
    .sidebar:hover .sidebar-brand {
      opacity: 1;
    }
    .sidebar-brand h1 { color: white; font-size: 18px; margin: 0; }
    .sidebar-brand span { color: #64748b; font-size: 11px; }
    .sidebar-nav { padding: 8px; flex: 1; overflow-y: auto; overflow-x: hidden; }
    .nav-section { margin-bottom: 16px; }
    .nav-section-title {
      font-size: 11px;
      font-weight: 600;
      text-transform: uppercase;
      color: #64748b;
      padding: 8px 16px;
      white-space: nowrap;
      opacity: 0;
      transition: opacity 0.2s ease;
    }
    .sidebar:hover .nav-section-title {
      opacity: 1;
    }
    .nav-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 16px;
      color: #94a3b8;
      cursor: pointer;
      border-radius: 12px;
      margin-bottom: 4px;
      transition: all 0.2s;
      font-weight: 500;
      white-space: nowrap;
      position: relative;
    }
    .nav-item:hover { 
      background: var(--sidebar-hover); 
      color: white; 
    }
    .nav-item.active {
      background: linear-gradient(135deg, #ef6351, #DCBF1B);
      color: white;
      box-shadow: 0 4px 15px rgba(239, 99, 81, 0.4);
    }
    .nav-item i { 
      width: 24px; 
      min-width: 24px;
      font-size: 18px; 
      text-align: center;
    }
    .nav-item span {
      opacity: 0;
      transition: opacity 0.2s ease;
    }
    .sidebar:hover .nav-item span {
      opacity: 1;
    }
    .nav-item .badge {
      margin-left: auto;
      background: #E21838;
      color: white;
      font-size: 11px;
      padding: 2px 8px;
      border-radius: 10px;
      opacity: 0;
      transition: opacity 0.2s ease;
    }
    .sidebar:hover .nav-item .badge {
      opacity: 1;
    }
    /* Tooltip pour sidebar fermée */
    .nav-item::after {
      content: attr(data-tooltip);
      position: absolute;
      left: 72px;
      background: #0E3550;
      color: white;
      padding: 8px 12px;
      border-radius: 8px;
      font-size: 13px;
      white-space: nowrap;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.2s ease;
      z-index: 1000;
      box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    }
    .sidebar:not(:hover) .nav-item:hover::after {
      opacity: 1;
    }
    /* ══════ SIDEBAR FOOTER ══════ */
.sidebar-footer {
    padding: 12px;
    border-top: 1px solid rgba(255,255,255,0.06);
    margin-top: auto;
}

.sidebar-footer .sb-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px;
    background: rgba(255,255,255,0.04);
    border-radius: 12px;
    margin-bottom: 8px;
}
.sidebar-footer .sb-card:hover {
    background: rgba(255,255,255,0.08);
}

.sidebar-footer .sb-avatar {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #19529E, #5C2A83);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 14px;
}

.sidebar-footer .sb-info {
    overflow: hidden;
    opacity: 0;
    width: 0;
    transition: opacity 0.2s ease, width 0.3s ease;
    white-space: nowrap;
}
.sidebar:hover .sidebar-footer .sb-info {
    opacity: 1;
    width: 160px;
}

.sidebar-footer .sb-name {
    color: #f1f5f9;
    font-weight: 600;
    font-size: 13px;
    line-height: 1.3;
}
.sidebar-footer .sb-role {
    color: #64748b;
    font-size: 11px;
    line-height: 1.3;
}

.sidebar-footer .sb-actions {
    display: flex;
    flex-direction: column;
    gap: 4px;
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: all 0.3s ease;
}
.sidebar:hover .sidebar-footer .sb-actions {
    opacity: 1;
    max-height: 100px;
}

.sidebar-footer .sb-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 12px;
    border: none;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}
.sidebar-footer .sb-btn.admin {
    background: rgba(99,102,241,0.1);
    color: #8FAAD2;
}
.sidebar-footer .sb-btn.admin:hover {
    background: rgba(99,102,241,0.2);
}
.sidebar-footer .sb-btn.logout {
    background: rgba(239,68,68,0.1);
    color: #EFA3AE;
}
.sidebar-footer .sb-btn.logout:hover {
    background: rgba(239,68,68,0.2);
}
.sidebar-footer .sb-btn i {
    width: 16px;
    text-align: center;
    font-size: 12px;
}
/* ══════ RECHERCHE SIDEBAR ══════ */
.nav-search-wrap {
    padding: 4px 8px 12px;
}
.nav-search {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 10px;
    padding: 8px 12px;
    transition: all 0.2s;
}
.nav-search:focus-within {
    border-color: #19529E;
    background: rgba(99,102,241,0.08);
}
.nav-search i {
    color: #64748b;
    font-size: 13px;
    min-width: 16px;
}
.nav-search input {
    background: none;
    border: none;
    color: #e2e8f0;
    font-size: 13px;
    width: 100%;
    outline: none;
    opacity: 0;
    transition: opacity 0.2s;
}
.sidebar:hover .nav-search input {
    opacity: 1;
}
.nav-search input::placeholder {
    color: #475569;
}
.sidebar:not(:hover) .nav-search input {
    width: 0;
    padding: 0;
}

/* ══════ SECTION PARAMÈTRES ══════ */
.nav-section-bottom {
    margin-top: auto;
    padding-top: 8px;
    border-top: 1px solid rgba(255,255,255,0.06);
}

/* ══════ FOOTER ACTIONS ══════ */
.user-actions {
    width: 100%;
    display: flex;
    gap: 6px;
    margin-top: 4px;
}
.admin-btn, .deco-btn {
    flex: 1;
    padding: 6px 8px;
    font-size: 11px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    transition: all 0.15s;
}
.admin-btn {
    background: #D3E2F2;
    color: #123E78;
}
.deco-btn {
    background: #FBD9DE;
    color: #BB142E;
}
.admin-btn:hover { background: #BBD0E8; }
.deco-btn:hover { background: #F4C0C8; }
    /* Main */
    .main-content { 
      flex: 1; 
      margin-left: 72px; 
      min-height: 100vh; 
      overflow-x: hidden; 
      max-width: calc(100vw - 72px);
      transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1), max-width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .header {
      background: var(--bg-secondary);
      padding: 16px 32px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1px solid var(--border);
      position: sticky;
      top: 0;
      z-index: 50;
    }
    .header-left h1 { font-size: 24px; font-weight: 700; }
    .header-left p { color: var(--text-muted); }
    .header-actions { display: flex; align-items: center; gap: 12px; }
    .header-search {
      position: relative;
      width: 280px;
    }
    .header-search input {
      width: 100%;
      padding: 10px 16px 10px 42px;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-primary);
      color: var(--text-primary);
      font-size: 14px;
    }
    .header-search i {
      position: absolute;
      left: 14px;
      top: 50%;
      transform: translateY(-50%);
      color: var(--text-muted);
    }
    .header-icon {
      width: 40px;
      height: 40px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--text-secondary);
      cursor: pointer;
      position: relative;
    }
    .header-icon:hover { background: var(--bg-primary); color: var(--accent); }
    .header-icon .notif-dot {
      position: absolute;
      top: 8px;
      right: 8px;
      width: 8px;
      height: 8px;
      background: #E21838;
      border-radius: 50%;
    }
    .btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 10px 20px;
      border-radius: 10px;
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      border: none;
      transition: all 0.2s;
    }
    .btn-primary {
      background: linear-gradient(135deg, #19529E, #19529E);
      color: white;
      box-shadow: 0 4px 12px rgba(59,130,246,0.3);
    }
    .btn-primary:hover { transform: translateY(-1px); }
    .btn-secondary { background: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border); }
    .btn-success { background: var(--success); color: white; }
    .btn-danger { background: var(--danger); color: white; }
    .btn-sm { padding: 8px 14px; font-size: 13px; }

    /* Views */
    .view { display: none; padding: 32px; max-width: 100%; overflow-x: hidden; }
    .view.active { display: block; }

    /* Cards */
    .card {
      background: var(--bg-secondary);
      border-radius: 16px;
      box-shadow: var(--shadow);
      overflow: hidden;
      padding: 20px;
      max-width: 100%;
    }
    .card * {
      max-width: 100%;
    }
    .card-header {
      padding: 20px 24px;
      border-bottom: 1px solid var(--border);
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .card-header h3 { font-size: 16px; font-weight: 700; }
    .card-body { padding: 24px; }

    /* Stats */
    .stats-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 24px;
      margin-bottom: 32px;
    }
    .stat-card {
      background: var(--bg-secondary);
      border-radius: 16px;
      padding: 24px;
      position: relative;
      overflow: hidden;
    }
    .stat-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 4px;
    }
    .stat-card.blue::before { background: linear-gradient(90deg, #19529E, #19529E); }
    .stat-card.green::before { background: linear-gradient(90deg, #07A385, #008DD1); }
    .stat-card.orange::before { background: linear-gradient(90deg, #DCBF1B, #E21838); }
    .stat-card.purple::before { background: linear-gradient(90deg, #5C2A83, #D12D3F); }
    .stat-header { display: flex; justify-content: space-between; margin-bottom: 16px; }
    .stat-icon {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
    }
    .stat-card.blue .stat-icon { background: var(--accent-light); color: var(--accent); }
    .stat-card.green .stat-icon { background: var(--success-light); color: var(--success); }
    .stat-card.orange .stat-icon { background: var(--warning-light); color: var(--warning); }
    .stat-card.purple .stat-icon { background: var(--purple-light); color: var(--purple); }
    .stat-trend {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 12px;
      font-weight: 600;
      padding: 4px 8px;
      border-radius: 6px;
    }
    .stat-trend.up { background: var(--success-light); color: var(--success); }
    .stat-trend.down { background: var(--danger-light); color: var(--danger); }
    .stat-value { font-size: 32px; font-weight: 800; margin-bottom: 4px; }
    .stat-label { color: var(--text-muted); }

    /* Kanban */
    .kanban-board {
      display: flex;
      gap: 20px;
      overflow-x: auto;
      padding-bottom: 20px;
      min-height: calc(100vh - 200px);
    }

    /* ==========================================
       PLANNING TYPE GOOGLE AGENDA
       ========================================== */
    .planning-container {
      display: flex;
      gap: 16px;
      height: calc(100vh - 280px);
      min-height: 600px;
    }
    .planning-modules {
      width: 260px;
      flex-shrink: 0;
      background: var(--bg-secondary);
      border-radius: 16px;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }
    .planning-modules-header {
      padding: 16px;
      background: linear-gradient(135deg, #19529E, #5C2A83);
      color: white;
      font-weight: 600;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .planning-modules-search {
      padding: 12px;
      border-bottom: 1px solid var(--border);
    }
    .planning-modules-search input {
      width: 100%;
      padding: 10px 12px;
      border-radius: 8px;
      border: 1px solid var(--border);
      background: var(--bg-primary);
      color: var(--text-primary);
    }
    .planning-modules-tabs {
      display: flex;
      border-bottom: 1px solid var(--border);
    }
    .planning-module-tab {
      flex: 1;
      padding: 10px 4px;
      text-align: center;
      font-size: 11px;
      cursor: pointer;
      color: var(--text-muted);
      border-bottom: 2px solid transparent;
      transition: all 0.2s;
    }
    .planning-module-tab:hover {
      color: var(--text-primary);
    }
    .planning-module-tab.active {
      color: var(--accent);
      border-bottom-color: var(--accent);
    }
    .planning-modules-list {
      flex: 1;
      overflow-y: auto;
      padding: 12px;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .planning-module-item {
      padding: 10px 12px;
      background: var(--bg-primary);
      border-radius: 8px;
      cursor: grab;
      display: flex;
      align-items: center;
      gap: 10px;
      transition: all 0.2s;
      border: 2px solid transparent;
      font-size: 13px;
    }
    .planning-module-item:hover {
      border-color: var(--accent);
      transform: translateX(4px);
    }
    .planning-module-item.dragging {
      opacity: 0.5;
      cursor: grabbing;
    }

    /* ========== DOSSIER EXPORT STYLES ========== */
    .dossier-block-category {
      margin-bottom: 8px;
    }
    .dossier-category-header {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 10px 12px;
      background: var(--bg-primary);
      border-radius: 8px;
      cursor: pointer;
      font-weight: 600;
      font-size: 13px;
      transition: all 0.2s ease;
    }
    .dossier-category-header:hover {
      background: var(--border);
    }
    .dossier-category-header i {
      font-size: 10px;
      transition: transform 0.2s ease;
    }
    .dossier-category-header.collapsed i {
      transform: rotate(-90deg);
    }
    .dossier-category-blocks {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 8px;
      padding: 8px 0;
    }
    .dossier-category-blocks.hidden {
      display: none;
    }
    .dossier-block-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      padding: 10px 8px;
      background: var(--bg-primary);
      border: 2px solid var(--border);
      border-radius: 8px;
      cursor: grab;
      transition: all 0.2s ease;
      font-size: 11px;
      text-align: center;
    }
    .dossier-block-item:hover {
      border-color: var(--accent);
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }
    .dossier-block-item.dragging {
      opacity: 0.5;
      cursor: grabbing;
    }
    .block-preview {
      width: 50px;
      height: 65px;
      background: white;
      border: 1px solid #ddd;
      border-radius: 4px;
      position: relative;
      overflow: hidden;
    }
    .block-preview.cover {
      background: linear-gradient(135deg, var(--accent), var(--success));
    }
    .block-preview.cover::after {
      content: '';
      position: absolute;
      bottom: 10px;
      left: 50%;
      transform: translateX(-50%);
      width: 30px;
      height: 8px;
      background: white;
      border-radius: 2px;
    }
    .block-preview.cover-simple {
      background: linear-gradient(180deg, var(--accent) 40%, white 40%);
    }
    .block-preview.sommaire::before {
      content: '';
      position: absolute;
      top: 8px;
      left: 8px;
      right: 8px;
      height: 6px;
      background: var(--accent);
      border-radius: 2px;
    }
    .block-preview.sommaire::after {
      content: '';
      position: absolute;
      top: 20px;
      left: 8px;
      right: 8px;
      bottom: 8px;
      background: repeating-linear-gradient(
        180deg,
        #e5e7eb 0px,
        #e5e7eb 4px,
        transparent 4px,
        transparent 8px
      );
    }
    .block-preview.info::before {
      content: '';
      position: absolute;
      top: 8px;
      left: 8px;
      width: 15px;
      height: 15px;
      background: var(--accent);
      border-radius: 50%;
    }
    .block-preview.info::after {
      content: '';
      position: absolute;
      top: 10px;
      left: 28px;
      right: 8px;
      bottom: 8px;
      background: repeating-linear-gradient(
        180deg,
        #e5e7eb 0px,
        #e5e7eb 4px,
        transparent 4px,
        transparent 8px
      );
    }
    .block-preview.text::after {
      content: '';
      position: absolute;
      top: 8px;
      left: 8px;
      right: 8px;
      bottom: 8px;
      background: repeating-linear-gradient(
        180deg,
        #e5e7eb 0px,
        #e5e7eb 4px,
        transparent 4px,
        transparent 8px
      );
    }
    .block-preview.cols-2 {
      display: flex;
      gap: 4px;
      padding: 8px;
    }
    .block-preview.cols-2::before,
    .block-preview.cols-2::after {
      content: '';
      flex: 1;
      background: repeating-linear-gradient(
        180deg,
        #e5e7eb 0px,
        #e5e7eb 4px,
        transparent 4px,
        transparent 8px
      );
      border-radius: 2px;
    }
    .block-preview.image {
      background: linear-gradient(45deg, #e5e7eb 25%, transparent 25%),
                  linear-gradient(-45deg, #e5e7eb 25%, transparent 25%),
                  linear-gradient(45deg, transparent 75%, #e5e7eb 75%),
                  linear-gradient(-45deg, transparent 75%, #e5e7eb 75%);
      background-size: 10px 10px;
      background-position: 0 0, 0 5px, 5px -5px, -5px 0px;
    }
    .block-preview.image::after {
      content: '🖼️';
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: 16px;
    }
    .block-preview.image-text {
      display: flex;
      padding: 4px;
      gap: 4px;
    }
    .block-preview.image-text::before {
      content: '';
      width: 45%;
      background: #e5e7eb;
      border-radius: 2px;
    }
    .block-preview.image-text::after {
      content: '';
      flex: 1;
      background: repeating-linear-gradient(
        180deg,
        #d1d5db 0px,
        #d1d5db 3px,
        transparent 3px,
        transparent 6px
      );
    }
    .block-preview.gallery {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 3px;
      padding: 4px;
    }
    .block-preview.gallery::before,
    .block-preview.gallery::after {
      content: '';
      background: #e5e7eb;
      border-radius: 2px;
    }
    .block-preview.table::before {
      content: '';
      position: absolute;
      top: 8px;
      left: 8px;
      right: 8px;
      height: 8px;
      background: var(--accent);
      border-radius: 2px;
    }
    .block-preview.table::after {
      content: '';
      position: absolute;
      top: 20px;
      left: 8px;
      right: 8px;
      bottom: 8px;
      background: repeating-linear-gradient(
        180deg,
        #e5e7eb 0px,
        #e5e7eb 6px,
        white 6px,
        white 12px
      );
      border: 1px solid #e5e7eb;
    }
    .block-preview.separator {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .block-preview.separator::after {
      content: '';
      width: 80%;
      height: 3px;
      background: linear-gradient(90deg, transparent, var(--accent), transparent);
    }
    
    /* Pages du dossier */
    .dossier-page {
      width: 595px; /* A4 width in pixels at 72dpi */
      min-height: 842px; /* A4 height */
      background: white;
      border-radius: 4px;
      box-shadow: 0 4px 20px rgba(0,0,0,0.15);
      position: relative;
      overflow: hidden;
    }
    .dossier-page-header {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 40px;
      background: rgba(0,0,0,0.03);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 12px;
      opacity: 0;
      transition: opacity 0.2s ease;
      z-index: 10;
    }
    .dossier-page:hover .dossier-page-header {
      opacity: 1;
    }
    .dossier-page-number {
      font-size: 12px;
      font-weight: 600;
      color: var(--text-muted);
    }
    .dossier-page-actions {
      display: flex;
      gap: 4px;
    }
    .dossier-page-actions button {
      width: 28px;
      height: 28px;
      border-radius: 4px;
      border: none;
      background: white;
      color: var(--text-muted);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.2s ease;
    }
    .dossier-page-actions button:hover {
      background: var(--accent);
      color: white;
    }
    .dossier-page-actions button.delete:hover {
      background: var(--danger);
    }
    .dossier-page-content {
      padding: 40px;
      min-height: 762px;
    }
    .dossier-page-content.drop-zone {
      border: 3px dashed var(--accent);
      background: rgba(99, 102, 241, 0.05);
    }
    .dossier-empty-state {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 60px 20px;
      color: var(--text-muted);
      text-align: center;
    }
    
    /* Blocs dans les pages */
    .dossier-block {
      margin-bottom: 20px;
      border: 2px solid transparent;
      border-radius: 4px;
      transition: all 0.2s ease;
      position: relative;
    }
    .dossier-block:hover {
      border-color: var(--accent);
    }
    .dossier-block.selected {
      border-color: var(--accent);
      box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
    }
    .dossier-block-toolbar {
      position: absolute;
      top: -32px;
      right: 0;
      display: none;
      gap: 4px;
      background: var(--bg-secondary);
      padding: 4px;
      border-radius: 4px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    }
    .dossier-block:hover .dossier-block-toolbar,
    .dossier-block.selected .dossier-block-toolbar {
      display: flex;
    }
    .dossier-block-toolbar button {
      width: 24px;
      height: 24px;
      border: none;
      background: transparent;
      color: var(--text-muted);
      cursor: pointer;
      border-radius: 4px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 11px;
    }
    .dossier-block-toolbar button:hover {
      background: var(--accent);
      color: white;
    }

    .planning-module-icon {
      width: 32px;
      height: 32px;
      border-radius: 6px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      font-size: 12px;
      flex-shrink: 0;
    }
    .planning-module-icon.repas { background: linear-gradient(135deg, #DCBF1B, #C99312); }
    .planning-module-icon.activite { background: linear-gradient(135deg, #07A385, #14b8a6); }
    .planning-module-icon.transport { background: linear-gradient(135deg, #19529E, #19529E); }
    .planning-module-icon.animation { background: linear-gradient(135deg, #D12D3F, #f472b6); }
    .planning-module-icon.temps-libre { background: linear-gradient(135deg, #5C2A83, #a855f7); }
    .planning-module-info {
      flex: 1;
      min-width: 0;
    }
    .planning-module-name {
      font-weight: 600;
      font-size: 12px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .planning-module-duration {
      font-size: 10px;
      color: var(--text-muted);
    }
    
    /* Grille du planning style Google Agenda */
    .planning-grid-container {
      flex: 1;
      overflow: auto;
      background: var(--bg-secondary);
      border-radius: 16px;
      position: relative;
    }
    .planning-grid-wrapper {
      display: flex;
      min-width: max-content;
    }
    .planning-time-column {
      width: 60px;
      flex-shrink: 0;
      background: var(--bg-secondary);
      position: sticky;
      left: 0;
      z-index: 10;
    }
    .planning-time-header {
      height: 50px;
      background: var(--bg-secondary);
      position: sticky;
      top: 0;
      z-index: 15;
    }
    .planning-time-slot-label {
      height: 60px;
      padding: 4px 8px;
      font-size: 11px;
      color: var(--text-muted);
      text-align: right;
      border-bottom: 1px solid var(--border);
    }
    .planning-days-container {
      display: flex;
      flex: 1;
    }
    .planning-day-column {
      flex: 1;
      min-width: 150px;
      border-left: 1px solid var(--border);
      position: relative;
    }
    .planning-day-header {
      height: 50px;
      padding: 12px 8px;
      background: linear-gradient(135deg, #0E3550, #334155);
      color: white;
      font-weight: 600;
      text-align: center;
      font-size: 13px;
      position: sticky;
      top: 0;
      z-index: 5;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
    .planning-day-header .day-name {
      font-size: 11px;
      opacity: 0.8;
      text-transform: uppercase;
    }
    .planning-day-header .day-date {
      font-size: 14px;
      font-weight: 700;
    }
    .planning-day-slots {
      position: relative;
      background: var(--bg-primary);
    }
    .planning-hour-slot {
      height: 60px;
      border-bottom: 1px solid var(--border);
      position: relative;
    }
    .planning-hour-slot:hover {
      background: rgba(59, 130, 246, 0.05);
    }
    .planning-hour-slot.drag-over {
      background: rgba(59, 130, 246, 0.15);
    }
    .planning-half-hour {
      position: absolute;
      left: 0;
      right: 0;
      top: 50%;
      border-top: 1px dashed var(--border);
      opacity: 0.5;
    }
    
    /* Items dans le planning (blocs redimensionnables) */
    .planning-event {
      position: absolute;
      left: 4px;
      right: 4px;
      border-radius: 6px;
      padding: 4px 8px;
      cursor: move;
      overflow: hidden;
      font-size: 11px;
      color: white;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
      z-index: 2;
      display: flex;
      flex-direction: column;
      transition: box-shadow 0.2s;
    }
    .planning-event:hover {
      box-shadow: 0 4px 12px rgba(0,0,0,0.3);
      z-index: 3;
    }
    .planning-event.dragging {
      opacity: 0.7;
      z-index: 100;
    }
    .planning-event .event-title {
      font-weight: 600;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .planning-event .event-time {
      font-size: 10px;
      opacity: 0.9;
    }
    .planning-event .event-delete {
      position: absolute;
      top: 2px;
      right: 2px;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: rgba(0,0,0,0.3);
      color: white;
      border: none;
      cursor: pointer;
      display: none;
      align-items: center;
      justify-content: center;
      font-size: 10px;
    }
    .planning-event:hover .event-delete {
      display: flex;
    }
    .planning-event .event-resize-handle {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 10px;
      cursor: ns-resize;
      background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.3));
      border-radius: 0 0 6px 6px;
    }
    .planning-event .event-resize-handle:hover {
      background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.4));
    }
    .planning-event .event-resize-handle::after {
      content: '';
      position: absolute;
      bottom: 3px;
      left: 50%;
      transform: translateX(-50%);
      width: 30px;
      height: 3px;
      background: rgba(255,255,255,0.5);
      border-radius: 2px;
    }
    
    /* Couleurs des événements */
    .planning-event.repas { background: linear-gradient(135deg, #DCBF1B, #C99312); }
    .planning-event.activite { background: linear-gradient(135deg, #07A385, #14b8a6); }
    .planning-event.transport { background: linear-gradient(135deg, #19529E, #19529E); }
    .planning-event.animation { background: linear-gradient(135deg, #D12D3F, #f472b6); }
    .planning-event.temps-libre { background: linear-gradient(135deg, #5C2A83, #a855f7); }

    .kanban-column {
      width: 300px;
      flex-shrink: 0;
      background: var(--bg-primary);
      border-radius: 16px;
      display: flex;
      flex-direction: column;
      max-height: calc(100vh - 200px);
    }
    .kanban-column-header {
      padding: 16px;
      font-weight: 600;
      color: white;
      border-radius: 16px 16px 0 0;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .kanban-column[data-status="respond"] .kanban-column-header { background: linear-gradient(135deg, #19529E, #19529E); }
    .kanban-column[data-status="propose"] .kanban-column-header { background: linear-gradient(135deg, #5C2A83, #a855f7); }
    .kanban-column[data-status="send"] .kanban-column-header { background: linear-gradient(135deg, #DCBF1B, #C99312); }
    .kanban-column[data-status="won"] .kanban-column-header { background: linear-gradient(135deg, #07A385, #14b8a6); }
    .kanban-column[data-status="lost"] .kanban-column-header { background: linear-gradient(135deg, #E21838, #C99312); }
    .kanban-count {
      background: rgba(255,255,255,0.25);
      padding: 4px 12px;
      border-radius: 20px;
      font-size: 13px;
    }
    .kanban-cards {
      flex: 1;
      padding: 12px;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      gap: 12px;
      min-height: 100px;
    }
    .kanban-cards.drag-over { background: rgba(59,130,246,0.1); }
    .kanban-card {
      background: var(--bg-secondary);
      border-radius: 12px;
      padding: 16px;
      cursor: grab;
      border: 1px solid var(--border);
      transition: all 0.2s;
    }
    .kanban-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,0.1); }
    .kanban-card.dragging { opacity: 0.5; cursor: grabbing; }
    .kanban-card-title { font-weight: 600; margin-bottom: 8px; }
    .kanban-card-client { font-size: 13px; color: var(--text-muted); margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
    .kanban-card-footer { display: flex; justify-content: space-between; align-items: center; }
    .kanban-card-date { font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 4px; }
    .kanban-card-amount { font-weight: 700; color: var(--accent); }
    .kanban-card-price-child {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      font-weight: 600;
      color: var(--success);
      background: var(--success-light);
      padding: 6px 10px;
      border-radius: 8px;
      margin: 8px 0;
    }
    .kanban-card-price-child i { font-size: 12px; }
    .kanban-card-marge {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      font-weight: 600;
      padding: 4px 10px;
      border-radius: 6px;
      margin-bottom: 8px;
    }
    .kanban-card-marge.positive {
      background: var(--success-light);
      color: var(--success);
    }
    .kanban-card-marge.negative {
      background: var(--danger-light);
      color: var(--danger);
    }
    .kanban-card-marge i { font-size: 10px; }
    .kanban-card-actions { display: flex; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
    .kanban-card-actions button { flex: 1; }

    /* Charts */
    .charts-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; margin-bottom: 32px; }
    .chart-container { height: 280px; }
    .funnel-stage { display: flex; align-items: center; margin-bottom: 12px; }
    .funnel-bar {
      height: 40px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      padding: 0 16px;
      color: white;
      font-weight: 600;
      font-size: 13px;
      cursor: pointer;
      transition: transform 0.2s;
    }
    .funnel-bar:hover { transform: translateX(4px); }
    .funnel-stage:nth-child(1) .funnel-bar { background: linear-gradient(90deg, #19529E, #19529E); width: 100%; }
    .funnel-stage:nth-child(2) .funnel-bar { background: linear-gradient(90deg, #5C2A83, #a855f7); width: 75%; }
    .funnel-stage:nth-child(3) .funnel-bar { background: linear-gradient(90deg, #DCBF1B, #C99312); width: 50%; }
    .funnel-stage:nth-child(4) .funnel-bar { background: linear-gradient(90deg, #07A385, #14b8a6); width: 35%; }
    .funnel-stage:nth-child(5) .funnel-bar { background: linear-gradient(90deg, #008DD1, #008DD1); width: 25%; }
    .funnel-value { margin-left: 16px; font-weight: 700; }
    .funnel-count { color: var(--text-muted); font-size: 12px; }

    /* Bottom grid */
    .bottom-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
    .ao-item {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 16px;
      background: var(--bg-primary);
      border-radius: 12px;
      margin-bottom: 12px;
      cursor: pointer;
      transition: all 0.2s;
    }
    .ao-item:hover { transform: translateX(4px); }
    .ao-status { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; }
    .ao-status.respond { background: #19529E; }
    .ao-status.propose { background: #5C2A83; }
    .ao-status.send { background: #DCBF1B; }
    .ao-status.won { background: #07A385; }
    .ao-status.lost { background: #E21838; }
    .ao-info { flex: 1; min-width: 0; }
    .ao-title { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .ao-meta { font-size: 12px; color: var(--text-muted); }
    .ao-amount { font-weight: 700; color: var(--accent); }

    .event-item {
      display: flex;
      gap: 16px;
      padding: 16px;
      background: var(--bg-primary);
      border-radius: 12px;
      margin-bottom: 12px;
      border-left: 4px solid;
    }
    .event-item.urgent { border-left-color: #E21838; }
    .event-item.warning { border-left-color: #DCBF1B; }
    .event-item.normal { border-left-color: #19529E; }
    .event-day { font-size: 24px; font-weight: 800; }
    .event-month { font-size: 11px; color: var(--text-muted); text-transform: uppercase; }
    .event-title { font-weight: 600; margin-bottom: 4px; }
    .event-desc { font-size: 12px; color: var(--text-muted); }

    .activity-item {
      display: flex;
      gap: 12px;
      padding: 12px 0;
      border-bottom: 1px solid var(--border);
    }
    .activity-item:last-child { border-bottom: none; }
    .activity-icon {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    .activity-icon.success { background: var(--success-light); color: var(--success); }
    .activity-icon.info { background: var(--accent-light); color: var(--accent); }
    .activity-icon.warning { background: var(--warning-light); color: var(--warning); }
    .activity-icon.danger { background: var(--danger-light); color: var(--danger); }
    .activity-text strong { font-weight: 600; }
    .activity-time { font-size: 11px; color: var(--text-muted); margin-top: 4px; }

    .perf-card {
      background: var(--bg-primary);
      border-radius: 12px;
      padding: 20px;
    }
    .perf-header { display: flex; justify-content: space-between; margin-bottom: 12px; }
    .perf-label { font-size: 13px; color: var(--text-secondary); }
    .perf-value { font-size: 24px; font-weight: 800; }
    .perf-bar { height: 8px; background: var(--border); border-radius: 4px; overflow: hidden; }
    .perf-fill { height: 100%; border-radius: 4px; transition: width 0.5s; }
    .perf-fill.blue { background: linear-gradient(90deg, #19529E, #19529E); }
    .perf-fill.green { background: linear-gradient(90deg, #07A385, #008DD1); }

    /* AO List */
    .ao-table { width: 100%; border-collapse: collapse; }
    .ao-table th, .ao-table td { padding: 16px; text-align: left; border-bottom: 1px solid var(--border); }
    .ao-table th { font-weight: 600; color: var(--text-muted); font-size: 12px; text-transform: uppercase; background: var(--bg-primary); }
    .ao-table tr:hover { background: var(--bg-primary); }
    .ao-table .link { color: var(--accent); cursor: pointer; }
    .price-per-child-cell { white-space: nowrap; }
    .price-per-child-cell small { display: block; font-size: 11px; color: var(--text-muted); margin-top: 2px; }
    .price-child-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      background: var(--success-light);
      color: var(--success);
      padding: 4px 8px;
      border-radius: 6px;
      font-weight: 600;
      font-size: 13px;
    }
    .price-child-badge i { font-size: 11px; }
    .type-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 600;
      white-space: nowrap;
    }
    .type-badge i { font-size: 11px; }
    .marge-badge {
      display: inline-flex;
      align-items: center;
      padding: 4px 10px;
      border-radius: 6px;
      font-size: 13px;
      font-weight: 700;
    }
    .marge-badge.positive {
      background: var(--success-light);
      color: var(--success);
    }
    .marge-badge.negative {
      background: var(--danger-light);
      color: var(--danger);
    }
    .status-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 4px 12px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 600;
    }
    .status-badge.respond { background: #D3E2F2; color: #19529E; }
    .status-badge.propose { background: #EFE6F5; color: #5C2A83; }
    .status-badge.send { background: #FAF3D2; color: #DCBF1B; }
    .status-badge.won { background: #D0EFE8; color: #07A385; }
    .status-badge.lost { background: #FBD9DE; color: #E21838; }

    /* AI Analysis */
    .ai-box {
      background: linear-gradient(135deg, #667eea, #764ba2);
      border-radius: 16px;
      padding: 24px;
      color: white;
      margin-bottom: 24px;
    }
    .ai-box-title { font-size: 18px; font-weight: 700; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
    .ai-box-content {
      background: rgba(255,255,255,0.15);
      border-radius: 12px;
      padding: 20px;
      min-height: 150px;
    }
    .ai-box-content.loading {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .ai-box-content.loading::after {
      content: '';
      width: 32px;
      height: 32px;
      border: 3px solid rgba(255,255,255,0.3);
      border-top-color: white;
      border-radius: 50%;
      animation: spin 0.8s linear infinite;
    }
    @keyframes spin { to { transform: rotate(360deg); } }
    .match-item {
      background: var(--bg-primary);
      border-radius: 12px;
      padding: 16px;
      margin-bottom: 12px;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .match-score {
      background: var(--success);
      color: white;
      padding: 4px 12px;
      border-radius: 20px;
      font-weight: 600;
    }

    /* Pricing */
    .pricing-tabs { display: flex; gap: 8px; margin-bottom: 24px; flex-wrap: wrap; }
    .pricing-tab {
      padding: 10px 20px;
      border: 1px solid var(--border);
      background: var(--bg-primary);
      border-radius: 10px;
      cursor: pointer;
      font-weight: 500;
      transition: all 0.2s;
    }
    .pricing-tab:hover { border-color: var(--accent); }
    .pricing-tab.active { background: var(--accent); color: white; border-color: var(--accent); }
    .pricing-content { display: none; }
    .pricing-content.active { display: block; }
    .pricing-table { width: 100%; border-collapse: collapse; }
    .pricing-table th, .pricing-table td { padding: 12px; text-align: left; border-bottom: 1px solid var(--border); }
    .pricing-table th { background: var(--bg-primary); font-weight: 600; font-size: 12px; text-transform: uppercase; color: var(--text-muted); }
    .pricing-table input {
      width: 100%;
      padding: 10px;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--bg-secondary);
      color: var(--text-primary);
      font-size: 14px;
    }
    .pricing-table input:focus { outline: none; border-color: var(--accent); }
    .grand-total {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 24px;
      background: linear-gradient(135deg, #19529E, #008DD1);
      border-radius: 16px;
      color: white;
      margin-top: 24px;
    }
    .grand-total-label { font-size: 18px; font-weight: 600; }
    .grand-total-value { font-size: 32px; font-weight: 800; }

    /* Accommodation */
    .photo-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
      gap: 16px;
      margin-top: 16px;
    }
    .photo-item {
      aspect-ratio: 4/3;
      border-radius: 12px;
      overflow: hidden;
      position: relative;
      background: var(--bg-primary);
      border: 2px dashed var(--border);
      cursor: pointer;
    }
    .photo-item.has-image { border-style: solid; }
    .photo-item img { width: 100%; height: 100%; object-fit: cover; }
    .photo-item .remove-btn {
      position: absolute;
      top: 8px;
      right: 8px;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      background: rgba(0,0,0,0.6);
      color: white;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transition: opacity 0.2s;
      border: none;
      cursor: pointer;
    }
    .photo-item:hover .remove-btn { opacity: 1; }
    .photo-upload {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 100%;
      color: var(--text-muted);
    }
    .photo-upload:hover { color: var(--accent); background: var(--accent-light); }
    .photo-upload i { font-size: 28px; margin-bottom: 8px; }
    .accommodation-list { margin-top: 24px; }
    .accommodation-item {
      display: flex;
      gap: 16px;
      padding: 16px;
      background: var(--bg-primary);
      border-radius: 12px;
      margin-bottom: 12px;
      align-items: center;
    }
    .accommodation-item img { width: 100px; height: 75px; object-fit: cover; border-radius: 8px; }
    .accommodation-info { flex: 1; }
    .accommodation-name { font-weight: 600; margin-bottom: 4px; }
    .accommodation-meta { font-size: 13px; color: var(--text-muted); }

    /* Memo */
    .memo-editor {
      border: 1px solid var(--border);
      border-radius: 12px;
      overflow: hidden;
    }
    .memo-toolbar {
      display: flex;
      gap: 6px;
      padding: 12px;
      background: var(--bg-primary);
      border-bottom: 1px solid var(--border);
      flex-wrap: wrap;
    }
    .memo-toolbar button {
      padding: 8px 14px;
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      border-radius: 8px;
      cursor: pointer;
      color: var(--text-primary);
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      transition: all 0.2s;
    }
    .memo-toolbar button:hover { background: var(--accent); color: white; border-color: var(--accent); }
    .memo-content {
      min-height: 400px;
      padding: 24px;
      background: var(--bg-secondary);
    }
    .memo-content:focus { outline: none; }

    /* Loss Analysis */
    .loss-table { width: 100%; border-collapse: collapse; }
    .loss-table th, .loss-table td { padding: 14px; text-align: left; border-bottom: 1px solid var(--border); }
    .loss-table th { background: var(--bg-primary); font-weight: 600; font-size: 12px; text-transform: uppercase; color: var(--text-muted); }
    .priority-badge {
      padding: 4px 12px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 600;
    }
    .priority-badge.high { background: #FBD9DE; color: #E21838; }
    .priority-badge.medium { background: #FAF3D2; color: #DCBF1B; }
    .priority-badge.low { background: #D0EFE8; color: #07A385; }
    .improvement-report {
      background: var(--bg-primary);
      border-radius: 12px;
      padding: 24px;
      margin-top: 24px;
      min-height: 200px;
    }
    .improvement-report h1, .improvement-report h2, .improvement-report h3 { margin: 1em 0 0.5em; }
    .improvement-report p { margin: 0.5em 0; }
    .improvement-report ul, .improvement-report ol { margin: 0.5em 0; padding-left: 1.5em; }

    /* Export */
    .export-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
    .export-card {
      background: var(--bg-secondary);
      border-radius: 16px;
      padding: 24px;
      text-align: center;
      border: 2px solid var(--border);
      cursor: pointer;
      transition: all 0.2s;
    }
    .export-card:hover { border-color: var(--accent); transform: translateY(-4px); }
    .export-icon {
      width: 64px;
      height: 64px;
      border-radius: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      margin: 0 auto 16px;
    }
    .export-icon.csv { background: #D0EFE8; color: #07A385; }
    .export-icon.pdf { background: #FBD9DE; color: #E21838; }
    .export-icon.json { background: #FAF3D2; color: #DCBF1B; }
    .export-icon.html { background: #D3E2F2; color: #19529E; }
    .export-title { font-weight: 700; font-size: 16px; margin-bottom: 8px; }
    .export-desc { font-size: 13px; color: var(--text-muted); }

    /* Forms */
    .form-group { margin-bottom: 20px; }
    .form-label { display: block; font-weight: 600; margin-bottom: 8px; color: var(--text-secondary); font-size: 13px; }
    .form-control {
      width: 100%;
      padding: 12px 16px;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-primary);
      color: var(--text-primary);
      font-size: 14px;
    }
    .form-control:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(59,130,246,0.1); }
    textarea.form-control { min-height: 100px; resize: vertical; }
    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .form-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }

    /* Modal */
    .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.5);
      display: none;
      align-items: center;
      justify-content: center;
      z-index: 1000;
      padding: 20px;
      backdrop-filter: blur(4px);
    }
    .modal-overlay.active { display: flex; }
    .modal {
      background: var(--bg-secondary);
      border-radius: 16px;
      width: 100%;
      max-width: 600px;
      max-height: 90vh;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      animation: modalIn 0.2s ease;
    }
    @keyframes modalIn { from { opacity: 0; transform: scale(0.95) translateY(-10px); } }
    .modal-header {
      padding: 20px 24px;
      border-bottom: 1px solid var(--border);
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .modal-header h3 { font-size: 18px; font-weight: 700; }
    .modal-close {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--text-muted);
      cursor: pointer;
      background: none;
      border: none;
      font-size: 20px;
    }
    .modal-close:hover { background: var(--bg-primary); }
    .modal-body { padding: 24px; overflow-y: auto; }
    .modal-footer {
      padding: 16px 24px;
      border-top: 1px solid var(--border);
      display: flex;
      justify-content: flex-end;
      gap: 12px;
    }

    /* Dropzone */
    .dropzone {
      border: 2px dashed var(--border);
      border-radius: 12px;
      padding: 40px 20px;
      text-align: center;
      cursor: pointer;
      transition: all 0.2s;
      background: var(--bg-secondary);
    }
    .dropzone:hover { border-color: var(--accent); background: var(--accent-light); }
    .dropzone.dragover { border-color: var(--success); background: var(--success-light); }
    .dropzone i { font-size: 48px; color: var(--text-muted); display: block; margin-bottom: 12px; }
    .dropzone span { color: var(--text-muted); font-size: 14px; }

    /* Documents List */
    .documents-list { margin-top: 16px; }
    .document-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 16px;
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      border-radius: 10px;
      margin-bottom: 8px;
    }
    .document-item:hover { border-color: var(--accent); }
    .document-icon {
      width: 40px;
      height: 40px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      flex-shrink: 0;
    }
    .document-icon.pdf { background: #FBD9DE; color: #E21838; }
    .document-icon.doc { background: #D3E2F2; color: #19529E; }
    .document-icon.xls { background: #D0EFE8; color: #07A385; }
    .document-icon.img { background: #FAF3D2; color: #DCBF1B; }
    .document-icon.default { background: var(--bg-primary); color: var(--text-muted); }
    .document-info { flex: 1; min-width: 0; }
    .document-name { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .document-size { font-size: 12px; color: var(--text-muted); }
    .document-remove {
      width: 32px;
      height: 32px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      color: var(--text-muted);
      background: none;
      border: none;
      transition: all 0.2s;
    }
    .document-remove:hover { background: var(--danger-light); color: var(--danger); }

    /* Checklist */
    .checklist-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
      gap: 12px;
    }
    .checklist-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px 16px;
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      border-radius: 10px;
      cursor: pointer;
      transition: all 0.2s;
    }
    .checklist-item:hover { border-color: var(--accent); }
    .checklist-item.checked { border-color: var(--success); background: var(--success-light); }
    .checklist-item.required { border-left: 3px solid var(--danger); }
    .checklist-checkbox {
      width: 22px;
      height: 22px;
      border: 2px solid var(--border);
      border-radius: 6px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: all 0.2s;
    }
    .checklist-item.checked .checklist-checkbox {
      background: var(--success);
      border-color: var(--success);
      color: white;
    }
    .checklist-label { flex: 1; font-size: 14px; }
    .checklist-label small { display: block; font-size: 11px; color: var(--text-muted); margin-top: 2px; }
    .checklist-remove {
      width: 24px;
      height: 24px;
      border-radius: 6px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      color: var(--text-muted);
      background: none;
      border: none;
      opacity: 0;
      transition: all 0.2s;
    }
    .checklist-item:hover .checklist-remove { opacity: 1; }
    .checklist-remove:hover { background: var(--danger-light); color: var(--danger); }

    /* Clients Grid */
    .clients-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
      gap: 20px;
    }
    .client-card {
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      border-radius: 16px;
      padding: 20px;
      transition: all 0.2s;
      position: relative;
    }
    .client-card:hover { border-color: var(--accent); box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
    .client-card-header {
      display: flex;
      gap: 16px;
      align-items: flex-start;
      margin-bottom: 16px;
    }
    .client-avatar {
      width: 56px;
      height: 56px;
      border-radius: 14px;
      background: linear-gradient(135deg, var(--accent), var(--purple));
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      font-weight: 700;
      color: white;
      flex-shrink: 0;
    }
    .client-info { flex: 1; min-width: 0; }
    .client-name { font-size: 17px; font-weight: 700; margin-bottom: 4px; }
    .client-type { font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 6px; }
    .client-type i { color: var(--accent); }
    .client-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      margin: 16px 0;
      padding: 16px 0;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
    }
    .client-stat { text-align: center; }
    .client-stat-value { font-size: 20px; font-weight: 800; color: var(--accent); }
    .client-stat-label { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
    .client-contact {
      font-size: 13px;
      color: var(--text-secondary);
    }
    .client-contact div { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
    .client-contact i { width: 16px; color: var(--text-muted); }
    .client-contact a { color: var(--accent); text-decoration: none; }
    .client-contact a:hover { text-decoration: underline; }
    .client-actions {
      position: absolute;
      top: 16px;
      right: 16px;
      display: flex;
      gap: 8px;
      opacity: 0;
      transition: opacity 0.2s;
    }
    .client-card:hover .client-actions { opacity: 1; }
    .client-badge {
      display: inline-block;
      padding: 4px 10px;
      border-radius: 6px;
      font-size: 11px;
      font-weight: 600;
      margin-top: 12px;
    }
    .client-badge.collectivite { background: #D3E2F2; color: #19529E; }
    .client-badge.entreprise { background: #D0EFE8; color: #06806A; }
    .client-badge.association { background: #FAF3D2; color: #B89A16; }
    .client-badge.education { background: #EFE6F5; color: #4A2069; }

    /* Accommodations Grid */
    .accommodations-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
      gap: 20px;
    }
    .accommodation-card {
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      border-radius: 16px;
      padding: 20px;
      transition: all 0.2s;
      position: relative;
      overflow: hidden;
    }
    .accommodation-card:hover {
      border-color: var(--accent);
      box-shadow: 0 8px 24px rgba(0,0,0,0.08);
      transform: translateY(-2px);
    }
    .accommodation-card-header {
      display: flex;
      gap: 16px;
      align-items: flex-start;
      margin-bottom: 16px;
    }
    .accommodation-avatar {
      width: 56px;
      height: 56px;
      border-radius: 14px;
      background: linear-gradient(135deg, var(--warning), #DCBF1B);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      color: white;
      flex-shrink: 0;
    }
    .accommodation-info { flex: 1; min-width: 0; }
    .accommodation-name {
      font-size: 17px;
      font-weight: 700;
      margin-bottom: 4px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .accommodation-location {
      font-size: 12px;
      color: var(--text-muted);
      display: flex;
      align-items: center;
      gap: 6px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .accommodation-location i { color: var(--danger); }
    .accommodation-stars {
      color: #DCBF1B;
      font-size: 12px;
      margin-top: 4px;
    }
    .accommodation-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      margin: 16px 0;
      padding: 16px 0;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
    }
    .accommodation-stat { text-align: center; }
    .accommodation-stat-value { font-size: 18px; font-weight: 800; color: var(--warning); }
    .accommodation-stat-label { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
    .accommodation-details {
      font-size: 13px;
      color: var(--text-secondary);
    }
    .accommodation-details div {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 6px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .accommodation-details i { width: 16px; color: var(--text-muted); flex-shrink: 0; }
    .accommodation-actions {
      position: absolute;
      top: 16px;
      right: 16px;
      display: flex;
      gap: 8px;
      opacity: 0;
      transition: opacity 0.2s;
    }
    .accommodation-card:hover .accommodation-actions { opacity: 1; }
    .accommodation-badge {
      display: inline-block;
      padding: 4px 10px;
      border-radius: 6px;
      font-size: 11px;
      font-weight: 600;
      margin-top: 12px;
    }
    .accommodation-badge.hotel { background: #FAF3D2; color: #B89A16; }
    .accommodation-badge.residence { background: #D3E2F2; color: #19529E; }
    .accommodation-badge.camping { background: #D0EFE8; color: #06806A; }
    .accommodation-badge.gite { background: #EFE6F5; color: #4A2069; }
    .accommodation-badge.auberge { background: #FBE2E6; color: #BB142E; }
    .accommodation-used-badge {
      position: absolute;
      top: 16px;
      left: 16px;
      background: var(--success);
      color: white;
      font-size: 10px;
      font-weight: 600;
      padding: 4px 8px;
      border-radius: 4px;
    }

    /* Amenity Checkboxes */
    .amenity-checkbox {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 8px 12px;
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      border-radius: 8px;
      cursor: pointer;
      font-size: 13px;
      transition: all 0.2s;
    }
    .amenity-checkbox:hover {
      border-color: var(--accent);
    }
    .amenity-checkbox:has(input:checked) {
      background: var(--accent);
      border-color: var(--accent);
      color: white;
    }
    .amenity-checkbox:has(input:checked) i {
      color: white;
    }
    .amenity-checkbox input {
      display: none;
    }
    .amenity-checkbox i {
      color: var(--text-muted);
      font-size: 12px;
    }

    /* Amenity Filter Chips */
    .amenity-filter-chip {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 6px 10px;
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      border-radius: 20px;
      cursor: pointer;
      font-size: 12px;
      transition: all 0.2s;
    }
    .amenity-filter-chip:hover {
      border-color: var(--accent);
    }
    .amenity-filter-chip:has(input:checked) {
      background: var(--accent);
      border-color: var(--accent);
      color: white;
    }
    .amenity-filter-chip:has(input:checked) i {
      color: white;
    }
    .amenity-filter-chip input {
      display: none;
    }
    .amenity-filter-chip i {
      color: var(--text-muted);
      font-size: 11px;
    }

    /* Activity Catalog Cards */
    .activity-catalog-card {
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      border-radius: 16px;
      overflow: hidden;
      transition: all 0.2s;
    }
    .activity-catalog-card:hover {
      border-color: var(--accent);
      box-shadow: 0 8px 24px rgba(0,0,0,0.1);
      transform: translateY(-4px);
    }
    .activity-catalog-image {
      height: 160px;
      position: relative;
      overflow: hidden;
    }
    .activity-catalog-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .activity-catalog-badge {
      position: absolute;
      top: 12px;
      left: 12px;
      padding: 6px 12px;
      border-radius: 8px;
      font-size: 11px;
      font-weight: 700;
      color: white;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }
    .activity-catalog-content {
      padding: 16px;
    }
    .activity-catalog-content h4 {
      font-size: 16px;
      font-weight: 700;
      margin-bottom: 8px;
    }
    .activity-catalog-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      font-size: 12px;
      color: var(--text-muted);
      margin-bottom: 12px;
    }
    .activity-catalog-meta span {
      display: flex;
      align-items: center;
      gap: 4px;
    }
    .activity-catalog-meta i {
      color: var(--accent);
    }
    .activity-catalog-desc {
      font-size: 13px;
      color: var(--text-secondary);
      line-height: 1.5;
      margin-bottom: 16px;
    }
    .activity-catalog-footer {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding-top: 12px;
      border-top: 1px solid var(--border);
    }
    .activity-catalog-price {
      font-size: 18px;
      font-weight: 800;
      color: var(--success);
    }
    .activity-catalog-actions {
      display: flex;
      gap: 6px;
    }

    /* AO Selector Banner */
    .ao-selector-banner {
      background: linear-gradient(135deg, var(--accent), var(--purple));
      border-radius: 16px;
      padding: 20px 24px;
      margin-bottom: 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      flex-wrap: wrap;
    }
    .ao-selector-banner .banner-left {
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .ao-selector-banner .banner-icon {
      width: 48px;
      height: 48px;
      background: rgba(255,255,255,0.2);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      color: white;
    }
    .ao-selector-banner .banner-text {
      color: white;
    }
    .ao-selector-banner .banner-text h4 {
      font-size: 14px;
      font-weight: 500;
      opacity: 0.9;
      margin-bottom: 4px;
    }
    .ao-selector-banner .banner-text p {
      font-size: 11px;
      opacity: 0.7;
    }
    .ao-selector-banner select {
      min-width: 300px;
      padding: 12px 16px;
      border-radius: 10px;
      border: 2px solid rgba(255,255,255,0.3);
      background: rgba(255,255,255,0.95);
      font-size: 14px;
      font-weight: 600;
      color: var(--text-primary);
      cursor: pointer;
    }
    .ao-selector-banner select:focus {
      outline: none;
      border-color: white;
    }
    .ao-selector-banner .no-ao-message {
      color: rgba(255,255,255,0.9);
      font-size: 14px;
    }
    .ao-selector-banner .no-ao-message a {
      color: white;
      text-decoration: underline;
      cursor: pointer;
    }
    .ao-selector-banner .banner-actions {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .btn-save {
      background: white;
      color: var(--accent);
      border: none;
      padding: 12px 20px;
      border-radius: 10px;
      font-weight: 600;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 8px;
      transition: all 0.2s;
      font-size: 14px;
    }
    .btn-save:hover {
      background: #f0f0f0;
      transform: scale(1.02);
    }
    .btn-save.saved {
      background: var(--success);
      color: white;
    }
    .ao-selector-banner select:disabled {
      opacity: 0.6;
      cursor: not-allowed;
      background: rgba(255,255,255,0.7);
    }
    .ao-selector-banner.locked select {
      display: none;
    }
    .ao-selector-banner .ao-locked-name {
      display: none;
      background: rgba(255,255,255,0.95);
      padding: 12px 20px;
      border-radius: 10px;
      font-size: 14px;
      font-weight: 700;
      color: var(--text-primary);
      border: 2px solid rgba(255,255,255,0.3);
    }
    .ao-selector-banner .ao-locked-name i {
      margin-right: 8px;
      color: var(--success);
    }
    .ao-selector-banner.locked .ao-locked-name {
      display: flex;
      align-items: center;
    }

    /* Tool navigation bar */
    .tool-nav-bar {
      display: flex;
      gap: 8px;
      margin-bottom: 24px;
      padding: 8px;
      background: var(--bg-secondary);
      border-radius: 12px;
      border: 1px solid var(--border);
      flex-wrap: wrap;
    }
    .tool-nav-btn {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 12px 20px;
      background: transparent;
      border: none;
      border-radius: 8px;
      color: var(--text-secondary);
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.2s;
    }
    .tool-nav-btn:hover {
      background: var(--bg-primary);
      color: var(--text-primary);
    }
    .tool-nav-btn.active {
      background: var(--accent);
      color: white;
    }
    .tool-nav-btn i {
      font-size: 16px;
    }

    /* Tool buttons in AO modal */
    .btn-tool {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 16px;
      background: var(--bg-primary);
      border: 2px solid var(--border);
      border-radius: 12px;
      color: var(--text-primary);
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.2s;
    }
    .btn-tool i {
      font-size: 24px;
      color: var(--accent);
    }
    .btn-tool:hover {
      border-color: var(--accent);
      background: var(--accent-light);
      transform: translateY(-2px);
    }
    .dark .btn-tool:hover {
      background: rgba(99, 102, 241, 0.15);
    }

    /* Disabled nav items */
    .nav-item.disabled {
      opacity: 0.5;
      pointer-events: none;
    }
    .nav-item.needs-ao {
      position: relative;
    }
    .nav-item.needs-ao::after {
      content: "Sélectionnez un AO";
      position: absolute;
      left: 100%;
      top: 50%;
      transform: translateY(-50%);
      background: var(--danger);
      color: white;
      padding: 4px 8px;
      border-radius: 4px;
      font-size: 10px;
      white-space: nowrap;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.2s;
      margin-left: 8px;
    }
    .nav-item.needs-ao:hover::after {
      opacity: 1;
    }
    .nav-item.needs-ao.ao-active::after {
      display: none;
    }

    /* AO Working Banner */
    .ao-working-banner {
      background: linear-gradient(135deg, #092E43 0%, #0E3550 100%);
      border-bottom: 2px solid var(--accent);
      padding: 12px 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
      flex-wrap: wrap;
    }
    .ao-working-info {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .ao-working-icon {
      width: 44px;
      height: 44px;
      background: linear-gradient(135deg, #19529E, #19529E);
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      font-size: 18px;
    }
    .ao-working-details {
      display: flex;
      flex-direction: column;
    }
    .ao-working-label {
      font-size: 11px;
      color: #94a3b8;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      font-weight: 600;
    }
    .ao-working-title {
      color: white;
      font-weight: 700;
      font-size: 16px;
    }
    .ao-working-tabs {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
    }
    .ao-tab {
      padding: 10px 16px;
      background: rgba(255, 255, 255, 0.08);
      border: 1px solid rgba(255, 255, 255, 0.15);
      border-radius: 8px;
      color: #94a3b8;
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
      transition: all 0.2s;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .ao-tab:hover {
      background: rgba(255, 255, 255, 0.12);
      color: white;
      border-color: rgba(255, 255, 255, 0.25);
    }
    .ao-tab.active {
      background: linear-gradient(135deg, #19529E, #19529E);
      color: white;
      border-color: transparent;
      box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
    }
    .ao-tab i {
      font-size: 14px;
    }
    .ao-working-actions {
      display: flex;
      gap: 10px;
    }
    .btn-save-all {
      background: linear-gradient(135deg, #07A385, #14b8a6);
      color: white;
      padding: 10px 20px;
      border: none;
      border-radius: 8px;
      font-weight: 600;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 8px;
      transition: all 0.2s;
      box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
    }
    .btn-save-all:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 16px rgba(16, 185, 129, 0.4);
    }
    .btn-back {
      background: rgba(255, 255, 255, 0.1);
      color: white;
      padding: 10px 20px;
      border: 1px solid rgba(255, 255, 255, 0.2);
      border-radius: 8px;
      font-weight: 600;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 8px;
      transition: all 0.2s;
    }
    .btn-back:hover {
      background: rgba(255, 255, 255, 0.15);
      border-color: rgba(255, 255, 255, 0.3);
    }
    @media (max-width: 1200px) {
      .ao-working-banner {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
      }
      .ao-working-tabs {
        justify-content: center;
      }
      .ao-working-actions {
        justify-content: center;
      }
    }
    @media (max-width: 600px) {
      .ao-working-banner {
        padding: 12px 16px;
      }
      .ao-tab {
        padding: 8px 12px;
        font-size: 12px;
      }
      .ao-tab span {
        display: none;
      }
    }

    /* Responsive */
    @media (max-width: 1400px) { .stats-grid, .bottom-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 1100px) { .charts-grid { grid-template-columns: 1fr; } }
    @media (max-width: 900px) {
      .sidebar { width: 72px; }
      .sidebar:hover { width: 72px; }
      .sidebar-brand, .nav-section-title, .nav-item span, .user-info, .nav-item .badge { display: none !important; opacity: 0 !important; }
      .sidebar:hover .sidebar-brand, .sidebar:hover .nav-section-title, .sidebar:hover .nav-item span, .sidebar:hover .user-info { display: none !important; opacity: 0 !important; }
      .nav-item { justify-content: center; padding: 12px; }
      .nav-item::after { display: block; }
      .main-content { margin-left: 72px; max-width: calc(100vw - 72px); }
      .kanban-column { width: 260px; }
      .form-row, .form-row-3 { grid-template-columns: 1fr; }
    }
    @media (max-width: 600px) {
      .sidebar { display: none; }
      .main-content { margin-left: 0; max-width: 100vw; }
      .stats-grid, .bottom-grid { grid-template-columns: 1fr; }
      .view { padding: 16px; }
      .header { padding: 16px; flex-wrap: wrap; gap: 12px; }
      .header-search { display: none; }
    }

    /* ==========================================
       PAGE DE CONNEXION
       ========================================== */
    .login-overlay {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(135deg, #092E43 0%, #0E3550 50%, #092E43 100%);
      z-index: 10000;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .login-overlay.hidden { display: none; }
    .login-container {
      background: white;
      border-radius: 24px;
      padding: 48px;
      width: 100%;
      max-width: 420px;
      box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
    }
    .login-logo {
      width: 80px;
      height: 80px;
      background: linear-gradient(135deg, #19529E, #5C2A83);
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 24px;
      font-size: 32px;
      font-weight: 800;
      color: white;
    }
    .login-title {
      text-align: center;
      font-size: 24px;
      font-weight: 700;
      color: #092E43;
      margin-bottom: 8px;
    }
    .login-subtitle {
      text-align: center;
      color: #64748b;
      margin-bottom: 32px;
    }
    .login-form .form-group {
      margin-bottom: 20px;
    }
    .login-form label {
      display: block;
      font-weight: 600;
      color: #334155;
      margin-bottom: 8px;
    }
    .login-form input {
      width: 100%;
      padding: 14px 16px;
      border: 2px solid #e2e8f0;
      border-radius: 12px;
      font-size: 15px;
      transition: all 0.2s;
    }
    .login-form input:focus {
      outline: none;
      border-color: #19529E;
      box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.1);
    }
    .login-btn {
      width: 100%;
      padding: 16px;
      background: linear-gradient(135deg, #19529E, #5C2A83);
      color: white;
      border: none;
      border-radius: 12px;
      font-size: 16px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.2s;
    }
    .login-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 20px rgba(59, 130, 246, 0.3);
    }
    .login-btn:disabled {
      opacity: 0.6;
      cursor: not-allowed;
      transform: none;
    }
    .login-error {
      background: #FBD9DE;
      color: #8A1020;
      padding: 12px 16px;
      border-radius: 8px;
      margin-bottom: 20px;
      font-size: 14px;
      display: none;
    }
    .login-error.show { display: block; }
    
    /* User info dans header */
    .user-info {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 8px 16px;
      background: var(--bg-secondary);
      border-radius: 12px;
      border: 1px solid var(--border);
    }
    .user-avatar {
      width: 36px;
      height: 36px;
      background: linear-gradient(135deg, #19529E, #5C2A83);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      font-weight: 600;
      font-size: 14px;
    }
    .user-name {
      font-weight: 600;
      color: var(--text-primary);
    }
    .user-role {
      font-size: 12px;
      color: var(--text-muted);
    }
    .logout-btn {
      padding: 8px 12px;
      background: var(--danger-light);
      color: var(--danger);
      border: none;
      border-radius: 8px;
      cursor: pointer;
      font-size: 13px;
      font-weight: 500;
    }
    .logout-btn:hover {
      background: var(--danger);
      color: white;
    }
    
    /* ============================================
       STYLES CATALOGUE SÉJOURS
       ============================================ */
    .grad-nature { background: linear-gradient(135deg, #4FBDA6, #0d9488); }
    .grad-aquatic { background: linear-gradient(135deg, #5B86C2, #008DD1); }
    .grad-mountain { background: linear-gradient(135deg, #7dd3fc, #19529E); }
    .grad-culture { background: linear-gradient(135deg, #8A63AE, #123E78); }
    .grad-sport { background: linear-gradient(135deg, #fb923c, #E21838); }
    .grad-art { background: linear-gradient(135deg, #f472b6, #e11d48); }
    .grad-default { background: linear-gradient(135deg, #9ca3af, #4b5563); }
    .card-hover { transition: all 0.25s ease; }
    .card-hover:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,0.12); }
    .fade-in { animation: fadeIn 0.3s ease; }
    @keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
    .toast-in { animation: toastIn 0.4s ease; }
    @keyframes toastIn { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
    .tab-btn { padding: 10px 16px; font-size: 13px; font-weight: 500; border-bottom: 2px solid transparent; color: #6b7280; cursor: pointer; white-space: nowrap; transition: all 0.2s; background: none; border-top: none; border-left: none; border-right: none; }
    .tab-btn:hover { color: #374151; }
    .tab-btn.active { border-bottom-color: #19529E; color: #19529E; }
    input[type="range"] { -webkit-appearance: none; height: 6px; border-radius: 99px; background: #e2e8f0; outline: none; }
    input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 50%; cursor: pointer; }
    input[type="range"].range-indigo::-webkit-slider-thumb { background: #19529E; }
    input[type="range"].range-emerald::-webkit-slider-thumb { background: #07A385; }
    
    /* Classes utilitaires pour le catalogue */
    .w-full { width: 100%; }
    .max-w-7xl { max-width: 80rem; }
    .max-w-5xl { max-width: 64rem; }
    .max-w-4xl { max-width: 56rem; }
    .mx-auto { margin-left: auto; margin-right: auto; }
    .px-4 { padding-left: 1rem; padding-right: 1rem; }
    .py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
    .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
    .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
    .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
    .px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
    .p-4 { padding: 1rem; }
    .p-5 { padding: 1.25rem; }
    .p-6 { padding: 1.5rem; }
    .p-3 { padding: 0.75rem; }
    .p-2 { padding: 0.5rem; }
    .mb-6 { margin-bottom: 1.5rem; }
    .mb-5 { margin-bottom: 1.25rem; }
    .mb-4 { margin-bottom: 1rem; }
    .mb-3 { margin-bottom: 0.75rem; }
    .mb-2 { margin-bottom: 0.5rem; }
    .mb-1 { margin-bottom: 0.25rem; }
    .mt-5 { margin-top: 1.25rem; }
    .mt-4 { margin-top: 1rem; }
    .mt-3 { margin-top: 0.75rem; }
    .mt-6 { margin-top: 1.5rem; }
    .gap-6 { gap: 1.5rem; }
    .gap-4 { gap: 1rem; }
    .gap-3 { gap: 0.75rem; }
    .gap-2 { gap: 0.5rem; }
    .gap-1 { gap: 0.25rem; }
    .flex { display: flex; }
    .inline-flex { display: inline-flex; }
    .grid { display: grid; }
    .hidden { display: none; }
    .block { display: block; }
    .flex-col { flex-direction: column; }
    .flex-wrap { flex-wrap: wrap; }
    .flex-1 { flex: 1 1 0%; }
    .flex-shrink-0 { flex-shrink: 0; }
    .items-start { align-items: flex-start; }
    .items-center { align-items: center; }
    .items-end { align-items: flex-end; }
    .items-baseline { align-items: baseline; }
    .justify-between { justify-content: space-between; }
    .justify-center { justify-content: center; }
    .text-center { text-align: center; }
    .text-right { text-align: right; }
    .text-2xl { font-size: 1.5rem; line-height: 2rem; }
    .text-xl { font-size: 1.25rem; line-height: 1.75rem; }
    .text-lg { font-size: 1.125rem; line-height: 1.75rem; }
    .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
    .text-xs { font-size: 0.75rem; line-height: 1rem; }
    .text-3xl { font-size: 1.875rem; }
    .text-4xl { font-size: 2.25rem; }
    .font-bold { font-weight: 700; }
    .font-semibold { font-weight: 600; }
    .font-medium { font-weight: 500; }
    .font-mono { font-family: monospace; }
    .leading-tight { line-height: 1.25; }
    .whitespace-nowrap { white-space: nowrap; }
    .overflow-hidden { overflow: hidden; }
    .overflow-x-auto { overflow-x: auto; }
    .rounded-xl { border-radius: 0.75rem; }
    .rounded-2xl { border-radius: 1rem; }
    .rounded-lg { border-radius: 0.5rem; }
    .rounded-full { border-radius: 9999px; }
    .border { border-width: 1px; }
    .border-b { border-bottom-width: 1px; }
    .shadow-sm { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); }
    .bg-white { background-color: #ffffff; }
    .bg-gray-50 { background-color: #f9fafb; }
    .bg-gray-100 { background-color: #f3f4f6; }
    .bg-indigo-50 { background-color: #E8F0FA; }
    .bg-indigo-600 { background-color: #123E78; }
    .bg-blue-50 { background-color: #E8F0FA; }
    .bg-emerald-50 { background-color: #E2F4EF; }
    .bg-emerald-500 { background-color: #07A385; }
    .bg-amber-50 { background-color: #FCF8E6; }
    .bg-amber-500 { background-color: #DCBF1B; }
    .bg-red-400 { background-color: #E8556B; }
    .text-white { color: #ffffff; }
    .text-gray-900 { background-color: transparent; color: #111827; }
    .text-gray-800 { color: #1f2937; }
    .text-gray-700 { color: #374151; }
    .text-gray-600 { color: #4b5563; }
    .text-gray-500 { color: #6b7280; }
    .text-gray-400 { color: #9ca3af; }
    .text-indigo-600 { color: #123E78; }
    .text-indigo-800 { color: #0E2F5C; }
    .text-indigo-500 { color: #19529E; }
    .text-blue-800 { color: #123E78; }
    .text-emerald-600 { color: #06806A; }
    .text-emerald-800 { color: #054C40; }
    .text-amber-800 { color: #7A5C00; }
    .text-red-400 { color: #E8556B; }
    .text-red-600 { color: #BB142E; }
    .border-gray-100 { border-color: #f3f4f6; }
    .border-gray-200 { border-color: #e5e7eb; }
    .border-gray-300 { border-color: #d1d5db; }
    .border-gray-50 { border-color: #f9fafb; }
    .border-indigo-500 { border-color: #19529E; }
    .opacity-70 { opacity: 0.7; }
    .opacity-80 { opacity: 0.8; }
    .cursor-pointer { cursor: pointer; }
    .transition { transition: all 0.15s ease; }
    .hover\:bg-indigo-700:hover { background-color: #123E78; }
    .hover\:bg-indigo-50:hover { background-color: #E8F0FA; }
    .hover\:bg-emerald-50:hover { background-color: #E2F4EF; }
    .hover\:bg-gray-50:hover { background-color: #f9fafb; }
    .hover\:text-indigo-600:hover { color: #123E78; }
    .hover\:text-emerald-600:hover { color: #06806A; }
    .hover\:text-red-600:hover { color: #BB142E; }
    .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .relative { position: relative; }
    .absolute { position: absolute; }
    .h-36 { height: 9rem; }
    .w-2 { width: 0.5rem; }
    .h-2 { height: 0.5rem; }
    .min-w-0 { min-width: 0; }
    .space-y-4 > * + * { margin-top: 1rem; }
    .space-y-3 > * + * { margin-top: 0.75rem; }
    .space-y-5 > * + * { margin-top: 1.25rem; }
    @media (min-width: 640px) {
      .sm\:flex-row { flex-direction: row; }
      .sm\:items-center { align-items: center; }
      .sm\:col-span-2 { grid-column: span 2 / span 2; }
      .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
      .sm\:inline { display: inline; }
    }
    @media (min-width: 768px) {
      .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    @media (min-width: 1024px) {
      .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .lg\:col-span-2 { grid-column: span 2 / span 2; }
    }
  /* ── Detail Layout ── */
.cat-detail { max-width:1000px; margin:0 auto; }
.cat-detail-cover { height:200px; background-size:cover; background-position:center; background-color:#f0f4f8; border-radius:12px; position:relative; display:flex; align-items:center; justify-content:center; }
.cover-placeholder { color:#94a3b8; font-size:1.1rem; }
.cover-change-btn { position:absolute; bottom:10px; right:10px; background:rgba(0,0,0,.5); color:#fff; border:none; border-radius:8px; padding:6px 14px; cursor:pointer; font-size:.85rem; }
.cat-detail-header { display:flex; align-items:center; gap:16px; padding:16px 0; }
.cat-detail-title { flex:1; } .cat-detail-title h2 { margin:0; }
.cat-badge-theme { background:#D3E2F2; color:#19529E; padding:2px 10px; border-radius:6px; font-size:.75rem; font-weight:600; margin-left:8px; }
.btn-back { background:none; border:1px solid #e2e8f0; border-radius:8px; padding:8px 16px; cursor:pointer; color:#64748b; }
.btn-save-detail { background:#19529E; color:#fff; border:none; border-radius:8px; padding:8px 20px; cursor:pointer; font-weight:600; }
.btn-save-detail:hover { background:#19529E; }

/* Tabs */
.cat-detail-tabs { display:flex; gap:4px; border-bottom:2px solid #e2e8f0; margin-bottom:20px; }
.cdtab { background:none; border:none; padding:10px 20px; cursor:pointer; color:#64748b; font-weight:500; border-bottom:2px solid transparent; margin-bottom:-2px; transition:.2s; }
.cdtab.active { color:#19529E; border-bottom-color:#19529E; }

/* Form */
.cd-form { display:flex; flex-direction:column; gap:14px; }
.cd-row { display:flex; gap:14px; } .cd-row>.cd-field { flex:1; }
.cd-field { display:flex; flex-direction:column; gap:4px; }
.cd-field label { font-size:.82rem; font-weight:600; color:#475569; }
.cd-input { padding:8px 12px; border:1px solid #e2e8f0; border-radius:8px; font-size:.9rem; }
.cd-input:focus { outline:none; border-color:#19529E; box-shadow:0 0 0 3px rgba(59,130,246,.1); }
.cd-input.mini { width:75px; padding:6px 8px; }
.cd-input.mini-sel { width:90px; padding:6px; }

/* Planning */
.cd-planning { display:flex; flex-direction:column; gap:14px; }
.cd-plan-day { background:#f8fafc; border:1px solid #e2e8f0; border-radius:12px; padding:14px; }
.day-head { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.day-tag { background:#D3E2F2; color:#19529E; padding:2px 8px; border-radius:4px; font-size:.72rem; font-weight:600; }
.day-slots { display:flex; gap:10px; }
.dslot { flex:1; display:flex; flex-direction:column; gap:4px; }
.dslot label { font-size:.78rem; color:#64748b; }

/* Costs */
.cd-costs { display:flex; flex-direction:column; gap:18px; }
.cd-sim-bar { display:flex; align-items:center; gap:14px; padding:14px; background:#E8F0FA; border-radius:12px; border:1px solid #B7CFE8; }
.cd-sim-bar input[type=range] { flex:1; }
.cd-cost-section { background:#f8fafc; border:1px solid #e2e8f0; border-radius:12px; padding:14px; }
.cd-auto-section { background:#FCF8E6; border-color:#EFE2A0; }
.cd-sec-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; flex-wrap:wrap; gap:8px; }
.cd-sec-head h3 { margin:0; font-size:1rem; }
.cd-sec-actions { display:flex; gap:8px; align-items:center; }
.cd-ref-select { padding:5px 8px; border:1px solid #7FA8D6; border-radius:6px; font-size:.82rem; background:#f0f9ff; }
.cd-btn-add { background:#f0f9ff; border:1px dashed #7FA8D6; color:#19529E; padding:5px 12px; border-radius:6px; cursor:pointer; font-size:.82rem; }
.cd-auto-params { display:flex; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
.cd-auto-params label { font-size:.8rem; color:#64748b; display:flex; align-items:center; gap:4px; }
.cd-cost-row { display:flex; align-items:center; gap:6px; padding:7px 0; border-bottom:1px solid #e2e8f0; flex-wrap:wrap; }
.cd-cost-row:last-child { border-bottom:none; }
.cd-cost-row.auto { color:#7A5C00; }
.cd-cl { flex:1; font-weight:500; min-width:120px; }
.cd-cd { color:#64748b; font-size:.82rem; }
.cd-ca { font-weight:700; min-width:70px; text-align:right; }
.cd-ca.fixe { color:#4A2069; } .cd-ca.var { color:#06806A; }
.cd-cost-label { flex:1; min-width:130px; }
.cd-fixe-tog { font-size:.8rem; display:flex; align-items:center; gap:3px; white-space:nowrap; }
.cd-btn-del { background:none; border:none; cursor:pointer; opacity:.4; } .cd-btn-del:hover { opacity:1; }
.cd-enc-info { margin-top:8px; padding:8px; background:rgba(245,158,11,.1); border-radius:6px; font-size:.82rem; color:#7A5C00; }
.cd-empty { color:#94a3b8; font-style:italic; padding:8px; text-align:center; }

/* Totaux */
.cd-totals { background:#fff; border:2px solid #e2e8f0; border-radius:12px; padding:16px; }
.cd-tot-row { display:flex; justify-content:space-between; padding:5px 0; }
.cd-tot-row .fixe { color:#4A2069; } .cd-tot-row .var { color:#06806A; }
.cd-tot-row.grand { font-size:1.2rem; font-weight:700; border-top:2px solid #e2e8f0; padding-top:10px; margin-top:6px; }
.cd-tot-row.prix { background:#E2F4EF; padding:12px; border-radius:8px; margin-top:8px; font-weight:700; color:#06806A; }

@media(max-width:600px) { .cd-row,.day-slots,.cd-auto-params { flex-direction:column; } }
  /* ══════════════════════════════════════════════
   CATALOGUE SÉJOURS
   ══════════════════════════════════════════════ */

/* ── Header ── */
.cs-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:24px}
.cs-header h2{font-size:1.5rem;color:#0E3550;display:flex;align-items:center;gap:10px}
.cs-header h2 i{color:#19529E}
.cs-count{background:#D3E2F2;color:#123E78;padding:2px 10px;border-radius:20px;font-size:.8rem;margin-left:8px}
.cs-header-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cs-search-box{position:relative}
.cs-search-box i{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:#94a3b8;font-size:.85rem}
.cs-search-box input{padding:8px 12px 8px 32px;border:1px solid #e2e8f0;border-radius:8px;font-size:.85rem;width:200px;transition:.2s}
.cs-search-box input:focus{border-color:#19529E;box-shadow:0 0 0 3px rgba(99,102,241,.12);outline:none}
.cs-header-actions select{padding:8px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:.85rem;background:#fff}

/* ── Buttons ── */
.cs-btn{padding:8px 16px;border:none;border-radius:8px;font-size:.85rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.2s}
.cs-btn-primary{background:linear-gradient(135deg,#19529E,#5C2A83);color:#fff;box-shadow:0 2px 8px rgba(99,102,241,.3)}
.cs-btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,.4)}
.cs-btn-outline{background:#fff;color:#19529E;border:1px solid #BBD0E8}
.cs-btn-outline:hover{background:#E8F0FA}
.cs-btn-ghost{background:transparent;color:#64748b}
.cs-btn-ghost:hover{background:#f1f5f9}
.cs-btn-danger{background:#FBD9DE;color:#E21838;border:1px solid #EFA3AE}
.cs-btn-danger:hover{background:#E21838;color:#fff}

/* ── Grid ── */
.cs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.cs-card{border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.04);transition:.3s;cursor:pointer;position:relative}
.cs-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(99,102,241,.15)}
.cs-card-img{height:180px;background-size:cover;background-position:center;background-color:#e2e8f0;position:relative}
.cs-card-img::after{content:'';position:absolute;bottom:0;left:0;right:0;height:60%;background:linear-gradient(transparent,rgba(0,0,0,.5))}
.cs-card-season{position:absolute;top:12px;right:12px;background:rgba(255,255,255,.9);backdrop-filter:blur(4px);padding:4px 10px;border-radius:20px;font-size:.75rem;z-index:1}
.cs-card-body{padding:16px}
.cs-card-title{font-size:1.1rem;font-weight:700;color:#0E3550;margin-bottom:4px}
.cs-card-dest{font-size:.85rem;color:#64748b;display:flex;align-items:center;gap:4px;margin-bottom:12px}
.cs-card-chips{display:flex;gap:8px;flex-wrap:wrap}
.cs-chip{padding:4px 10px;border-radius:20px;font-size:.75rem;font-weight:600}
.cs-chip-dur{background:#D3E2F2;color:#19529E}
.cs-chip-cap{background:#dcfce7;color:#16a34a}
.cs-chip-age{background:#FAF3D2;color:#B89A16}
.cs-card-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:10px}
.cs-card-tag{background:#f1f5f9;color:#64748b;padding:2px 8px;border-radius:4px;font-size:.7rem}

/* ── Empty state ── */
.cs-empty{text-align:center;padding:80px 20px;color:#94a3b8}
.cs-empty i{font-size:3rem;margin-bottom:16px;opacity:.4}
.cs-empty h3{color:#475569;margin-bottom:8px}
.cs-empty .cs-btn{margin-top:16px}

/* ── Hero ── */
.cs-hero{height:260px;background-size:cover;background-position:center;background-color:#1e1b4b;border-radius:16px;overflow:hidden;position:relative}
.cs-hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(99,102,241,.7),rgba(139,92,246,.5));display:flex;flex-direction:column;justify-content:flex-end;padding:28px 32px;color:#fff}
.cs-hero-overlay h1{font-size:1.8rem;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.3)}
.cs-hero-tags{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.cs-hero-tags span{padding:4px 12px;border-radius:20px;font-size:.8rem;background:rgba(255,255,255,.2);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.2)}

/* ── Topbar ── */
.cs-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.cs-topbar-right{display:flex;gap:8px}

/* ── Tabs ── */
.cs-tabs{display:flex;gap:4px;background:#f1f5f9;padding:4px;border-radius:12px;margin:20px 0}
.cs-tab{flex:1;padding:10px;border:none;background:transparent;border-radius:8px;font-size:.85rem;font-weight:600;color:#64748b;cursor:pointer;transition:.2s;display:flex;align-items:center;justify-content:center;gap:6px}
.cs-tab.active{background:#fff;color:#19529E;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.cs-tab:hover:not(.active){color:#19529E;background:rgba(255,255,255,.5)}

/* ── Panels ── */
.cs-panel{animation:csFadeIn .3s ease}
@keyframes csFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* ── Overview ── */
.cs-overview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:24px}
.cs-stat-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:16px;text-align:center;transition:.2s}
.cs-stat-card:hover{border-color:#BBD0E8;box-shadow:0 2px 8px rgba(99,102,241,.1)}
.cs-stat-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin:0 auto 8px;font-size:1rem}
.cs-stat-value{font-size:1.2rem;font-weight:800;color:#0E3550}
.cs-stat-label{font-size:.75rem;color:#94a3b8;margin-top:2px}
.cs-desc-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:20px;margin-bottom:24px;line-height:1.6;color:#475569}
.cs-activities-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.cs-activity-item{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;background:#fff;border:1px solid #e2e8f0}
.cs-activity-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.cs-activity-item span{font-size:.85rem;color:#334155}

/* ── Planning ── */
.cs-planning-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.cs-planning-toolbar select,.cs-planning-toolbar input{padding:8px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:.85rem}
.cs-day-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;overflow:hidden;margin-bottom:16px}
.cs-day-header{padding:14px 20px;background:linear-gradient(135deg,#19529E,#5E7FC0);color:#fff;display:flex;justify-content:space-between;align-items:center}
.cs-day-header h3{font-size:1rem;font-weight:700}
.cs-day-header small{opacity:.8}
.cs-day-body{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.cs-slot{padding:14px;border-right:1px solid #f1f5f9;min-height:120px;position:relative}
.cs-slot:last-child{border-right:none}
.cs-slot-title{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#94a3b8;margin-bottom:10px;display:flex;align-items:center;gap:6px}
.cs-block{padding:10px 12px;border-radius:10px;margin-bottom:8px;border-left:4px solid;position:relative;transition:.2s}
.cs-block:hover{transform:translateX(2px);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.cs-block-name{font-size:.85rem;font-weight:600;color:#0E3550}
.cs-block-desc{font-size:.75rem;color:#64748b;margin-top:2px}
.cs-block-remove{position:absolute;top:6px;right:6px;background:none;border:none;color:#94a3b8;cursor:pointer;font-size:.7rem;opacity:0;transition:.2s}
.cs-block:hover .cs-block-remove{opacity:1}
.cs-block-remove:hover{color:#E21838}
.cs-add-block{width:100%;padding:8px;border:2px dashed #e2e8f0;border-radius:8px;background:none;color:#94a3b8;font-size:.8rem;cursor:pointer;transition:.2s}
.cs-add-block:hover{border-color:#19529E;color:#19529E;background:#E8F0FA}

/* Block colors by type */
.cs-block-sport{border-color:#19529E;background:rgba(59,130,246,.08)}
.cs-block-culture{border-color:#5C2A83;background:rgba(139,92,246,.08)}
.cs-block-nature{border-color:#07A385;background:rgba(16,185,129,.08)}
.cs-block-aquatique{border-color:#008DD1;background:rgba(6,182,212,.08)}
.cs-block-animation{border-color:#D12D3F;background:rgba(236,72,153,.08)}
.cs-block-repas{border-color:#C99312;background:rgba(249,115,22,.08)}
.cs-block-transport{border-color:#eab308;background:rgba(234,179,8,.08)}
.cs-block-logistique{border-color:#6b7280;background:rgba(107,114,128,.08)}

/* ── Costs ── */
.cs-costs-sim{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:24px;margin-bottom:20px}
#cdSimSlider::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:white;border:3px solid #19529E;box-shadow:0 2px 8px rgba(99,102,241,.3);cursor:pointer;}
#cdSimSlider::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:white;border:3px solid #19529E;cursor:pointer;}
.cs-sim-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.cs-sim-label span{font-size:.9rem;font-weight:600;color:#475569}
.cs-sim-value{font-size:1.4rem;font-weight:800;color:#19529E}

/* Custom range slider */
.cs-range{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:4px;background:linear-gradient(90deg,#19529E 0%,#e2e8f0 0%);outline:none}
.cs-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#19529E,#5C2A83);cursor:pointer;box-shadow:0 2px 8px rgba(99,102,241,.4);border:3px solid #fff;transition:.2s}
.cs-range::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 4px 14px rgba(99,102,241,.5)}
.cs-range::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,#19529E,#5C2A83);cursor:pointer;box-shadow:0 2px 8px rgba(99,102,241,.4);border:3px solid #fff}

.cs-costs-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:20px 0}
.cs-cost-card{border-radius:12px;padding:20px;text-align:center;color:#fff;position:relative;overflow:hidden}
.cs-cost-card::before{content:'';position:absolute;inset:0;opacity:.1;background:radial-gradient(circle at top right,#fff,transparent)}
.cs-cost-card .cc-val{font-size:1.5rem;font-weight:800}
.cs-cost-card .cc-lbl{font-size:.8rem;opacity:.85;margin-top:4px}
.cc-blue{background:linear-gradient(135deg,#19529E,#19529E)}
.cc-green{background:linear-gradient(135deg,#07A385,#14b8a6)}
.cc-purple{background:linear-gradient(135deg,#5C2A83,#8A63AE)}
.cc-orange{background:linear-gradient(135deg,#C99312,#DCBF1B)}

.cs-breakdown{margin-top:20px}
.cs-breakdown h4{font-size:.9rem;color:#475569;margin-bottom:14px}
.cs-bar-row{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.cs-bar-label{width:110px;font-size:.8rem;color:#64748b;text-align:right;flex-shrink:0}
.cs-bar-track{flex:1;height:24px;background:#f1f5f9;border-radius:6px;overflow:hidden;position:relative}
.cs-bar-fill{height:100%;border-radius:6px;transition:width .5s ease;display:flex;align-items:center;justify-content:flex-end;padding-right:8px;font-size:.7rem;font-weight:700;color:#fff;min-width:fit-content}
.cs-bar-amount{width:80px;font-size:.8rem;font-weight:600;color:#0E3550;text-align:right;flex-shrink:0}

/* ── Modal / Form ── */
.cs-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}
.cs-modal{background:#fff;border-radius:16px;width:100%;max-width:640px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2)}
.cs-modal-head{padding:20px 24px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center}
.cs-modal-head h3{font-size:1.1rem;font-weight:700;color:#0E3550}
.cs-modal-head button{background:none;border:none;font-size:1.5rem;color:#94a3b8;cursor:pointer}
.cs-modal-body{padding:24px;overflow-y:auto;flex:1}
.cs-modal-foot{padding:16px 24px;border-top:1px solid #e2e8f0;display:flex;justify-content:flex-end;gap:10px}
.cs-label{font-size:.8rem;font-weight:600;color:#475569;margin-bottom:4px;display:block}
.cs-field{margin-bottom:14px}
.cs-field input,.cs-field select,.cs-field textarea{width:100%;padding:9px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:.85rem;transition:.2s;font-family:inherit}
.cs-field input:focus,.cs-field select:focus,.cs-field textarea:focus{border-color:#19529E;box-shadow:0 0 0 3px rgba(99,102,241,.12);outline:none}
.cs-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cs-row3{grid-template-columns:1fr 1fr 1fr}

/* Dropzone */
.cs-dropzone{border:2px dashed #d4d4d8;border-radius:12px;padding:0;overflow:hidden;cursor:pointer;transition:.3s;margin-bottom:16px;position:relative;min-height:160px;display:flex;align-items:center;justify-content:center}
.cs-dropzone.dragover{border-color:#19529E;background:#E8F0FA}
.cs-dropzone #csDropPlaceholder{text-align:center;padding:30px;color:#94a3b8}
.cs-dropzone #csDropPlaceholder i{font-size:2rem;margin-bottom:8px;display:block;color:#8FAAD2}
.cs-dropzone #csDropPlaceholder span{font-size:.9rem;display:block}
.cs-dropzone #csDropPlaceholder small{font-size:.75rem;margin-top:4px;display:block}
.cs-dropzone #csDropPreview{width:100%;height:200px}
.cs-dropzone #csDropPreview img{width:100%;height:100%;object-fit:cover}
.cs-drop-remove{position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;border:none;cursor:pointer;font-size:.8rem;display:flex;align-items:center;justify-content:center;z-index:2}
.cs-drop-remove:hover{background:#E21838}

/* ── Planning Add Modal ── */
.cs-add-modal{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1001;display:flex;align-items:center;justify-content:center}
.cs-add-modal-inner{background:#fff;border-radius:12px;padding:24px;width:360px;max-width:90vw}
.cs-add-modal-inner h4{margin-bottom:16px;color:#0E3550}
.cs-add-modal-inner .cs-field{margin-bottom:10px}
.cs-add-modal-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}

/* ══════════════════════════════════════════════
   NOUVEAU CATALOGUE SÉJOURS - Styles Standalone
   ══════════════════════════════════════════════ */
#catalogueContainer { font-family: system-ui, -apple-system, sans-serif; }
#catalogueContainer .grad-nature { background: linear-gradient(135deg, #4FBDA6, #0d9488); }
#catalogueContainer .grad-aquatic { background: linear-gradient(135deg, #5B86C2, #008DD1); }
#catalogueContainer .grad-mountain { background: linear-gradient(135deg, #7dd3fc, #19529E); }
#catalogueContainer .grad-culture { background: linear-gradient(135deg, #8A63AE, #123E78); }
#catalogueContainer .grad-sport { background: linear-gradient(135deg, #fb923c, #E21838); }
#catalogueContainer .grad-art { background: linear-gradient(135deg, #f472b6, #e11d48); }
#catalogueContainer .grad-default { background: linear-gradient(135deg, #9ca3af, #4b5563); }
#catalogueContainer .card-hover { transition: all 0.25s ease; }
#catalogueContainer .card-hover:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,0.12); }
#catalogueContainer .fade-in { animation: catFadeIn 0.3s ease; }
@keyframes catFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
#catalogueContainer .cat-toast-in { animation: catToastIn 0.4s ease; }
@keyframes catToastIn { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
#catalogueContainer .tab-btn { padding: 10px 16px; font-size: 13px; font-weight: 500; border-bottom: 2px solid transparent; color: #6b7280; cursor: pointer; white-space: nowrap; transition: all 0.2s; background: none; border-top: none; border-left: none; border-right: none; }
#catalogueContainer .tab-btn:hover { color: #374151; }
#catalogueContainer .tab-btn.active { border-bottom-color: #19529E; color: #19529E; }
#catalogueContainer input[type="range"] { -webkit-appearance: none; height: 6px; border-radius: 99px; background: #e2e8f0; outline: none; }
#catalogueContainer input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 50%; cursor: pointer; }
#catalogueContainer input[type="range"].range-indigo::-webkit-slider-thumb { background: #19529E; }
#catalogueContainer input[type="range"].range-emerald::-webkit-slider-thumb { background: #07A385; }

/* Tailwind-like utilities for catalogue */
#catalogueContainer .max-w-7xl { max-width: 80rem; }
#catalogueContainer .max-w-6xl { max-width: 72rem; }
#catalogueContainer .max-w-4xl { max-width: 56rem; }
#catalogueContainer .mx-auto { margin-left: auto; margin-right: auto; }
#catalogueContainer .px-4 { padding-left: 1rem; padding-right: 1rem; }
#catalogueContainer .py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
#catalogueContainer .mb-6 { margin-bottom: 1.5rem; }
#catalogueContainer .mb-4 { margin-bottom: 1rem; }
#catalogueContainer .mb-3 { margin-bottom: 0.75rem; }
#catalogueContainer .mb-2 { margin-bottom: 0.5rem; }
#catalogueContainer .mb-1 { margin-bottom: 0.25rem; }
#catalogueContainer .mt-5 { margin-top: 1.25rem; }
#catalogueContainer .mt-4 { margin-top: 1rem; }
#catalogueContainer .mt-3 { margin-top: 0.75rem; }
#catalogueContainer .mt-2 { margin-top: 0.5rem; }
#catalogueContainer .mt-1 { margin-top: 0.25rem; }
#catalogueContainer .p-6 { padding: 1.5rem; }
#catalogueContainer .p-5 { padding: 1.25rem; }
#catalogueContainer .p-4 { padding: 1rem; }
#catalogueContainer .p-3 { padding: 0.75rem; }
#catalogueContainer .p-2 { padding: 0.5rem; }
#catalogueContainer .gap-6 { gap: 1.5rem; }
#catalogueContainer .gap-4 { gap: 1rem; }
#catalogueContainer .gap-3 { gap: 0.75rem; }
#catalogueContainer .gap-2 { gap: 0.5rem; }
#catalogueContainer .gap-1 { gap: 0.25rem; }
#catalogueContainer .flex { display: flex; }
#catalogueContainer .inline-flex { display: inline-flex; }
#catalogueContainer .grid { display: grid; }
#catalogueContainer .hidden { display: none; }
#catalogueContainer .block { display: block; }
#catalogueContainer .flex-col { flex-direction: column; }
#catalogueContainer .flex-wrap { flex-wrap: wrap; }
#catalogueContainer .flex-shrink-0 { flex-shrink: 0; }
#catalogueContainer .flex-1 { flex: 1 1 0%; }
#catalogueContainer .min-w-0 { min-width: 0; }
#catalogueContainer .items-center { align-items: center; }
#catalogueContainer .items-start { align-items: start; }
#catalogueContainer .items-baseline { align-items: baseline; }
#catalogueContainer .items-end { align-items: flex-end; }
#catalogueContainer .justify-between { justify-content: space-between; }
#catalogueContainer .justify-center { justify-content: center; }
#catalogueContainer .self-stretch { align-self: stretch; }
#catalogueContainer .text-center { text-align: center; }
#catalogueContainer .text-right { text-align: right; }
#catalogueContainer .text-left { text-align: left; }
#catalogueContainer .text-2xl { font-size: 1.5rem; line-height: 2rem; }
#catalogueContainer .text-xl { font-size: 1.25rem; line-height: 1.75rem; }
#catalogueContainer .text-lg { font-size: 1.125rem; line-height: 1.75rem; }
#catalogueContainer .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
#catalogueContainer .text-xs { font-size: 0.75rem; line-height: 1rem; }
#catalogueContainer .font-bold { font-weight: 700; }
#catalogueContainer .font-semibold { font-weight: 600; }
#catalogueContainer .font-medium { font-weight: 500; }
#catalogueContainer .font-mono { font-family: ui-monospace, monospace; }
#catalogueContainer .leading-tight { line-height: 1.25; }
#catalogueContainer .leading-relaxed { line-height: 1.625; }
#catalogueContainer .whitespace-nowrap { white-space: nowrap; }
#catalogueContainer .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#catalogueContainer .rounded-xl { border-radius: 0.75rem; }
#catalogueContainer .rounded-lg { border-radius: 0.5rem; }
#catalogueContainer .rounded-full { border-radius: 9999px; }
#catalogueContainer .rounded { border-radius: 0.25rem; }
#catalogueContainer .border { border-width: 1px; }
#catalogueContainer .border-b { border-bottom-width: 1px; }
#catalogueContainer .border-l-4 { border-left-width: 4px; }
#catalogueContainer .shadow-sm { box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); }
#catalogueContainer .shadow-2xl { box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); }
#catalogueContainer .overflow-hidden { overflow: hidden; }
#catalogueContainer .overflow-x-auto { overflow-x: auto; }
#catalogueContainer .overflow-y-auto { overflow-y: auto; }
#catalogueContainer .relative { position: relative; }
#catalogueContainer .absolute { position: absolute; }
#catalogueContainer .fixed { position: fixed; }
#catalogueContainer .inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
#catalogueContainer .z-50 { z-index: 50; }
#catalogueContainer .cursor-pointer { cursor: pointer; }
#catalogueContainer .transition { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
#catalogueContainer .hover\:bg-gray-50:hover { background-color: #f9fafb; }
#catalogueContainer .hover\:bg-indigo-50:hover { background-color: #E8F0FA; }
#catalogueContainer .hover\:bg-emerald-50:hover { background-color: #E2F4EF; }
#catalogueContainer .hover\:bg-indigo-700:hover { background-color: #123E78; }
#catalogueContainer .hover\:bg-emerald-700:hover { background-color: #055E4E; }
#catalogueContainer .hover\:text-indigo-600:hover { color: #123E78; }
#catalogueContainer .hover\:text-emerald-600:hover { color: #06806A; }
#catalogueContainer .hover\:text-red-600:hover { color: #BB142E; }
#catalogueContainer .hover\:text-indigo-800:hover { color: #0E2F5C; }
/* Colors */
#catalogueContainer .bg-white { background-color: #fff; }
#catalogueContainer .bg-gray-50 { background-color: #f9fafb; }
#catalogueContainer .bg-gray-100 { background-color: #f3f4f6; }
#catalogueContainer .bg-gray-900 { background-color: #111827; }
#catalogueContainer .bg-indigo-50 { background-color: #E8F0FA; }
#catalogueContainer .bg-indigo-100 { background-color: #D3E2F2; }
#catalogueContainer .bg-indigo-600 { background-color: #123E78; }
#catalogueContainer .bg-blue-50 { background-color: #E8F0FA; }
#catalogueContainer .bg-blue-100 { background-color: #D3E2F2; }
#catalogueContainer .bg-blue-500 { background-color: #19529E; }
#catalogueContainer .bg-emerald-50 { background-color: #E2F4EF; }
#catalogueContainer .bg-emerald-100 { background-color: #D0EFE8; }
#catalogueContainer .bg-emerald-600 { background-color: #06806A; }
#catalogueContainer .bg-amber-50 { background-color: #FCF8E6; }
#catalogueContainer .bg-amber-100 { background-color: #FAF3D2; }
#catalogueContainer .bg-amber-500 { background-color: #DCBF1B; }
#catalogueContainer .bg-sky-100 { background-color: #e0f2fe; }
#catalogueContainer .bg-purple-400 { background-color: #8A63AE; }
#catalogueContainer .bg-red-400 { background-color: #E8556B; }
#catalogueContainer .bg-yellow-50 { background-color: #fefce8; }
#catalogueContainer .text-white { color: #fff; }
#catalogueContainer .text-gray-400 { color: #9ca3af; }
#catalogueContainer .text-gray-500 { color: #6b7280; }
#catalogueContainer .text-gray-600 { color: #4b5563; }
#catalogueContainer .text-gray-700 { color: #374151; }
#catalogueContainer .text-gray-800 { color: #1f2937; }
#catalogueContainer .text-gray-900 { color: #111827; }
#catalogueContainer .text-indigo-500 { color: #19529E; }
#catalogueContainer .text-indigo-600 { color: #123E78; }
#catalogueContainer .text-indigo-700 { color: #123E78; }
#catalogueContainer .text-indigo-800 { color: #0E2F5C; }
#catalogueContainer .text-blue-700 { color: #123E78; }
#catalogueContainer .text-blue-800 { color: #123E78; }
#catalogueContainer .text-emerald-500 { color: #07A385; }
#catalogueContainer .text-emerald-600 { color: #06806A; }
#catalogueContainer .text-emerald-700 { color: #055E4E; }
#catalogueContainer .text-emerald-800 { color: #054C40; }
#catalogueContainer .text-amber-600 { color: #B89A16; }
#catalogueContainer .text-amber-700 { color: #8A6D00; }
#catalogueContainer .text-amber-800 { color: #7A5C00; }
#catalogueContainer .text-sky-800 { color: #075985; }
#catalogueContainer .text-red-200 { color: #F4C0C8; }
#catalogueContainer .text-red-400 { color: #E8556B; }
#catalogueContainer .text-yellow-800 { color: #854d0e; }
#catalogueContainer .border-gray-100 { border-color: #f3f4f6; }
#catalogueContainer .border-gray-200 { border-color: #e5e7eb; }
#catalogueContainer .border-gray-300 { border-color: #d1d5db; }
#catalogueContainer .border-indigo-100 { border-color: #D3E2F2; }
#catalogueContainer .border-indigo-200 { border-color: #BBD0E8; }
#catalogueContainer .border-indigo-300 { border-color: #8FAAD2; }
#catalogueContainer .border-blue-100 { border-color: #D3E2F2; }
#catalogueContainer .border-blue-400 { border-color: #5B86C2; }
#catalogueContainer .border-emerald-100 { border-color: #D0EFE8; }
#catalogueContainer .border-emerald-400 { border-color: #4FBDA6; }
#catalogueContainer .border-amber-100 { border-color: #FAF3D2; }
#catalogueContainer .border-purple-400 { border-color: #8A63AE; }
#catalogueContainer .border-yellow-200 { border-color: #fef08a; }
#catalogueContainer .opacity-60 { opacity: 0.6; }
#catalogueContainer .opacity-70 { opacity: 0.7; }
/* Form inputs */
#catalogueContainer input.cat-input,
#catalogueContainer select.cat-select,
#catalogueContainer textarea.cat-textarea,
#catalogueContainer .cat-input {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  outline: none;
  transition: all 0.2s;
}
#catalogueContainer input.cat-input:focus,
#catalogueContainer select.cat-select:focus,
#catalogueContainer textarea.cat-textarea:focus,
#catalogueContainer .cat-input:focus {
  border-color: #19529E;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}
/* Grid cols */
#catalogueContainer .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
#catalogueContainer .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#catalogueContainer .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 640px) {
  #catalogueContainer .sm\:flex-row { flex-direction: row; }
  #catalogueContainer .sm\:items-center { align-items: center; }
  #catalogueContainer .sm\:col-span-2 { grid-column: span 2 / span 2; }
  #catalogueContainer .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #catalogueContainer .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #catalogueContainer .sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  #catalogueContainer .sm\:table-cell { display: table-cell; }
  #catalogueContainer .sm\:inline { display: inline; }
}
@media (min-width: 768px) {
  #catalogueContainer .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  #catalogueContainer .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #catalogueContainer .lg\:col-span-2 { grid-column: span 2 / span 2; }
}
/* Spacing utilities */
#catalogueContainer .space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 1.5rem; }
#catalogueContainer .space-y-4 > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }
#catalogueContainer .space-y-3 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.75rem; }
#catalogueContainer .space-y-2 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.5rem; }
#catalogueContainer .space-y-1 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.25rem; }
#catalogueContainer .divide-y > :not([hidden]) ~ :not([hidden]) { border-top-width: 1px; border-color: #e5e7eb; }
#catalogueContainer .divide-gray-50 > :not([hidden]) ~ :not([hidden]) { border-color: #f9fafb; }
#catalogueContainer .divide-gray-100 > :not([hidden]) ~ :not([hidden]) { border-color: #f3f4f6; }
/* Table */
#catalogueContainer table { border-collapse: collapse; width: 100%; }
#catalogueContainer th, #catalogueContainer td { padding: 0.75rem 1rem; text-align: left; }
#catalogueContainer thead { background-color: #f9fafb; }
#catalogueContainer .uppercase { text-transform: uppercase; }
/* Width/height utilities */
#catalogueContainer .w-full { width: 100%; }
#catalogueContainer .w-40 { width: 10rem; }
#catalogueContainer .w-36 { width: 9rem; }
#catalogueContainer .w-24 { width: 6rem; }
#catalogueContainer .w-20 { width: 5rem; }
#catalogueContainer .w-8 { width: 2rem; }
#catalogueContainer .w-6 { width: 1.5rem; }
#catalogueContainer .w-5 { width: 1.25rem; }
#catalogueContainer .w-2\.5 { width: 0.625rem; }
#catalogueContainer .w-2 { width: 0.5rem; }
#catalogueContainer .w-1\.5 { width: 0.375rem; }
#catalogueContainer .w-0\.5 { width: 0.125rem; }
#catalogueContainer .h-8 { height: 2rem; }
#catalogueContainer .h-6 { height: 1.5rem; }
#catalogueContainer .h-5 { height: 1.25rem; }
#catalogueContainer .h-36 { height: 9rem; }
#catalogueContainer .h-2\.5 { height: 0.625rem; }
#catalogueContainer .h-2 { height: 0.5rem; }
/* Backgrounds with opacity */
#catalogueContainer .bg-white\/15 { background-color: rgba(255, 255, 255, 0.15); }
#catalogueContainer .bg-white\/20 { background-color: rgba(255, 255, 255, 0.2); }
#catalogueContainer .bg-white\/25 { background-color: rgba(255, 255, 255, 0.25); }
#catalogueContainer .bg-white\/30 { background-color: rgba(255, 255, 255, 0.3); }
#catalogueContainer .text-white\/70 { color: rgba(255, 255, 255, 0.7); }
#catalogueContainer .text-white\/80 { color: rgba(255, 255, 255, 0.8); }
#catalogueContainer .hover\:bg-white\/90:hover { background-color: rgba(255, 255, 255, 0.9); }
#catalogueContainer .hover\:bg-white\/30:hover { background-color: rgba(255, 255, 255, 0.3); }
/* Special utilities */
#catalogueContainer .pb-2 { padding-bottom: 0.5rem; }
#catalogueContainer .pb-1 { padding-bottom: 0.25rem; }
#catalogueContainer .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
#catalogueContainer .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
#catalogueContainer .py-8 { padding-top: 2rem; padding-bottom: 2rem; }
#catalogueContainer .py-16 { padding-top: 4rem; padding-bottom: 4rem; }
#catalogueContainer .px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
#catalogueContainer .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
#catalogueContainer .px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
#catalogueContainer .opacity-50 { opacity: 0.5; }
#catalogueContainer .cursor-not-allowed { cursor: not-allowed; }
#catalogueContainer .ml-auto { margin-left: auto; }
#catalogueContainer .mx-1 { margin-left: 0.25rem; margin-right: 0.25rem; }
#catalogueContainer .bottom-6 { bottom: 1.5rem; }
#catalogueContainer .right-6 { right: 1.5rem; }
/* Catalogue toast */
#catToastContainer {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 9999;
}
#catToastContainer > div {
  background: #1f2937;
  color: white;
  padding: 0.75rem 1.25rem;
  border-radius: 0.75rem;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  margin-bottom: 0.5rem;
  animation: catToastIn 0.4s ease;
}


/* ===== Charte graphique TUC ===== */
h1,h2,h3,h4,h5,h6,.sidebar-brand h1,.nav-section-title{font-family:'Nunito','Glacial Indifference',sans-serif;}
#catalogueContainer{font-family:'Glacial Indifference',system-ui,-apple-system,sans-serif;}
#catalogueContainer h1,#catalogueContainer h2,#catalogueContainer h3{font-family:'Nunito',sans-serif;}