/* ═══════════════════════════════════════════════════════════ */
            /* PLANNING MODULE — PREMIUM DESIGN v4                       */
            /* ═══════════════════════════════════════════════�            .planning-page-header .pph-icon {
                width: 48px; height: 48px; border-radius: 14px;
                background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-hover) 100%);
                display: flex; align-items: center; justify-content: center;
                color: #fff; font-size: 1.2rem;
                box-shadow: 0 4px 12px var(--primary-rgba-shadow);
            }
            .planning-page-header h2 {
                margin: 0; font-size: 1.6rem; font-weight: 800;
                color: #0f172a; letter-spacing: -0.5px;
            }
            .planning-page-header h2 small {
                display: block; font-size: 0.5em; font-weight: 500;
                color: #94a3b8; letter-spacing: 0; margin-top: 2px;
            }
 
            /* ── TOOLBAR ─────────────────────────────────────────── */
            .planning-toolbar {
                display: flex; align-items: center; gap: 12px;
                margin-bottom: 16px; padding: 12px 16px;
                background: #ffffff; border-radius: 14px;
                border: 1px solid #e2e8f0;
                box-shadow: 0 1px 3px rgba(15,23,42,0.04);
                flex-wrap: wrap;
            }
            .ptb-btn {
                background: #f8fafc; color: #475569;
                border: 1px solid #e2e8f0; padding: 9px 14px;
                border-radius: 10px; cursor: pointer;
                display: inline-flex; align-items: center; gap: 7px;
                font-weight: 600; font-size: 0.88rem;
                transition: all 0.2s ease; font-family: inherit;
            }
            .ptb-btn:hover {
                background: #f1f5f9; border-color: #cbd5e1;
                transform: translateY(-1px);
                box-shadow: 0 2px 6px rgba(15,23,42,0.06);
            }
            .ptb-badge {
                background: var(--primary-color); color: #fff;
                padding: 2px 10px; border-radius: 20px;
                font-size: 0.82rem; font-weight: 700;
                min-width: 22px; text-align: center;
            }
            .ptb-label {
                font-size: 0.88rem; color: #64748b; font-weight: 600;
            }
            .ptb-spacer { flex-grow: 1; }
            .ptb-filter-group {
                display: flex; align-items: center; gap: 8px;
            }
            .ptb-select {
                padding: 8px 12px; border: 1px solid #e2e8f0;
                border-radius: 8px; font-size: 0.88rem;
                font-weight: 600; color: #475569;
                background: #f8fafc; cursor: pointer;
                font-family: inherit; transition: all 0.2s;
            }
            .ptb-select:focus {
                border-color: var(--primary-color); outline: none;
                box-shadow: 0 0 0 3px var(--primary-rgba-select-focus);
            }
            .ptb-search-wrap {
                position: relative; width: 300px;
            }
            .ptb-search-wrap input {
                width: 100%; padding: 9px 36px 9px 36px;
                border: 1px solid #e2e8f0; border-radius: 10px;
                font-size: 0.88rem; background: #f8fafc;
                font-family: inherit; transition: all 0.2s;
                box-sizing: border-box; color: #1e293b;
            }
            .ptb-search-wrap input:focus {
                border-color: var(--primary-color); background: #fff;
                box-shadow: 0 0 0 3px var(--primary-rgba-select-focus);
                outline: none;
            }
            .ptb-search-wrap .search-icon {
                position: absolute; left: 12px; top: 50%;
                transform: translateY(-50%); color: #94a3b8;
                font-size: 0.85em; pointer-events: none;
            }
            .ptb-search-wrap .search-clear {
                position: absolute; right: 12px; top: 50%;
                transform: translateY(-50%); color: #94a3b8;
                font-size: 0.85em; cursor: pointer; display: none;
            }
            .ptb-search-wrap .search-clear:hover { color: #ef4444; }

            /* ── SEARCH DROPDOWN ─────────────────────────────────── */
            .search-dropdown {
                position: absolute; top: 100%; left: 0; right: 0; z-index: 9999;
                background: #ffffff; border: 1px solid #e2e8f0;
                border-radius: 0 0 12px 12px; max-height: 320px;
                overflow-y: auto; box-shadow: 0 12px 30px rgba(15,23,42,0.1);
                display: none;
            }
            .search-dropdown-item {
                padding: 11px 14px; cursor: pointer;
                border-bottom: 1px solid #f8fafc; font-size: 0.88em;
                color: #1e293b; transition: all 0.15s;
                display: flex; align-items: center; gap: 10px;
            }
            .search-dropdown-item:last-child { border-bottom: none; }
            .search-dropdown-item:hover { background: #f8fafc; padding-left: 18px; }
            .search-dropdown-item .sdi-dot {
                width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;
            }
            .search-dropdown-item .sdi-title { font-weight: normal; color: #0f172a; }
            .search-dropdown-item .sdi-date {
                margin-left: auto; font-size: 0.82em; color: #64748b;
                white-space: nowrap; font-variant-numeric: tabular-nums;
            }
            .search-dropdown-empty {
                padding: 20px; text-align: center; color: #94a3b8; font-size: 0.88em;
            }

            /* ── MAIN LAYOUT ─────────────────────────────────────── */
            .planning-container {
                display: flex; gap: 16px;
                height: calc(100vh - 200px);
            }

            /* ── SIDEBAR (Non-planifiés) ─────────────────────────── */
            #external-events {
                width: 300px; flex-shrink: 0;
                background: #ffffff; border-radius: 14px;
                padding: 16px; border: 1px solid #e2e8f0;
                display: flex; flex-direction: column;
                box-shadow: 0 1px 3px rgba(15,23,42,0.04);
                transition: all 0.3s ease;
            }
            .sidebar-title {
                font-size: 0.75rem; font-weight: 800;
                text-transform: uppercase; letter-spacing: 1px;
                color: #94a3b8; margin-bottom: 12px;
                display: flex; align-items: center; gap: 6px;
            }
            #external-events-list {
                flex-grow: 1; overflow-y: auto;
                padding-right: 4px; margin-top: 8px;
            }
            #external-events-list::-webkit-scrollbar { width: 4px; }
            #external-events-list::-webkit-scrollbar-thumb {
                background: #cbd5e1; border-radius: 4px;
            }

            .unplanned-card {
                background: #ffffff !important;
                border: 1px solid #e2e8f0 !important;
                border-left: 4px solid var(--primary-color) !important;
                color: #334155 !important;
                border-radius: 10px !important;
                padding: 12px 14px !important;
                margin-bottom: 10px !important;
                cursor: pointer !important;
                box-shadow: 0 1px 3px rgba(15,23,42,0.03) !important;
                transition: all 0.2s cubic-bezier(0.4,0,0.2,1) !important;
            }
            .unplanned-card:hover {
                transform: translateY(-2px) scale(1.01);
                box-shadow: 0 4px 12px var(--primary-rgba-select-focus) !important;
                border-color: var(--primary-border) !important;
            }
            .unplanned-card:active {
                cursor: move !important; transform: scale(0.98);
            }

            /* ── CALENDAR CONTAINER ──────────────────────────────── */
            #calendar-container {
                flex-grow: 1; background: #ffffff;
                border-radius: 14px; padding: 16px;
                border: 1px solid #e2e8f0; min-width: 0;
                box-shadow: 0 1px 3px rgba(15,23,42,0.04);
            }

            /* ── FULLCALENDAR OVERRIDES ───────────────────────────── */
            .fc-timegrid-col, .fc-daygrid-day,
            .fc-timegrid-slots td, .fc-timegrid-col-frame {
                background-color: transparent !important;
            }
            .fc-theme-standard td,
            .fc-theme-standard th,
            .fc-theme-standard .fc-scrollgrid {
                border-color: #e2e8f0 !important;
            }
            .fc-timegrid-col {
                border-left: 1px solid #e2e8f0 !important;
            }
            .fc-timegrid-cols td:last-child {
                border-right: 1px solid #e2e8f0 !important;
            }
            .fc-col-header-cell {
                background: #f8fafc !important;
                padding: 12px 0 !important;
                border-bottom: 2px solid #e2e8f0 !important;
            }
            .fc-col-header-cell-cushion {
                color: #475569 !important; font-weight: 700 !important;
                text-transform: uppercase; font-size: 0.76rem;
                letter-spacing: 0.6px; text-decoration: none !important;
            }
            .fc-day-today {
                background-color: var(--primary-rgba-bg-today) !important;
                position: relative;
            }
            .fc-day-today::before {
                content: ''; position: absolute;
                top: 0; left: 0; right: 0; height: 3px;
                background: linear-gradient(90deg, var(--primary-color), var(--primary-hover));
                z-index: 5;
            }
            .fc-timegrid-slot { height: 48px !important; }
            .fc-timegrid-slot-label {
                background-color: #f8fafc !important;
                font-size: 0.78rem; color: #64748b !important;
                font-weight: 600 !important;
                border-right: 1px solid #e2e8f0 !important;
            }
            .fc-button {
                background-color: #ffffff !important;
                border: 1px solid #e2e8f0 !important;
                color: #475569 !important; font-weight: 600 !important;
                font-size: 0.88rem !important; border-radius: 8px !important;
                padding: 7px 14px !important; transition: all 0.2s ease !important;
                box-shadow: none !important; text-transform: capitalize !important;
                font-family: inherit !important;
            }
            .fc-button:hover {
                background-color: #f8fafc !important;
                border-color: #cbd5e1 !important;
            }
            .fc-button-active {
                background-color: var(--primary-color) !important;
                border-color: var(--primary-color) !important;
                color: #ffffff !important;
            }
            .fc-button:focus, .fc-button:active {
                outline: none !important; box-shadow: none !important;
            }
            .fc-today-button:disabled {
                background-color: #f8fafc !important;
                border-color: #e2e8f0 !important;
                color: #cbd5e1 !important; opacity: 0.6 !important;
            }
            .fc-toolbar-title {
                font-family: 'Outfit', sans-serif !important;
                font-weight: 800 !important; color: #0f172a !important;
                letter-spacing: -0.5px !important; font-size: 1.4rem !important;
            }

            /* ── EVENT CARDS ──────────────────────────────────────── */
            #calendar .fc-event {
                background: transparent !important;
                border: none !important; box-shadow: none !important;
                padding: 0 !important; margin: 1px 0 !important;
            }
            .fc-event-custom {
                padding: 8px 10px; height: 100%;
                display: flex; flex-direction: column;
                position: relative; border-radius: 8px !important;
                box-shadow: 0 1px 4px rgba(15,23,42,0.06) !important;
                transition: all 0.2s ease !important;
                box-sizing: border-box;
                border-top: none !important;
                border-right: none !important;
                border-bottom: none !important;
            }
            .fc-event-custom:hover {
                transform: translateY(-1px);
                box-shadow: 0 4px 12px rgba(15,23,42,0.1) !important;
                z-index: 10;
            }
            .fc-event-custom .ev-title {
                font-weight: 700; font-size: 0.85rem;
                margin-bottom: 3px; line-height: 1.25;
                white-space: nowrap; overflow: hidden;
                text-overflow: ellipsis;
            }
            .fc-event-custom .ev-detail {
                font-size: 0.75rem; margin-bottom: 2px;
                font-weight: 600; line-height: 1.2;
                white-space: nowrap; overflow: hidden;
                text-overflow: ellipsis; opacity: 0.85;
            }
            .badge-confirmed {
                position: absolute; top: -5px; right: -5px;
                color: white; width: 18px; height: 18px;
                border-radius: 50%; display: flex;
                align-items: center; justify-content: center;
                border: 2px solid #fff;
                box-shadow: 0 2px 6px rgba(0,0,0,0.15);
                z-index: 10; font-size: 0.6rem;
            }

            /* Holiday events */
            .fc-event-holiday {
                background-color: rgba(245,158,11,0.07) !important;
                border: 1.5px dashed rgba(245,158,11,0.4) !important;
                color: #b45309 !important; padding: 5px 10px;
                border-radius: 6px; font-weight: 700;
                font-size: 0.8rem; width: 100%;
                box-sizing: border-box; text-overflow: ellipsis;
                overflow: hidden; white-space: nowrap;
                height: 100%; display: flex; align-items: center;
            }

            /* ── MODAL ────────────────────────────────────────────── */
            .planning-modal-overlay {
                position: fixed; top: 0; left: 0;
                width: 100vw; height: 100vh;
                background: rgba(15,23,42,0.5); display: none;
                align-items: center; justify-content: center;
                z-index: 10000; backdrop-filter: blur(6px);
                transition: all 0.3s ease;
            }
            .planning-modal {
                background: #ffffff; width: 95%; max-width: 1200px;
                max-height: 90vh; border-radius: 18px; padding: 0;
                box-shadow: 0 25px 60px rgba(15,23,42,0.2);
                overflow: hidden;
                animation: modalEntry 0.35s cubic-bezier(0.165,0.84,0.44,1);
                display: flex; flex-direction: column;
            }
            @keyframes modalEntry {
                from { transform: scale(0.96) translateY(16px); opacity: 0; }
                to { transform: scale(1) translateY(0); opacity: 1; }
            }

            /* Modal Header */
            .planning-modal-header {
                padding: 20px 32px; display: flex;
                justify-content: space-between; align-items: center;
                border-bottom: 1px solid #f1f5f9;
            }
            .planning-modal-header h3 {
                margin: 0; color: #0f172a;
                font-size: 1.35em; font-weight: 800;
                letter-spacing: -0.3px;
            }
            #pm-btn-close-x {
                background: none; border: none;
                font-size: 1.5rem; cursor: pointer;
                color: #94a3b8; transition: all 0.2s;
                width: 36px; height: 36px; border-radius: 8px;
                display: flex; align-items: center; justify-content: center;
            }
            #pm-btn-close-x:hover {
                color: #ef4444; background: #fef2f2;
            }

            /* Modal Tabs */
            .planning-modal-tabs {
                display: flex; background: #f1f5f9;
                padding: 4px; border-radius: 10px;
                margin: 8px 32px 12px 32px; gap: 3px;
            }
            .modal-tab {
                flex: 1; border: none !important;
                background: transparent !important;
                padding: 9px 16px !important; font-weight: 600 !important;
                color: #64748b !important; border-radius: 7px !important;
                transition: all 0.2s ease !important; cursor: pointer;
                text-align: center; font-size: 0.88rem;
                display: flex; align-items: center; justify-content: center;
                gap: 7px; box-shadow: none !important;
                margin-bottom: 0 !important; font-family: inherit;
            }
            .modal-tab.active {
                background: #ffffff !important;
                color: #0f172a !important;
                box-shadow: 0 1px 4px rgba(15,23,42,0.08) !important;
            }

            /* Title container */
            #pm-title-container {
                padding: 16px 32px 8px 32px;
                border-bottom: 1px solid #f1f5f9;
                background: #ffffff;
            }
            #pm-title-container .title-row {
                display: flex; align-items: center; gap: 10px;
            }
            #pm-title-container .title-row i {
                color: #94a3b8; font-size: 1.1rem;
            }
            #pm-title {
                font-size: 1.2rem; font-weight: 700; border: none;
                padding: 6px 0; background: transparent; outline: none;
                box-shadow: none; color: #0f172a; width: 100%;
                border-bottom: 2px solid transparent;
                transition: border-color 0.2s; font-family: inherit;
            }
            #pm-title:focus { border-color: var(--primary-color); }

            /* Modal Body */
            .planning-modal-body {
                padding: 24px 32px; overflow-y: auto;
                flex-grow: 1; min-height: 0;
            }

            /* ── VIEW MODE ────────────────────────────────────────── */
            .view-date-box {
                background: linear-gradient(135deg, var(--primary-bg-soft) 0%, var(--primary-bg-light) 100%);
                border-left: 4px solid var(--primary-color);
                padding: 16px 20px; border-radius: 12px;
                margin-bottom: 24px; display: flex;
                justify-content: space-between; align-items: center;
            }
            .view-date-box .vdb-date {
                color: var(--primary-dark); font-weight: 700; font-size: 1.15em;
            }
            .view-date-box .vdb-badge {
                background: #10b981; color: #fff;
                padding: 6px 16px; border-radius: 30px;
                font-size: 0.8em; font-weight: 700;
                letter-spacing: 0.5px;
                display: flex; align-items: center; gap: 6px;
            }

            .view-section { margin-bottom: 20px; }
            .view-label {
                font-size: 0.7rem; color: #94a3b8;
                text-transform: uppercase; font-weight: 700;
                margin-bottom: 8px; letter-spacing: 0.8px;
                display: flex; align-items: center; gap: 6px;
            }
            .view-value {
                font-size: 1.05rem; color: #1e293b;
                line-height: 1.6; font-weight: 500;
            }
            .view-card {
                background: #f8fafc; border: 1px solid #e2e8f0;
                border-radius: 12px; padding: 16px;
            }
            .view-info-grid {
                display: grid; grid-template-columns: 1fr 1fr;
                gap: 12px;
            }
            .view-info-item .vii-label {
                font-size: 0.68rem; color: #94a3b8;
                text-transform: uppercase; font-weight: 700;
                letter-spacing: 0.5px; margin-bottom: 3px;
            }
            .view-info-item .vii-value {
                font-size: 0.95rem; color: #1e293b;
                font-weight: 600; display: flex;
                align-items: center; gap: 6px;
            }
            .view-info-item .vii-value i {
                color: var(--primary-color); width: 14px; text-align: center;
                font-size: 0.85em;
            }
            .view-badges {
                display: flex; gap: 8px; flex-wrap: wrap;
                margin-top: 12px;
            }
            .view-badge {
                padding: 4px 12px; border-radius: 6px;
                font-weight: 700; font-size: 0.8em;
                display: inline-flex; align-items: center; gap: 5px;
            }
            .view-badge-type {
                background: var(--primary-bg-light); color: var(--primary-dark);
            }
            .view-badge-team {
                background: #fef3c7; color: #d97706;
            }

            .view-notes-box {
                white-space: pre-line; font-style: normal;
                color: #334155; background: #f8fafc;
                padding: 16px 20px; border-radius: 12px;
                border: 1px solid #e2e8f0; line-height: 1.7;
                font-size: 0.95rem;
            }

            .view-access-card {
                margin-top: 12px; padding: 12px 16px;
                background: #fffbeb; border: 1px solid #fde68a;
                border-radius: 10px; font-size: 0.9em;
            }
            .view-access-card div {
                margin-bottom: 5px;
            }
            .view-access-card div:last-child { margin-bottom: 0; }

            .action-pills { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
            .action-pill {
                display: inline-flex; align-items: center; gap: 7px;
                padding: 8px 16px; border-radius: 8px;
                font-size: 0.85em; font-weight: 600;
                text-decoration: none; transition: all 0.2s ease;
            }
            .pill-map {
                background: #ecfdf5; color: #059669;
                border: 1px solid rgba(5,150,105,0.15);
            }
            .pill-map:hover {
                background: #059669; color: #fff;
                transform: translateY(-1px);
            }
            .pill-tel {
                background: #eff6ff; color: #2563eb;
                border: 1px solid rgba(37,99,235,0.15);
            }
            .pill-tel:hover {
                background: #2563eb; color: #fff;
                transform: translateY(-1px);
            }

            /* ── FORM MODE ────────────────────────────────────────── */
            .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
            .form-group-full { grid-column: span 2; }
            .planning-modal input,
            .planning-modal textarea,
            .planning-modal select {
                width: 100%; padding: 10px 12px;
                border: 1px solid #e2e8f0; border-radius: 8px;
                font-size: 0.92rem; background: #f8fafc;
                transition: all 0.2s ease; font-family: inherit;
                color: #0f172a; box-sizing: border-box;
            }
            .planning-modal input:focus,
            .planning-modal textarea:focus,
            .planning-modal select:focus {
                border-color: var(--primary-color); outline: none;
                box-shadow: 0 0 0 3px var(--primary-rgba-input-focus);
                background: #ffffff;
            }
            .planning-modal label {
                display: block; margin-bottom: 5px;
                color: #64748b; font-size: 0.72rem;
                font-weight: 700; text-transform: uppercase;
                letter-spacing: 0.5px;
            }

            /* ── EDIT MODE: Client Summary Card ──────────────────── */
            .edit-client-summary {
                background: linear-gradient(135deg, #f0fdf4 0%, #ecfdf5 100%);
                border: 1px solid #bbf7d0; border-radius: 12px;
                padding: 14px 18px; margin-bottom: 20px;
                display: flex; align-items: center;
                justify-content: space-between; gap: 12px;
            }
            .edit-client-summary .ecs-info {
                display: flex; align-items: center; gap: 12px;
                flex: 1; min-width: 0;
            }
            .edit-client-summary .ecs-avatar {
                width: 40px; height: 40px; border-radius: 10px;
                background: #10b981; color: #fff;
                display: flex; align-items: center; justify-content: center;
                font-weight: 800; font-size: 1rem; flex-shrink: 0;
            }
            .edit-client-summary .ecs-details {
                min-width: 0;
            }
            .edit-client-summary .ecs-name {
                font-weight: 700; color: #065f46; font-size: 0.95rem;
                white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
            }
            .edit-client-summary .ecs-meta {
                font-size: 0.78rem; color: #64748b; margin-top: 2px;
                white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
            }
            .edit-client-summary .ecs-actions {
                display: flex; gap: 6px; flex-shrink: 0;
            }
            .ecs-btn {
                background: #fff; border: 1px solid #d1d5db;
                padding: 6px 12px; border-radius: 7px;
                font-size: 0.78rem; font-weight: 600;
                color: #475569; cursor: pointer;
                transition: all 0.2s; font-family: inherit;
                display: inline-flex; align-items: center; gap: 5px;
            }
            .ecs-btn:hover {
                background: #f8fafc; border-color: var(--primary-color);
                color: var(--primary-color);
            }
            .edit-client-panel {
                background: #f8fafc; border: 1px solid #e2e8f0;
                border-radius: 12px; padding: 18px;
                margin-bottom: 20px;
                animation: slideDownSmooth 0.25s ease;
            }
            @keyframes slideDownSmooth {
                from { opacity: 0; transform: translateY(-8px); max-height: 0; }
                to { opacity: 1; transform: translateY(0); max-height: 800px; }
            }
            .edit-section-divider {
                border: none; border-top: 1px solid #e2e8f0;
                margin: 20px 0;
            }

            /* Option cards (toggles) */
            .option-card {
                background: #ffffff; border: 1px solid #e2e8f0;
                padding: 11px 16px; border-radius: 10px;
                display: flex; align-items: center;
                justify-content: space-between;
                transition: all 0.2s ease; cursor: pointer;
            }
            .option-card:hover {
                border-color: #cbd5e1; background: #f8fafc;
            }
            .option-card.active-card {
                border-color: var(--primary-color);
                box-shadow: 0 0 0 2px var(--primary-rgba-input-focus);
            }
            .option-card.active-card-green {
                border-color: #10b981;
                box-shadow: 0 0 0 2px rgba(16,185,129,0.08);
            }

            /* Toggle switch */
            .switch {
                position: relative; display: inline-block;
                width: 42px; height: 22px; flex-shrink: 0;
            }
            .switch input { opacity: 0; width: 0; height: 0; }
            .slider {
                position: absolute; cursor: pointer;
                top: 0; left: 0; right: 0; bottom: 0;
                background-color: #e2e8f0;
                transition: .3s ease; border-radius: 22px;
            }
            .slider:before {
                position: absolute; content: "";
                height: 16px; width: 16px; left: 3px; bottom: 3px;
                background-color: white; transition: .3s ease;
                border-radius: 50%;
                box-shadow: 0 1px 3px rgba(15,23,42,0.15);
            }
            .switch input:checked + .slider { background-color: var(--primary-color); }
            .switch.switch-green input:checked + .slider { background-color: #10b981; }
            .switch input:checked + .slider:before { transform: translateX(20px); }

            /* Intervention columns */
            .intervention-columns-grid {
                display: grid; grid-template-columns: 1.15fr 0.85fr;
                gap: 20px;
            }
            .intervention-column {
                display: flex; flex-direction: column; gap: 16px;
            }
            .intervention-section-card {
                background: #ffffff; border: 1px solid #e2e8f0;
                border-radius: 14px; padding: 18px;
                box-shadow: 0 1px 3px rgba(15,23,42,0.03);
            }
            .intervention-section-title {
                font-size: 0.78rem; font-weight: 800;
                text-transform: uppercase; color: #475569;
                letter-spacing: 0.8px; margin-bottom: 14px;
                display: flex; align-items: center; gap: 8px;
                border-bottom: 1px solid #f1f5f9;
                padding-bottom: 8px;
            }

            /* Client search in form */
            .pm-autocomplete-wrapper { position: relative; }
            .client-search-dropdown {
                position: absolute; top: 100%; left: 0; right: 0;
                z-index: 10005; background: #ffffff;
                border: 1px solid #e2e8f0; border-radius: 10px;
                max-height: 240px; overflow-y: auto;
                box-shadow: 0 8px 24px rgba(15,23,42,0.1);
                display: none; margin-top: 4px;
            }
            .client-search-item {
                padding: 10px 14px; cursor: pointer;
                border-bottom: 1px solid #f8fafc;
                transition: background 0.15s ease;
            }
            .client-search-item:last-child { border-bottom: none; }
            .client-search-item:hover { background: #f8fafc; }
            .client-search-item .csi-title {
                font-weight: 700; color: #0f172a; font-size: 0.92rem;
            }
            .client-search-item .csi-details {
                font-size: 0.78rem; color: #64748b; margin-top: 3px;
            }

            /* Client info grid in form */
            .client-fields-card {
                display: grid; grid-template-columns: 1fr 1fr;
                gap: 16px; background: #f8fafc;
                border: 1px solid #e2e8f0; border-radius: 12px;
                padding: 20px; position: relative;
            }

            /* Color picker (hidden by default, auto via team) */
            .color-picker { display: none; }

            /* ── TEAM SETTINGS MODAL ──────────────────────────────── */
            .team-settings-overlay {
                position: fixed; top: 0; left: 0;
                width: 100vw; height: 100vh;
                background: rgba(15,23,42,0.4);
                display: none; align-items: center; justify-content: center;
                z-index: 10001; backdrop-filter: blur(4px);
            }
            .team-settings-modal {
                background: #fff; border-radius: 16px;
                padding: 28px; width: 420px; max-width: 95%;
                box-shadow: 0 20px 50px rgba(15,23,42,0.2);
                animation: modalEntry 0.3s ease;
            }
            .team-settings-modal h3 {
                margin: 0 0 20px 0; font-size: 1.15rem;
                font-weight: 800; color: #0f172a;
                display: flex; align-items: center; gap: 10px;
            }
            .team-row {
                display: flex; align-items: center; gap: 10px;
                margin-bottom: 12px;
            }
            .team-row .team-color-dot {
                width: 28px; height: 28px; border-radius: 8px;
                flex-shrink: 0; border: 2px solid rgba(0,0,0,0.08);
            }
            .team-row input {
                flex: 1; padding: 9px 12px; border: 1px solid #e2e8f0;
                border-radius: 8px; font-size: 0.92rem;
                font-family: inherit; font-weight: 600;
            }
            .team-row input:focus {
                border-color: var(--primary-color); outline: none;
                box-shadow: 0 0 0 3px var(--primary-rgba-select-focus);
            }
            .team-settings-actions {
                display: flex; justify-content: flex-end;
                gap: 10px; margin-top: 20px;
            }

            /* ── MODAL FOOTER ─────────────────────────────────────── */
            .planning-modal-footer {
                padding: 16px 32px; border-top: 1px solid #f1f5f9;
                display: flex; justify-content: space-between;
                align-items: center; background: #fafbfc;
            }
            .pm-footer-btn {
                padding: 10px 24px; border: none;
                border-radius: 10px; cursor: pointer;
                font-weight: 700; font-size: 0.9rem;
                font-family: inherit; transition: all 0.2s;
                display: inline-flex; align-items: center; gap: 7px;
            }
            .pm-footer-btn:hover { transform: translateY(-1px); }
            .pm-btn-cancel {
                background: #f1f5f9; color: #334155;
                border: 1.5px solid #cbd5e1;
            }
            .pm-btn-cancel:hover { 
                background: #e2e8f0; 
                border-color: #94a3b8;
                color: #0f172a;
            }
            .pm-btn-save {
                background: linear-gradient(135deg, var(--primary-color), var(--primary-hover));
                color: #fff; box-shadow: 0 4px 12px var(--primary-rgba-shadow);
            }
            .pm-btn-save:hover {
                box-shadow: 0 6px 16px var(--primary-rgba-shadow-hover);
            }
            .pm-btn-edit {
                background: var(--primary-color); color: #fff;
                box-shadow: 0 4px 12px var(--primary-rgba-shadow-light);
            }
            .pm-btn-edit:hover {
                box-shadow: 0 6px 16px var(--primary-rgba-shadow-light-hover);
            }
            .pm-btn-danger {
                background: #fff; color: #ef4444;
                border: 1.5px solid #fecaca;
            }
            .pm-btn-danger:hover {
                background: #fef2f2;
                box-shadow: 0 4px 10px rgba(239,68,68,0.1);
            }
            .pm-btn-duplicate {
                background: var(--primary-bg-light); color: var(--primary-color);
                border: 1.5px solid var(--primary-border);
            }
            .pm-btn-duplicate:hover { background: var(--primary-border); }

            /* ── DOCUMENTS SECTION ────────────────────────────────── */
            .docs-header {
                display: flex; justify-content: space-between;
                align-items: center; margin-bottom: 12px;
            }
            .btn-attach {
                background: var(--primary-color); color: #fff;
                border: none; padding: 8px 16px;
                border-radius: 8px; font-size: 0.85rem;
                font-weight: 700; cursor: pointer;
                display: inline-flex; align-items: center; gap: 6px;
                font-family: inherit; transition: all 0.2s;
            }
            .btn-attach:hover {
                background: var(--primary-dark);
                transform: translateY(-1px);
            }

            /* ── RESPONSIVE ───────────────────────────────────────── */
            @media (max-width: 768px) {
                .planning-modal { width: 100%; height: 100%; border-radius: 0; max-height: 100vh; }
                .planning-modal-body { padding: 20px; }
                .planning-modal-header { padding: 16px 20px; }
                .planning-modal-footer { padding: 12px 20px; }
                .planning-modal-tabs { margin: 8px 20px 12px 20px; }
                #pm-title-container { padding: 12px 20px 8px; }
                .form-grid { grid-template-columns: 1fr; gap: 16px; }
                .form-group-full { grid-column: span 1; }
                .fc-header-toolbar { flex-direction: column; gap: 10px; align-items: stretch; }
                .fc-toolbar-chunk { display: flex; justify-content: center; }
                .view-date-box { flex-direction: column; align-items: flex-start; gap: 10px; }
                .action-pills { flex-direction: column; width: 100%; }
                .action-pill { justify-content: center; width: 100%; }
                #external-events { display: none; width: 100% !important; }
                .intervention-columns-grid { grid-template-columns: 1fr; }
                .view-info-grid { grid-template-columns: 1fr; }
                .ptb-search-wrap { width: 100%; }
                .planning-toolbar { gap: 8px; }
            }