.table-hidden-by-filter {
    display: none;
}

/* Modern Dark Theme for Chronos - Refined */

:root {
    --default-background: rgba(228, 233, 239, 1);
    --default-color: rgba(51, 56, 61, 1);

    --gray-background: rgba(229, 228, 223, 1);
    --gray-color: rgba(102, 101, 97, 1);

    --brown-background: rgba(241, 223, 215, 1);
    --brown-color: rgba(77, 63, 55, 1);

    --orange-background: rgba(247, 220, 202, 1);
    --orange-color: rgba(106, 78, 57, 1);

    --green-background: rgba(219, 237, 222, 1);
    --green-color: rgba(36, 49, 45, 1);

    --blue-background: rgba(198, 224, 241, 1);
    --blue-color: rgba(47, 75, 94, 1);

    --red-background: rgba(236, 212, 215, 1);
    --red-color: rgba(95, 25, 38, 1);

    --yellow-background: rgba(248, 230, 183, 1);
    --yellow-color: rgba(149, 129, 94, 1);

    --purple-background: rgba(233, 220, 238, 1);
    --purple-color: rgba(74, 56, 86, 1);

    --pink-background: rgba(248, 222, 233, 1);
    --pink-color: rgba(112, 81, 95, 1);

    --yellow-background: rgba(234, 235, 184, 1);
    --yellow-color: rgba(77, 63, 55, 1);

    /* Core Palette */
    --background-dark: #1e1e1e; /* Very dark grey */
    --background-medium: #282828; /* Slightly lighter dark grey for sidebar/headers */
    --background-medium-lighted: #363636; /* Slightly lighter dark grey for sidebar/headers for hover */
    --background-light: #333333; /* Even lighter for cards/elements */
    --text-light: #e0e0e0; /* Light grey for main text */
    --text-medium: #b0b0b0; /* Medium grey for secondary text */
    --text-dark: #808080; /* Dark grey for subtle text */

    /* Accent Colors (more vibrant, but professional) */
    --accent-primary: #007bff; /* Primary action blue */
    --accent-warning: #ffc107; /* Yellow for warning */
    --accent-danger: #dc3545; /* Red for danger */
    --accent-info: #17a2b8; /* Cyan for info */
    --accent-purple: #6f42c1; /* Purple for validation/special */
    --accent-orange: #fd7e14; /* Orange for wait/high priority */

    /* Borders & Shadows */
    --border-color-subtle: rgba(255, 255, 255, 0.08); /* Very subtle light border */
    --border-color-medium: rgba(255, 255, 255, 0.15); /* Slightly more visible border */
    --shadow-color-dark: rgba(0, 0, 0, 0.4); /* Darker, more pronounced shadow */
    --shadow-color-light: rgba(0, 0, 0, 0.2); /* Lighter shadow for subtle depth */
}

/* --- General Body & Layout --- */
body {
    background-color: var(--background-dark);
    color: var(--text-light);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
    font-size: 15px; /* Slightly larger base font */
}

aside.sidebar { /* Specific for sidebar background */
    background-color: var(--background-medium);
    color: var(--text-light);
    border-right: 1px solid var(--border-color-medium);
}

/* --- Notifications --- */
.notification {
    padding: 1rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 15px var(--shadow-color-dark);
    color: white;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.3s ease-out, transform 0.3s ease-out;
    font-weight: 500;
}
.notification.show { opacity: 1; transform: translateY(0); }
.notification.success { background-color: rgba(76, 175, 80, 0.8); border: 1px solid #4CAF50; }
.notification.error { background-color: rgba(220, 53, 69, 0.8); border: 1px solid #dc3545; }
.notification.info { background-color: rgba(23, 162, 184, 0.8); border: 1px solid #17a2b8; }

/* --- Text Colors --- */
.deadline-text { color: var(--text-medium); }
.edit-text { color: rgba(89, 117, 147, 1); }

/* --- Login Card Specific --- */
.login-card {
    background-color: var(--background-light);
    border: 1px solid var(--border-color-medium);
    border-radius: 1rem;
    box-shadow: 0 10px 30px var(--shadow-color-dark);
    color: var(--text-light);
}
.login-card h2 {
    color: var(--text-light);
}
.form-control {
    background-color: var(--background-medium);
    border: 1px solid var(--border-color-subtle);
    color: var(--text-light);
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
}
.form-control::placeholder { color: var(--text-medium); }
.btn-primary {
    background: linear-gradient(to right, var(--accent-primary), var(--accent-purple));
    border: none;
    color: white;
    font-weight: 600;
    border-radius: 0.5rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px var(--shadow-color-dark);
}
#error-message {
    color: var(--accent-danger);
}

/* --- Drag and Drop --- */
.drag-target-highlight {
    outline: 2px dashed var(--accent-primary);
    outline-offset: -2px;
    background-color: rgba(0, 123, 255, 0.1);
}
.task-drop-hover {
    background-color: rgba(0, 123, 255, 0.2) !important;
}

/* --- Priority & Status Tags --- */
.priority, .status {
    border-radius: 10px;
    padding: 3px 8px;
    font-size: 0.85rem;
    font-weight: 600;
    display: inline-block;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.priority { border-radius: 10px; padding-left: 3px; padding-right: 3px; }
.priority_urgent    { background-color: var(--red-background); color: var(--red-color); } /* rouge clair */
.priority_haut    { background-color: var(--orange-background); color: var(--orange-color); } /* rouge clair */
.priority_moyen  { background-color: var(--blue-background); color: var(--blue-color); } /* jaune clair */
.priority_bas    { background-color: var(--green-background); color: var(--green-color); } /* vert clair */


/* Couleurs pour les statuts */
.status { border-radius: 10px; padding-left: 3px; padding-right: 3px; }
.status_not_started    { background-color: var(--default-background); color: var(--default-color); }
.status_in_progress   { background-color: var(--blue-background); color: var(--blue-color); }
.status_wait    { background-color: var(--orange-background); color: var(--orange-color); }
.status_done    { background-color: var(--green-background); color: var(--green-color); }
.status_is_waiting    { background-color: var(--yellow-background); color: var(--yellow-color); }
.status_is_validation    { background-color: var(--purple-background); color: var(--purple-color); }
.status_archived    { background-color: var(--gray-background); color: var(--gray-color); }


.delete-button { background-color: rgba(115, 27, 38, 1); color: rgba(239, 239, 239, 1); }
.delete-button:hover { background-color: rgba(91, 22, 30, 1); color: rgba(239, 239, 239, 1); }
.save-button { background-color: rgba(42, 80, 163, 1); color: rgba(239, 239, 239, 1); }
.save-button:hover { background-color: rgba(31, 58, 119, 1); color: rgba(239, 239, 239, 1); }
.exec-button { background-color: rgba(29, 111, 59, 1); color: rgba(239, 239, 239, 1); }
.exec-button:hover { background-color: rgba(20, 79,4 1, 1); color: rgba(239, 239, 239, 1); }
.spe-button { background-color: rgba(84, 63, 117, 1); color: rgba(239, 239, 239, 1); }
.spe-button:hover { background-color: rgba(66, 49, 93, 1); color: rgba(239, 239, 239, 1); }
.close-button { background-color: rgba(84, 63, 117, 0); color: rgba(197, 197, 197, 1); }
.close-button:hover { background-color: rgba(84, 63, 117, 0); color: rgba(170, 170, 170, 1); border: 1px solid rgba(170, 170, 170, 1); }

/*.menu-button { 
    background-color: rgba(35, 43, 38, 1);
    color: rgba(239, 239, 239, 1);
    border: 1px solid var(--border-color-subtle);
}
.menu-button:hover { background-color: rgba(14, 51, 90, 1); color: rgba(239, 239, 239, 1); }
*/
.separator { border-top: 1px solid rgba(114, 114, 114, 1); margin-top: 20px; }

.titre-text { color: rgba(114, 114, 114, 1); }

.menu-button,
.filter-button {
    background-color: var(--background-medium);
    color: var(--text-light);
    border: 1px solid var(--border-color-subtle);
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}
.menu-button:hover,
.filter-button:hover {
    background-color: var(--background-light);
    border-color: var(--accent-primary);
}

/* --- General Styling for Cells --- */
.status-cell, .priority-cell, .tag-cell {
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-weight: 500;
    display: inline-block;
}
.status-cell { border-radius: 1.50rem; } /* Pill shape */

/* --- Table Styling --- */
.table_div {
    margin-top: 20px;
    color: var(--text-light);
    border-radius: 0.75rem;
    box-shadow: 0 10px 30px var(--shadow-color-dark);
    border-top: 1px solid var(--border-color-medium);
    border-left: 1px solid var(--border-color-medium);
    border-right: 1px solid var(--border-color-medium);
    border-bottom: none;
    overflow: hidden;
    z-index: 1; /* Added to ensure proper stacking context */
}
.table_div thead {
    color: var(--text-light);
    font-weight: 600;
    border-bottom: 1px solid #5d5d5d;
}
.table_div thead th {
    /*background-color: #212121;*/
    overflow: hidden;
    background-clip: padding-box; /* Explicitly clip background to padding box */
}

.task-table {
    border-collapse: separate;
    border-spacing: 0;
    /*border: 1px solid var(--border-color-medium);*/
}
.table_div tbody {
    /*background-color: #393939;*/
    color: var(--text-light);
}
.table_div thead tr:first-child th:first-child { border-top-left-radius: 0.75rem; }
.table_div thead .last-visible-th-right { border-top-right-radius: 0.75rem; }

.table_div tbody .last-visible-row td:first-child:not([style*="display: none"]) { border-bottom-left-radius: 0.75rem; }
.table_div tbody .last-visible-cell-right { border-bottom-right-radius: 0.75rem; }
.first-visible-cell-right { border-top-right-radius: 0.75rem; background-clip: padding-box; overflow: hidden; }

/* Table Row Borders */
.table_div tbody tr {
    border-bottom: 1px solid var(--border-color-subtle);
}
.table_div tbody tr:last-child {
    border-bottom: none;
}
.table_div tbody .last-visible-row {
    border-bottom: none;
}

/* --- Progress Bar --- */
.progress-bar {
background-color: rgba(70, 75, 73, 0.8); /* Vert émeraude par exemple */
}

.progress-bar-percent {
background-color: #10b981; /* Vert émeraude par exemple */
}

/* --- Dropdown Menus --- */
.dropdown-menu {
    position: absolute;
    z-index: 9999; /* Increased z-index */
    background-color: var(--background-medium);
    color: var(--text-light);
    border-radius: 0.5rem;
    box-shadow: 0 4px 15px var(--shadow-color-dark);
    overflow: hidden;
    border: 1px solid #ffffff7a;
}

/* Ensure table cells containing dropdowns create a positioning context */
.task-table td {
    position: relative;
}
.dropdown-option:hover {
    background-color: var(--background-light);
    color: var(--accent-primary);
}
.dropdown-option {
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* --- Task Levels --- */
.level-0 {
    background-color: var(--background-medium);
    border-top: 1px solid var(--border-color-medium);
    border-bottom: 1px solid var(--border-color-medium);
}
.level-1 {
    background-color: var(--background-light);
    border-top: 1px solid var(--border-color-subtle);
    border-bottom: 1px solid var(--border-color-subtle);
}
tr.level-1 + tr.level-2 { border-top: none; }
.level-2, .level-3, .level-4, .level-5 {
    background-color: rgba(var(--accent-primary), 0.05);
    border-top: 1px solid rgba(var(--border-color-subtle), 0.5);
    border-bottom: 1px solid rgba(var(--border-color-subtle), 0.5);
}
tbody tr:first-child { border-top: none; }

/* --- Buttons --- */
.add-button {
    background-color: var(--accent-primary);
    color: white;
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    font-weight: 600;
    transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.add-button:hover {
    background-color: var(--accent-purple);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px var(--shadow-color-dark);
}

/* --- Modal Content --- */
/*#modal-scroll-container {
    overflow: visible !important;
}*/

#modal-content select,
#modal-content textarea,
#modal-content input[type="text"],
#modal-content input[type="date"],
#modal-content input[type="time"],
#modal-content input[type="range"],
#modal-content input[type="number"],
#modal-content input[type="password"] {
    background-color: var(--background-medium);
    border: 1px solid var(--border-color-medium);
    color: var(--text-light);
    border-radius: 0.5rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.codemirror-editor {
    color: var(--text-light);
    border: 1px solid var(--border-color-medium);
    border-radius: 0.5rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#modal-content input[type="range"] {
    padding: 0;
}

#progress-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 8px;
    border-radius: 5px;
    background: var(--background-light);
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
    margin-top: 5px;
}

#progress-slider:hover {
    opacity: 1;
}

#progress-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--accent-primary);
    cursor: pointer;
}

#progress-slider::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--accent-primary);
    cursor: pointer;
}

#modal-content input:focus,
#modal-content textarea:focus,
#modal-content select:focus {
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 2px rgba(var(--accent-primary), 0.3);
    outline: none;
}
#modal-content input::placeholder,
#modal-content textarea::placeholder {
    color: var(--text-medium);
}

#add-attribute {
    color: var(--text-light);
}

#modal-content h3,
#modal-content label {
    color: var(--text-light);
    font-weight: 500;
}

/* --- Daily Report Specific --- */
#daily-textarea {
    background-color: var(--background-medium);
    color: var(--text-light);
    border: 1px solid var(--border-color-medium);
    border-radius: 0.5rem;
}
#daily-render {
    color: var(--text-light);
    border: 1px solid var(--border-color-medium);
    border-radius: 0.5rem;
}



/* --- Calendar Specific --- */
.calendar-section {
    /*background-color: var(--background-medium);*/
    border-radius: 0.75rem;
    /*padding: 1rem;*/
    box-shadow: 0 4px 15px var(--shadow-color-dark);
    border: 1px solid var(--border-color-medium);
}
.calendar-section h3 {
    color: var(--text-light);
}

#calendar-container {
    border-radius: 0.75rem;
}
/*
.calendar-chip-both { background-color: var(--accent-purple); }
.calendar-chip-scheduled { background-color: var(--accent-primary); }
.calendar-chip-deadline { background-color: var(--accent-danger); }
.calendar-chip-day { background-color: var(--accent-warning); color: var(--background-dark) !important; }
*/

.urgent-tasks-section {
    background-color: #2d3748;
    border-radius: 0.5rem;
    border: 1px solid var(--border-color-medium);
}

.task-line {
    border-radius: 20px;
}

.gemini-dropdown-force-top {
    position: fixed !important;
    z-index: 999999 !important; /* Even higher z-index */
    transform: translateZ(0) !important; /* Force GPU acceleration */
    mix-blend-mode: normal !important; /* Ensure normal blending behavior */
    contain: layout style paint !important; /* Force element isolation for rendering */
}

/* Style for inline-flex items to add spacing between icon and text */
.inline-flex.items-center.space-x-2 > svg + span,
.inline-flex.items-center.space-x-2 > span + svg {
    margin-left: 0.5rem; /* Adjust as needed */
}

.choices__inner {
    border: none !important;
}

.choices__inner,
.choices {
    height: 38px !important;
    border-radius: 0.5em !important;
    background-color: var(--background-medium) !important;
}

.choices__input {
    background-color: var(--background-medium) !important;
}

.choices,
.choices__list--dropdown {
    background-color: var(--background-medium) !important;
    border: 1px solid var(--border-color-medium) !important;
}

.choices__item.is-highlighted {
    background-color: var(--background-medium-lighted) !important;
}


.category_list_item {
    background-color: var(--background-medium);
    border: 1px solid var(--border-color-medium) !important;
    border-radius: 0.5em !important;
}

.CodeMirror-wrap {
    border-radius: 0.5em !important;
    border: 1px solid var(--border-color-medium) !important;
    padding: 2px !important;
    color: var(--text-light);
}

.CodeMirror {
    height: 250px !important;
}

.script_block {
    height: 200px !important;
}

/* Assurez-vous que l’addon hint a un z-index élevé */
.CodeMirror-hints {
    position: fixed !important;
    z-index: 2000 !important; /* ou plus selon le z-index de votre modal */
}


.modal_dropdown {
    border-radius: 0.5em !important;
    height: 38px !important;
    background-color: var(--background-medium) !important;
    border: 1px solid var(--border-color-medium) !important;
}

.modal_dropdown_list {
    border: 1px solid var(--border-color-medium) !important;
    background-color: var(--background-medium) !important;
}

.modal_dropdown_item {
    padding-left: 6px !important;
    font-size: 12.2px !important;
}

.modal_dropdown_item:hover {
    background-color: var(--background-medium-lighted) !important;
}

.rounded_list{
    border-radius: 5px;
    overflow: hidden;
}

.rounded_list > *:first-child {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.rounded_list > *:last-child {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.rounded_list > * {
    display: block;
    border-radius: 0; /* Pour homogénéiser au cas où un style existe déjà */
}

.table-order-item {
    background-color: rgba(74, 74, 83, 1);
    color: var(--text-light);
}

#emoji-container em-emoji-picker {
max-height: 400px;
overflow-y: auto;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0,0,0,0.3);
background-color: rgba(255, 255, 255, 1);
}

#emoji-btn,
#icon-btn {
background-color: rgba(255, 255, 255, 0);
border: none;
margin-bottom: 1px;
}

#task-modal thead {
    background-color: #212121;
}

#task-modal td {
    border-color: #3e3e3f;
}

.daily_task_div {
    background-color: rgba(17, 24, 39, 0.38);
}

.daily_task_div h2 {
    color: rgba(255, 255, 255, 0.8);
    background-color: rgba(32, 41, 56, 0.82);
    border-radius: 25px;
    padding: 7px;
    margin: 0 auto;
    margin-bottom: 35px;
    width: 50%;
}


.script-output {
    background-color: rgb(39, 40, 34);
}