/* Modules métier conservés de la version 0.7.6.1 */
.icon-danger {border: 0; background: transparent; color: var(--color-danger); font-size: 21px; line-height: 1;}

.inline-form form > label, .upload-form label {margin-bottom: 12px;}

.upload-form {display: grid; grid-template-columns: 1fr 2fr auto; align-items: end; gap: 9px; margin-top: 14px;}

.upload-form label {margin: 0;}

.offer-editor {padding: 16px; margin-bottom: 13px; border: 1px solid var(--color-border-strong); border-radius: 12px; background: var(--color-bg-subtle);}

.offer-editor-head {display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 13px;}

.offer-editor > label {margin-top: 12px;}

.offer-cards {display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px;}

.selected-ribbon {position: absolute; top: 0; right: 0; padding: 5px 10px; background: var(--red); color: white; font-size: 10px; font-weight: 850;}

.offer-prices {display: flex; flex-wrap: wrap; gap: 12px; margin: 12px 0;}

.offer-prices strong {color: var(--color-text-strong);}

.offer-prices small {color: var(--muted); margin-left: 4px;}

.auth-security {margin: 18px 0 0; text-align: center; color: var(--muted); font-size: 11px;}

@media (max-width: 1150px) {
.client-cards, .offer-cards {grid-template-columns: repeat(2, minmax(0,1fr));}
}

@media (max-width: 590px) {
.stats-grid, .grid-4, .client-cards, .offer-cards, .form-grid, .form-grid.compact {grid-template-columns: 1fr;}
.upload-form {grid-template-columns: 1fr;}
}

.rich-editor {min-height: 170px; padding: 14px; background: var(--color-bg-subtle); border: 1px solid var(--color-border-strong); border-radius: 0 0 9px 9px; color: var(--color-text); line-height: 1.65; outline: none;}

.rich-editor:focus {border-color: var(--red-bright); box-shadow: 0 0 0 3px rgba(214,0,0,.12);}

.rich-editor h2,.rich-editor h3 {margin: 14px 0 8px;}

.rich-toolbar {display: flex; flex-wrap: wrap; gap: 4px; max-width: 100%; overflow-x: auto; padding: 7px; border: 1px solid var(--color-border); border-bottom: 0; background: var(--color-surface-raised); border-radius: 9px 9px 0 0;}

.rich-toolbar button {min-width: 34px; padding: 6px 8px; border: 1px solid var(--color-border-strong); border-radius: 6px; background: var(--color-surface-soft); color: var(--color-text);}

.rich-toolbar button:hover {background: var(--color-surface-hover);}

.document-block {margin-bottom: 16px; border: 1px solid var(--color-border); border-radius: 11px; overflow: hidden; background: var(--color-bg-subtle);}

.document-block-head {display: flex; justify-content: space-between; align-items: center; padding: 11px 13px; background: var(--color-surface);}

.variable-list {display: flex; gap: 7px; flex-wrap: wrap;}

.variable-chip {border: 1px solid var(--color-border-strong); border-radius: 999px; padding: 6px 10px; background: var(--color-surface-raised); color: var(--muted-strong); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px;}

.service-picker {display: grid; grid-template-columns: 1fr auto; gap: 8px;}

.rich-output {overflow-wrap: anywhere;}

.rich-output table {width: 100%; border-collapse: collapse;}

.rich-output th,.rich-output td {border: 1px solid var(--color-border-strong); padding: 7px;}

.timer-box {display: flex; gap: 6px; align-items: center;}

.timer-box > span {min-width: 86px; padding: 8px 10px; border-radius: 7px; background: var(--color-bg); font-family: ui-monospace, monospace; font-weight: 800; text-align: center;}

.task-list {display: grid; gap: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface);}

.date-separator {margin: 20px 0 7px!important; color: var(--color-text); font-size: 13px;}

.checklist {display: grid; gap: 8px;}

.check-row {display: grid; grid-template-columns: minmax(220px,1fr) 180px minmax(240px,1fr); gap: 10px; align-items: center; padding: 10px; border: 1px solid var(--color-border); border-radius: 9px; background: var(--color-bg-subtle);}

.global-search-page {display: flex; gap: 8px; margin-bottom: 18px;}

.global-search-page input {font-size: 16px;}

.search-result {display: flex; flex-direction: column; padding: 12px 4px; border-bottom: 1px solid var(--border);}

.search-result span {color: var(--muted); margin-top: 4px;}

@media (max-width: 1050px) {
.check-row {grid-template-columns: 1fr;}
}

@media (max-width: 590px) {
.service-picker,.global-search-page {grid-template-columns: 1fr; display: grid;}
.timer-box {width: 100%; flex-wrap: wrap;}
}

.billing-inline {display:grid;grid-template-columns:minmax(120px,1fr) minmax(110px,1fr) auto;gap:.45rem;align-items:center}

.billing-inline input,.billing-inline select {min-width:0}

@media (max-width:900px) {
.billing-inline {grid-template-columns:1fr}
.billing-inline .button {width:100%}
}

.renewal-decision-form {display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 10px; align-items: end; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border);}

.completion-toggle {display: flex; align-items: center; gap: 8px; padding: 7px 9px; border: 1px solid var(--color-border-strong); border-radius: 9px; background: var(--color-bg-subtle);}

.completion-toggle label {white-space: nowrap;}

.more-tasks {color: var(--muted-strong); font-size: 10px;}

@media (max-width: 590px) {
.renewal-decision-form {grid-template-columns: 1fr;}
.completion-toggle {width: 100%; justify-content: space-between;}
}

.quote-summary-grid .summary-card strong {margin-top: 12px; font-size: 20px;}

.quote-customer-box {display: grid; gap: 4px; padding: 14px; background: var(--surface-2); border-radius: 10px;}

.quote-customer-box span {color: var(--muted);}

.supplier-link {display: inline-block; margin-top: 6px; color: var(--color-info); font-size: 11px;}

.quote-totals-internal .quote-total-item:first-child {border-left: 0; padding-left: 0;}

.quote-override {border-top: 1px solid var(--border); padding-top: 8px;}

.quote-override summary {color: var(--muted-strong); cursor: pointer; font-size: 12px; font-weight: 750;}

.quote-actions {flex-wrap: wrap;}

.quote-actions form {display: flex; gap: 8px; align-items: center;}

.quote-actions select {min-width: 185px;}

.version-row {display: flex; justify-content: space-between; gap: 15px; padding: 11px 0; border-bottom: 1px solid var(--border);}

.version-row:last-child {border-bottom: 0;}

.version-row > div {display: flex; flex-direction: column; gap: 3px;}

.version-row span {color: var(--muted);}

@media (max-width: 900px) {
.quote-totals-internal .quote-total-item:first-child {border-top: 0;}
}

.api-permission-editor {margin-top: 8px;}

.api-permission-editor summary {margin-top: 8px; cursor: pointer; color: var(--red-bright); font-size: 11px; font-weight: 750;}

.compact-checkboxes {min-width: 270px; max-height: 280px; overflow: auto; margin: 10px 0; padding: 8px 7px 8px 0;}

.compact-checkboxes label {display: flex; grid-template-columns: none; flex-direction: row; align-items: center; gap: 7px; font-size: 11px; font-weight: 600;}

.compact-checkboxes input {width: auto;}

.quote-list-actions {gap: 16px;}

.quote-list-actions .quote-quick-delete-form {margin-left: 4px;}

.quote-list-filter-row {display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;}

.quote-bulk-delete-button:disabled {cursor: not-allowed;
    opacity: .48;
    filter: saturate(.65);}

.quote-selection-cell {width: 44px;
    min-width: 44px;
    padding-right: 4px;
    text-align: center;}

.quote-select-checkbox,
.quote-select-all {width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--color-danger);
    cursor: pointer;}

.quote-total-purchase span,
.quote-total-purchase strong {color: var(--color-danger);}

.quote-total-product-margin span,
.quote-total-product-margin strong {color: var(--color-warning);}

.quote-total-gross-margin span,
.quote-total-gross-margin strong {color: var(--color-success);}

.quote-total-net-margin span,
.quote-total-net-margin strong {color: var(--color-info);}

.quote-total-product-margin strong.negative-value,
.quote-total-gross-margin strong.negative-value,
.quote-total-net-margin strong.negative-value {color: var(--color-danger);}

@media (max-width: 900px) {
.quote-list-filter-row,
    .quote-list-filter-row .search-form {width: 100%;}
.quote-bulk-delete-button {width: 100%;}
}

.configurable-table-panel > .panel-header {padding: 20px 20px 0;}

.quote-detail-actions {margin-bottom: 18px;}

.quote-totals-internal {flex-wrap: wrap;}

@media (max-width: 1250px) {
.quote-totals-internal .quote-total-item {min-width: 155px;}
}

html.theme-light .top-search input,
html.theme-light input,
html.theme-light select,
html.theme-light textarea,
html.theme-light .rich-editor,
html.theme-light .api-secret,
html.theme-light .timer-box > span {background: var(--color-text-strong);
    color: var(--color-surface-raised);
    border-color: var(--color-border);}

html.theme-light .top-search button,
html.theme-light .button-secondary,
html.theme-light .menu-button,
html.theme-light .icon-button,
html.theme-light .rich-toolbar button {background: var(--color-text);
    border-color: var(--color-border);
    color: var(--color-surface-soft);}

html.theme-light .deadline-item,
html.theme-light .quote-customer-box,
html.theme-light .radio-card,
html.theme-light .quote-add-card,
html.theme-light .pricing-rule-row,
html.theme-light .completion-toggle,
html.theme-light .message-card,
html.theme-light .check-row,
html.theme-light .document-block,
html.theme-light .settings-link-card,
html.theme-light .calendar-task,
html.theme-light .month-task {background: var(--color-surface);}

html.theme-light .quote-totals,
html.theme-light .rich-toolbar,
html.theme-light .document-block-head,
html.theme-light .week-day > header,
html.theme-light .month-weekdays span,
html.theme-light .month-day > header small,
html.theme-light .view-switcher {background: var(--color-text);}

html.theme-light .quote-override summary,
html.theme-light .date-separator,
html.theme-light .calendar-task time,
html.theme-light .task-row time {color: var(--color-border-strong);}

html.theme-light .quote-total-purchase span,
html.theme-light .quote-total-purchase strong {color: var(--color-danger);}

html.theme-light .quote-total-product-margin span,
html.theme-light .quote-total-product-margin strong {color: var(--color-warning);}

html.theme-light .quote-total-gross-margin span,
html.theme-light .quote-total-gross-margin strong {color: var(--color-success);}

html.theme-light .quote-total-net-margin span,
html.theme-light .quote-total-net-margin strong {color: var(--color-info);}

html.theme-light .deadline-item,
html.theme-light .quote-customer-box,
html.theme-light .radio-card,
html.theme-light .quote-add-card,
html.theme-light .pricing-rule-row,
html.theme-light .completion-toggle,
html.theme-light .message-card,
html.theme-light .check-row,
html.theme-light .document-block,
html.theme-light .settings-link-card,
html.theme-light .calendar-task,
html.theme-light .month-task,
html.theme-light .mini-client-card,
html.theme-light .offer-card,
html.theme-light .offer-editor,
html.theme-light .inline-form {background: var(--color-bg-subtle);
    border-color: var(--color-border);}

html.theme-light .quote-totals,
html.theme-light .rich-toolbar,
html.theme-light .document-block-head,
html.theme-light .week-day > header,
html.theme-light .month-weekdays span,
html.theme-light .month-day > header small,
html.theme-light .view-switcher,
html.theme-light th {background: var(--color-border);
    color: var(--color-text-muted);}

html.theme-light input,
html.theme-light select,
html.theme-light textarea,
html.theme-light .top-search input,
html.theme-light .rich-editor,
html.theme-light .api-secret,
html.theme-light .timer-box > span {background: var(--color-surface);
    color: var(--color-surface-soft);
    border-color: var(--color-text-muted);}

html.theme-light label,
html.theme-light .inline-form summary,
html.theme-light .offer-prices strong,
html.theme-light .detail-identity h2,
html.theme-light .topbar h1,
html.theme-light .panel h2,
html.theme-light .panel h3,
html.theme-light td strong,
html.theme-light .stat-card > strong,
html.theme-light .summary-card strong {color: var(--color-surface-soft);}

html.theme-light .top-search button,
html.theme-light .button-secondary,
html.theme-light .menu-button,
html.theme-light .icon-button,
html.theme-light .rich-toolbar button,
html.theme-light .count-pill {background: var(--color-border);
    border-color: var(--color-border-strong);
    color: var(--color-surface-soft);}

html.theme-light .button-secondary:hover,
html.theme-light .icon-button:hover,
html.theme-light .rich-toolbar button:hover {background: var(--color-border);}

.badge-list {display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0;}

.social-rule-form {display: contents;}

.social-rule-form label {display: block; min-width: 86px; margin: 0 0 7px; color: var(--muted); font-size: 12px;}

.social-rule-form input[type="number"], .social-rule-form input[type="time"] {width: 86px; min-height: 32px; padding: 5px 8px;}

.social-thumb {width: 72px; height: 72px; object-fit: cover; border-radius: 10px; border: 1px solid var(--border);}

.social-preview-body {padding: 18px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2);}

.social-preview-body p {white-space: normal; line-height: 1.55;}

.social-preview-body .social-caption {white-space: pre-wrap;}

.social-linked-template {display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px; padding: 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2);}

.social-linked-template span {display: block; color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 5px;}

.social-linked-template strong {display: block; color: var(--text);}

.social-linked-template small {display: block; color: var(--muted); margin-top: 4px;}

.social-linked-template img {width: 96px; height: 96px; border-radius: 12px; object-fit: cover; border: 1px solid var(--border);}

@media (max-width: 700px) {
.social-linked-template {align-items: flex-start; flex-direction: column;}
}

html.theme-light .social-template-category-card,
html.theme-light .social-template-card,
html.theme-light .social-linked-template {background: var(--color-text-strong); border-color: var(--color-border);}

.social-visual-generator-panel {margin-bottom: 18px;}

.social-template-pill {position: absolute;
    left: 34px;
    top: 34px;
    z-index: 2;
    color: var(--tpl-accent, var(--color-primary));
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    background: rgba(0,0,0,.28);
    border-bottom: 3px solid var(--tpl-accent, var(--color-primary));
    padding: 9px 14px 8px;
    border-radius: 999px;}

.social-template-alert {position: absolute;
    right: 42px;
    top: 56px;
    width: 78px;
    height: 78px;
    z-index: 2;
    border: 4px solid var(--tpl-accent, var(--color-primary));
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: var(--tpl-accent, var(--color-primary));
    font-size: 48px;
    font-weight: 900;}

.social-template-preview-box {position: absolute;
    left: 32px;
    right: 32px;
    top: 38%;
    z-index: 2;
    background: rgba(0,0,0,.42);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;}

.social-template-preview-box small {color: var(--tpl-accent, var(--color-primary));
    font-size: 11px;
    font-weight: 900;}

.social-template-preview-box strong {color: var(--tpl-text, var(--color-surface));
    font-size: 27px;
    line-height: 1.05;}

.social-template-preview-box span {color: var(--tpl-sub, var(--color-text-muted));
    font-size: 13px;
    line-height: 1.3;}

.social-carousel-help {font-size: 12px;
    line-height: 1.5;}

.deadline-item,
.mini-client-card,
.quote-customer-box,
.radio-card,
.quote-add-card,
.pricing-rule-row,
.completion-toggle,
.message-card,
.check-row,
.document-block,
.settings-link-card,
.calendar-task,
.month-task,
.offer-card,
.offer-editor,
.inline-form,
.social-meta-card,
.social-carousel-builder,
html.theme-light .deadline-item,
html.theme-light .mini-client-card,
html.theme-light .quote-customer-box,
html.theme-light .radio-card,
html.theme-light .quote-add-card,
html.theme-light .pricing-rule-row,
html.theme-light .completion-toggle,
html.theme-light .message-card,
html.theme-light .check-row,
html.theme-light .document-block,
html.theme-light .settings-link-card,
html.theme-light .calendar-task,
html.theme-light .month-task,
html.theme-light .offer-card,
html.theme-light .offer-editor,
html.theme-light .inline-form {background: var(--surface-2);
    border-color: var(--border);}

input,
select,
textarea,
.rich-editor,
.api-secret,
.timer-box > span,
html.theme-light input,
html.theme-light select,
html.theme-light textarea,
html.theme-light .rich-editor,
html.theme-light .api-secret,
html.theme-light .timer-box > span {min-height: 41px;
    padding: 9px 11px;
    background: var(--surface);
    color: var(--text);
    border-color: var(--border-strong);
    border-radius: 10px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .015);}

.quote-totals,
.rich-toolbar,
.document-block-head,
.week-day > header,
.month-weekdays span,
.month-day > header small,
.view-switcher,
html.theme-light .quote-totals,
html.theme-light .rich-toolbar,
html.theme-light .document-block-head,
html.theme-light .week-day > header,
html.theme-light .month-weekdays span,
html.theme-light .month-day > header small,
html.theme-light .view-switcher {background: var(--surface-2);
    color: var(--muted-strong);}


.icon-button,
.rich-toolbar button,
html.theme-light .icon-button,
html.theme-light .rich-toolbar button {background: var(--surface-2);
    border-color: var(--border);
    color: var(--muted-strong);}

.icon-button:hover,
.rich-toolbar button:hover {color: var(--text); background: var(--surface-3); border-color: var(--border-strong);}


.permission-toolbar {display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0;}

.api-full-access {display: inline-block; margin-top: 8px; padding: 0; border: 0;}



.hermes-message-error {margin-top: 9px; padding-top: 8px; border-top: 1px solid rgba(225, 84, 93, .25); color: var(--danger); font-size: 10px; overflow-wrap: anywhere;}

.hermes-message-tools {display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--border);}

.hermes-message-tools .link-button {color: var(--muted); font-size: 10px; font-weight: 750;}

.hermes-message-tools .link-button:hover {color: var(--red-bright);}

.hermes-message-tools small {color: var(--muted); font-size: 9px;}

.hermes-capability-list > div,
.settings-status-list > div {display: grid;
    gap: 3px;
    padding: 11px;
    border: 1px solid var(--border);
    border-radius: 11px;
    background: var(--surface-2);}

.hermes-capability-list strong,
.settings-status-list strong {color: var(--text); font-size: 11px;}

.hermes-capability-list span,
.settings-status-list span {color: var(--muted); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere;}

.hermes-safety-card {display: grid;
    gap: 5px;
    margin: 13px 0;
    padding: 12px;
    border: 1px solid rgba(45, 183, 125, .24);
    border-radius: 12px;
    background: rgba(45, 183, 125, .08);}

.hermes-safety-card strong {color: color-mix(in srgb, var(--green) 76%, var(--text)); font-size: 11px;}

.hermes-safety-card span {color: var(--muted-strong); font-size: 10px; line-height: 1.5;}

.hermes-safety-card.large {margin-top: 18px; padding: 15px;}

.hermes-settings-grid .form-page {gap: 0;}

.settings-status-list {display: grid; gap: 8px; margin-bottom: 15px;}

.hermes-connection-flow {margin-top: 0;}

.hermes-setup-steps {display: grid; gap: 10px; margin: 0 0 17px; padding-left: 22px; color: var(--muted-strong);}

.hermes-setup-steps li {padding-left: 4px; line-height: 1.55;}

.hermes-setup-steps li::marker {color: var(--red-bright); font-weight: 850;}

.hermes-token-panel {margin-bottom: 16px; border-color: var(--accent-border);}

.hermes-token-box {display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 13px;
    padding: 13px;
    border: 1px solid var(--border-strong);
    border-radius: 12px;
    background: var(--surface-2);}

.hermes-token-box code {flex: 1;
    min-width: 0;
    color: var(--text-strong);
    font-size: 12px;
    overflow-wrap: anywhere;
    user-select: all;}

.compact-form {margin-top: 16px;}

.settings-status-list .hermes-status {justify-content: flex-end;}

@media (max-width: 680px) {
.hermes-token-box {align-items: stretch; flex-direction: column;}
.settings-status-list .hermes-status {justify-content: flex-start;}
}

.avatar-picker {grid-column: 1 / -1; margin: 4px 0 0; padding: 0; border: 0;}

.avatar-picker legend {margin-bottom: 9px; color: var(--text); font-size: 11px; font-weight: 750;}

.hermes-header-actions {display: flex; align-items: center; gap: 8px; flex-wrap: wrap;}

.quick-task-page {display:grid;gap:1rem;max-width:1300px;margin:0 auto}

.quick-task-check-form {margin:0}

.quick-task-check {width:28px;height:28px;border:2px solid var(--border-strong);border-radius:9px;background:transparent;cursor:pointer;position:relative}

.quick-task-check:hover {border-color:var(--color-success);background:rgba(34,197,94,.08)}

.quick-task-check:hover:after {content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:var(--color-success);font-weight:900}

.quick-task-remove {color:var(--color-danger)}

.quick-task-history {padding:0}

.quick-task-history>summary {list-style:none;cursor:pointer;padding:1rem 1.15rem;font-weight:800;display:flex;justify-content:space-between;align-items:center}

.quick-task-history>summary::-webkit-details-marker {display:none}

.quick-task-history>summary span {min-width:1.6rem;text-align:center;border-radius:999px;background:var(--surface-soft);padding:.15rem .45rem}

.quick-task-history[open]>summary {border-bottom:1px solid var(--border)}

.quick-task-history .quick-task-list {padding:1rem}

@media (max-width:850px) {
.quick-task-date {grid-column:1/-1}
.quick-task-check-form {grid-row:1/4;padding-top:.15rem}
}

@media (max-width:520px) {
.quick-task-date {grid-column:auto}
}

@media (max-width:760px) {
.zettle-stats {grid-template-columns:1fr 1fr}
}

.zettle-page {width: 100%;}


@media (max-width: 1150px) {
.zettle-stats {grid-template-columns: repeat(2, minmax(0, 1fr));}
}

@media (max-width: 760px) {
.stats-grid, .zettle-stats {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;}
.social-carousel-builder, .social-template-card, .offer-editor {max-width: 100%;}
}

@media (max-width: 520px) {
.stats-grid, .zettle-stats {grid-template-columns: 1fr;}
}

/* ========================================================================== 
   Ailink Gestion v0.8.0 — Design system unifié
   Référentiel: UI/UX Pro Max, adapté à l'identité Ailink.
   ========================================================================== */
:root {
    /* Primitives */
    --ailink-red-50: #fff1f2;
    --ailink-red-100: #ffe1e3;
    --ailink-red-200: #ffc7ca;
    --ailink-red-300: #ff9ca2;
    --ailink-red-400: #ff626b;
    --ailink-red-500: #ef3039;
    --ailink-red-600: #d61922;
    --ailink-red-700: #b3121a;
    --ailink-red-800: #94131a;
    --ailink-red-900: #7b151b;
    --neutral-0: #ffffff;
    --neutral-25: #fbfcfd;
    --neutral-50: #f6f8fa;
    --neutral-100: #eef2f5;
    --neutral-200: #dfe5eb;
    --neutral-300: #c7d0d9;
    --neutral-400: #98a4b2;
    --neutral-500: #6f7b89;
    --neutral-600: #505b69;
    --neutral-700: #35404c;
    --neutral-800: #222b35;
    --neutral-850: #19212a;
    --neutral-900: #111820;
    --neutral-925: #0c1218;
    --neutral-950: #070b10;
    --success-50: #ecfdf5;
    --success-500: #22a06b;
    --success-700: #14764c;
    --warning-50: #fff8e7;
    --warning-500: #d99016;
    --warning-700: #9c620d;
    --danger-50: #fff0f1;
    --danger-500: #d94852;
    --danger-700: #a52e37;
    --info-50: #eef6ff;
    --info-500: #3478bd;
    --info-700: #23578c;

    /* Sémantiques — thème sombre par défaut */
    color-scheme: dark;
    --color-bg: var(--neutral-950);
    --color-bg-subtle: var(--neutral-925);
    --color-surface: var(--neutral-900);
    --color-surface-raised: var(--neutral-850);
    --color-surface-soft: var(--neutral-800);
    --color-surface-hover: #28323d;
    --color-border: #28333f;
    --color-border-strong: #3a4857;
    --color-text: #eef2f6;
    --color-text-strong: #ffffff;
    --color-text-muted: #9ba7b5;
    --color-text-subtle: #758190;
    --color-primary: var(--ailink-red-600);
    --color-primary-hover: var(--ailink-red-500);
    --color-primary-active: var(--ailink-red-700);
    --color-primary-soft: rgba(214, 25, 34, .14);
    --color-primary-border: rgba(239, 48, 57, .34);
    --color-success: #35bd83;
    --color-success-soft: rgba(53, 189, 131, .14);
    --color-warning: #efad42;
    --color-warning-soft: rgba(239, 173, 66, .14);
    --color-danger: #ee6670;
    --color-danger-soft: rgba(238, 102, 112, .14);
    --color-info: #6ba7e3;
    --color-info-soft: rgba(107, 167, 227, .14);
    --color-overlay: rgba(3, 7, 11, .68);

    /* Compatibilité avec les modules historiques */
    --bg: var(--color-bg);
    --bg-soft: var(--color-bg-subtle);
    --surface: var(--color-surface);
    --surface-2: var(--color-surface-raised);
    --surface-3: var(--color-surface-soft);
    --surface-elevated: var(--color-surface-raised);
    --surface-raised: var(--color-surface-raised);
    --surface-soft: var(--color-surface-soft);
    --border: var(--color-border);
    --border-strong: var(--color-border-strong);
    --text: var(--color-text);
    --text-strong: var(--color-text-strong);
    --text-muted: var(--color-text-muted);
    --muted: var(--color-text-muted);
    --muted-strong: #c1c9d2;
    --primary: var(--color-primary);
    --red: var(--color-primary);
    --red-bright: var(--color-primary-hover);
    --red-deep: var(--color-primary-active);
    --accent-soft: var(--color-primary-soft);
    --accent-border: var(--color-primary-border);
    --green: var(--color-success);
    --orange: var(--color-warning);
    --danger: var(--color-danger);
    --blue: var(--color-info);

    /* Typographie */
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    --text-xs: .75rem;
    --text-sm: .8125rem;
    --text-md: .9375rem;
    --text-lg: 1.0625rem;
    --text-xl: 1.25rem;
    --text-2xl: clamp(1.45rem, 2vw, 1.9rem);
    --leading-tight: 1.25;
    --leading-normal: 1.55;

    /* Espacements */
    --space-1: .25rem;
    --space-2: .5rem;
    --space-3: .75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;

    /* Composants */
    --radius-xs: 6px;
    --radius-sm: 9px;
    --radius-md: 12px;
    --radius: 14px;
    --radius-lg: 18px;
    --radius-xl: 22px;
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, .18);
    --shadow-sm: 0 6px 18px rgba(0, 0, 0, .14);
    --shadow: 0 14px 38px rgba(0, 0, 0, .16);
    --shadow-lg: 0 28px 70px rgba(0, 0, 0, .30);
    --focus-ring: 0 0 0 3px rgba(239, 48, 57, .24);
    --transition-fast: 130ms ease;
    --transition: 190ms cubic-bezier(.2, .8, .2, 1);
    --sidebar-width: 264px;
    --sidebar-collapsed-width: 78px;
    --topbar-height: 76px;
    --content-max: 1640px;
    --safe-area-top: env(safe-area-inset-top, 0px);
    --safe-area-right: env(safe-area-inset-right, 0px);
    --safe-area-bottom: env(safe-area-inset-bottom, 0px);
    --safe-area-left: env(safe-area-inset-left, 0px);
}

html.theme-light {
    color-scheme: light;
    --color-bg: #f3f5f7;
    --color-bg-subtle: #edf1f4;
    --color-surface: #ffffff;
    --color-surface-raised: #f8fafb;
    --color-surface-soft: #eef2f5;
    --color-surface-hover: #e8edf1;
    --color-border: #dce3e9;
    --color-border-strong: #c4ced7;
    --color-text: #202832;
    --color-text-strong: #0f151c;
    --color-text-muted: #65717e;
    --color-text-subtle: #7c8793;
    --color-primary: var(--ailink-red-600);
    --color-primary-hover: var(--ailink-red-500);
    --color-primary-active: var(--ailink-red-700);
    --color-primary-soft: rgba(214, 25, 34, .08);
    --color-primary-border: rgba(214, 25, 34, .24);
    --color-success: #187d55;
    --color-success-soft: rgba(24, 125, 85, .10);
    --color-warning: #aa6a10;
    --color-warning-soft: rgba(170, 106, 16, .10);
    --color-danger: #bb3842;
    --color-danger-soft: rgba(187, 56, 66, .10);
    --color-info: #2d6da8;
    --color-info-soft: rgba(45, 109, 168, .10);
    --color-overlay: rgba(15, 21, 28, .42);
    --muted-strong: #4e5b68;
    --shadow-xs: 0 1px 2px rgba(16, 24, 32, .05);
    --shadow-sm: 0 6px 18px rgba(16, 24, 32, .06);
    --shadow: 0 14px 38px rgba(16, 24, 32, .075);
    --shadow-lg: 0 28px 70px rgba(16, 24, 32, .14);
}

/* Base */
*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; background: var(--color-bg); scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    min-width: 320px;
    min-height: 100vh;
    min-height: 100dvh;
    overflow-x: clip;
    background: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-sans);
    font-size: var(--text-md);
    line-height: var(--leading-normal);
    letter-spacing: -.006em;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
      radial-gradient(circle at 78% -12%, rgba(214, 25, 34, .07), transparent 32rem),
      radial-gradient(circle at 10% 110%, rgba(52, 120, 189, .04), transparent 34rem);
}
html.theme-light body::before {
    background:
      radial-gradient(circle at 78% -12%, rgba(214, 25, 34, .045), transparent 32rem),
      linear-gradient(180deg, #fafbfc 0, transparent 24rem);
}
body.menu-open, body.drawer-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img, svg { max-width: 100%; }
button, input, select, textarea { font: inherit; }
button, [role="button"], a.button { touch-action: manipulation; }
button { cursor: pointer; }
button:disabled, input:disabled, select:disabled, textarea:disabled { cursor: not-allowed; opacity: .58; }
code, pre, .api-secret { font-family: var(--font-mono); }
code { font-size: .88em; overflow-wrap: anywhere; }
hr { border: 0; border-top: 1px solid var(--color-border); }
::selection { color: #fff; background: rgba(214, 25, 34, .82); }
:focus-visible { outline: 2px solid var(--color-primary-hover); outline-offset: 3px; }
[hidden] { display: none !important; }

.skip-link {
    position: fixed;
    top: calc(var(--safe-area-top) + 8px);
    left: calc(var(--safe-area-left) + 8px);
    z-index: 200;
    transform: translateY(-180%);
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    background: var(--color-primary);
    color: #fff;
    font-weight: 750;
    box-shadow: var(--shadow);
    transition: transform var(--transition-fast);
}
.skip-link:focus { transform: translateY(0); }

h1, h2, h3, h4 { margin-top: 0; color: var(--color-text-strong); line-height: var(--leading-tight); letter-spacing: -.025em; }
h1 { font-size: var(--text-2xl); }
h2 { font-size: var(--text-xl); }
h3 { font-size: var(--text-lg); }
p { margin: 0 0 var(--space-4); }
small, .muted { color: var(--color-text-muted); }

/* Shell & navigation */
.app-shell {
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
    grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}
.sidebar {
    position: sticky;
    top: 0;
    z-index: 40;
    width: var(--sidebar-width);
    height: 100vh;
    height: 100dvh;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: calc(16px + var(--safe-area-top)) 14px calc(14px + var(--safe-area-bottom));
    background: color-mix(in srgb, var(--color-bg-subtle) 94%, transparent);
    border-right: 1px solid var(--color-border);
    box-shadow: 8px 0 28px rgba(0, 0, 0, .045);
    scrollbar-width: thin;
    scrollbar-color: var(--color-surface-soft) transparent;
}
html.theme-light .sidebar { background: rgba(255, 255, 255, .88); backdrop-filter: blur(18px); }
.brand-block { padding: 0 6px 18px; }
.brand { min-width: 0; min-height: 52px; display: flex; align-items: center; gap: 11px; padding: 0; }
.brand-mark {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: 14px;
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}
.brand img { width: 38px; height: 38px; object-fit: contain; border-radius: 50%; }
.brand-copy { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.brand-copy strong { color: var(--color-text-strong); font-size: 1rem; line-height: 1; letter-spacing: .18em; }
.brand-copy small { color: var(--color-text-muted); font-size: .59rem; font-weight: 760; letter-spacing: .15em; }
.brand-copy b { color: var(--color-primary-hover); }
.sidebar nav { display: grid; gap: 3px; padding-bottom: 16px; }
.nav-label { margin: 17px 10px 5px; color: var(--color-text-subtle); font-size: .61rem; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
.sidebar nav a,
.nav-group-main {
    position: relative;
    min-width: 0;
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 11px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: var(--muted-strong);
    font-size: .82rem;
    font-weight: 670;
    transition: color var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
}
.sidebar nav a > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar nav a svg,
.nav-group-main svg { width: 19px; height: 19px; flex: 0 0 19px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; opacity: .85; }
.sidebar nav a:hover, .nav-group-main:hover { color: var(--color-text-strong); background: var(--color-surface-raised); border-color: var(--color-border); }
.sidebar nav a.active, .sidebar nav a.active-parent, .nav-group-main.active, .nav-group-main.active-parent {
    color: var(--color-text-strong);
    background: linear-gradient(90deg, var(--color-primary-soft), transparent 95%);
    border-color: var(--color-primary-border);
    box-shadow: inset 3px 0 0 var(--color-primary-hover);
}
.sidebar nav a.active svg, .sidebar nav a.active-parent svg { color: var(--color-primary-hover); opacity: 1; }
.nav-count-badge {
    min-width: 22px;
    height: 22px;
    margin-left: auto;
    display: inline-grid;
    place-items: center;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--color-danger);
    color: #fff;
    font-size: .66rem;
    font-weight: 850;
}
.nav-live-dot { width: 7px; height: 7px; margin-left: auto; flex: 0 0 7px; border-radius: 50%; background: var(--color-success); box-shadow: 0 0 0 4px var(--color-success-soft); }
.nav-group { min-width: 0; }
.nav-group-row { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) 36px; align-items: center; }
.nav-group-main { border-top-right-radius: 7px; border-bottom-right-radius: 7px; }
.nav-submenu-toggle {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--color-text-muted);
}
.nav-submenu-toggle:hover { background: var(--color-surface-raised); color: var(--color-text); }
.nav-submenu-toggle svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; transition: transform var(--transition-fast); }
.nav-group.is-open .nav-submenu-toggle svg { transform: rotate(180deg); }
.nav-submenu { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows var(--transition), opacity var(--transition); }
.nav-submenu > * { overflow: hidden; }
.nav-group.is-open .nav-submenu { grid-template-rows: 1fr; opacity: 1; }
.nav-submenu a { min-height: 38px; margin: 2px 0 2px 23px; padding-left: 13px; font-size: .78rem; }
.sidebar-footer { margin-top: auto; padding: 13px 6px 2px; border-top: 1px solid var(--color-border); }
.theme-toggle {
    width: 100%; min-height: 40px; margin: 0 0 13px; padding: 7px 9px;
    display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 8px;
    border: 1px solid var(--color-border); border-radius: 11px; background: var(--color-surface-raised); color: var(--muted-strong);
    font-size: .73rem; font-weight: 750; text-align: left;
}
.theme-toggle:hover { color: var(--color-text-strong); background: var(--color-surface-soft); border-color: var(--color-border-strong); }
.theme-toggle-icons { position: relative; width: 20px; height: 20px; }
.theme-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle-icons .theme-icon { position: absolute; inset: 1px; transition: opacity var(--transition), transform var(--transition); }
.theme-icon-sun { opacity: 0; transform: rotate(-45deg) scale(.7); }
.theme-icon-moon { opacity: 1; }
html.theme-light .theme-icon-sun { opacity: 1; transform: rotate(0) scale(1); }
html.theme-light .theme-icon-moon { opacity: 0; transform: rotate(45deg) scale(.7); }
.theme-toggle-switch { width: 31px; height: 18px; padding: 2px; border: 1px solid var(--color-border-strong); border-radius: 999px; background: var(--color-surface); }
.theme-toggle-switch i { display: block; width: 12px; height: 12px; border-radius: 50%; background: var(--color-text-muted); transition: transform var(--transition), background var(--transition); }
html.theme-light .theme-toggle-switch i { transform: translateX(13px); background: var(--color-primary); }
.user-chip { min-width: 0; display: flex; align-items: center; gap: 10px; padding: 0 2px; margin-bottom: 8px; }
.user-chip > div { min-width: 0; display: flex; flex-direction: column; }
.user-chip strong, .user-chip small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-chip strong { color: var(--color-text); font-size: .77rem; }
.user-chip small { color: var(--color-text-muted); font-size: .66rem; }
.avatar { width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg, var(--color-primary-hover), var(--color-primary-active)); color: #fff; font-size: .82rem; font-weight: 850; box-shadow: 0 7px 18px rgba(214, 25, 34, .20); }
.link-button { min-height: 32px; padding: 4px 2px; border: 0; background: transparent; color: var(--color-text-muted); font-size: .72rem; }
.link-button:hover { color: var(--color-primary-hover); }
.sidebar-backdrop { position: fixed; inset: 0; z-index: 35; display: none; border: 0; background: var(--color-overlay); backdrop-filter: blur(3px); }

/* Topbar & content */
.main-content { min-width: 0; width: 100%; }
.topbar {
    position: sticky; top: 0; z-index: 30;
    min-height: calc(var(--topbar-height) + var(--safe-area-top));
    display: flex; align-items: center; gap: 16px;
    padding: calc(12px + var(--safe-area-top)) max(24px, var(--safe-area-right)) 12px max(24px, var(--safe-area-left));
    border-bottom: 1px solid var(--color-border);
    background: color-mix(in srgb, var(--color-bg) 84%, transparent);
    box-shadow: 0 6px 26px rgba(0, 0, 0, .035);
    backdrop-filter: blur(20px) saturate(1.2);
}
html.theme-light .topbar { background: rgba(248, 250, 252, .88); }
.menu-button, .top-icon-button {
    width: 42px; height: 42px; flex: 0 0 42px; display: none; place-items: center;
    padding: 0; border: 1px solid var(--color-border); border-radius: 11px;
    background: var(--color-surface); color: var(--color-text);
}
.menu-button svg, .top-icon-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.top-title { min-width: 160px; }
.top-title h1 { margin: 0; font-size: clamp(1.28rem, 2vw, 1.58rem); }
.top-title p { margin: 3px 0 0; color: var(--color-text-muted); font-size: .72rem; }
.top-search { position: relative; width: min(520px, 35vw); margin-left: auto; }
.top-search > svg { position: absolute; left: 13px; top: 50%; width: 17px; height: 17px; transform: translateY(-50%); fill: none; stroke: var(--color-text-muted); stroke-width: 1.8; pointer-events: none; }
.top-search input { height: 42px; padding: 9px 44px 9px 40px; border-radius: 12px; background: var(--color-surface); }
.top-search button { position: absolute; right: 5px; top: 5px; width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 9px; background: transparent; color: var(--color-text-muted); }
.top-search button:hover { background: var(--color-surface-soft); color: var(--color-text); }
.top-search button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.top-actions, .top-mobile-actions, .detail-actions, .row-actions, .page-actions, .inline-actions, .table-actions { display: flex; align-items: center; gap: 8px; }
.top-actions { flex: 0 0 auto; }
.top-mobile-actions { display: none; }
.page-content { width: 100%; max-width: var(--content-max); margin: 0 auto; padding: 28px 28px calc(56px + var(--safe-area-bottom)); }
.flash { max-width: calc(var(--content-max) - 56px); margin: 16px auto 0; padding: 13px 16px; border: 1px solid; border-radius: var(--radius-md); box-shadow: var(--shadow-xs); }
.flash-success { color: var(--color-success); background: var(--color-success-soft); border-color: color-mix(in srgb, var(--color-success) 34%, transparent); }
.flash-error { color: var(--color-danger); background: var(--color-danger-soft); border-color: color-mix(in srgb, var(--color-danger) 34%, transparent); }
.flash-warning { color: var(--color-warning); background: var(--color-warning-soft); border-color: color-mix(in srgb, var(--color-warning) 34%, transparent); }
.flash-info { color: var(--color-info); background: var(--color-info-soft); border-color: color-mix(in srgb, var(--color-info) 34%, transparent); }

/* Buttons */
.button {
    min-height: 40px;
    display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    padding: 9px 14px;
    border: 1px solid var(--color-primary);
    border-radius: 10px;
    background: var(--color-primary);
    color: #fff;
    font-size: .8rem;
    font-weight: 760;
    line-height: 1.2;
    box-shadow: 0 6px 16px rgba(214, 25, 34, .16);
    transition: transform var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.button:hover { background: var(--color-primary-hover); border-color: var(--color-primary-hover); transform: translateY(-1px); box-shadow: 0 8px 20px rgba(214, 25, 34, .20); }
.button:active { background: var(--color-primary-active); border-color: var(--color-primary-active); transform: translateY(0); box-shadow: none; }
.button-secondary { background: var(--color-surface-raised); border-color: var(--color-border); color: var(--color-text); box-shadow: none; }
.button-secondary:hover { background: var(--color-surface-soft); border-color: var(--color-border-strong); box-shadow: none; }
.button-ghost { background: transparent; border-color: transparent; color: var(--color-text-muted); box-shadow: none; }
.button-ghost:hover { background: var(--color-surface-raised); border-color: var(--color-border); color: var(--color-text); box-shadow: none; }
.button-danger { background: var(--color-danger-soft); border-color: color-mix(in srgb, var(--color-danger) 36%, transparent); color: var(--color-danger); box-shadow: none; }
.button-danger:hover { background: color-mix(in srgb, var(--color-danger) 18%, transparent); border-color: var(--color-danger); color: var(--color-danger); box-shadow: none; }
.button-small { min-height: 34px; padding: 6px 10px; font-size: .72rem; border-radius: 9px; }
.button-full { width: 100%; }
.button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.icon-button {
    width: 38px; height: 38px; display: inline-grid; place-items: center; padding: 0;
    border: 1px solid var(--color-border); border-radius: 10px;
    background: var(--color-surface-raised); color: var(--color-text-muted);
}
.icon-button:hover { background: var(--color-surface-soft); border-color: var(--color-border-strong); color: var(--color-text); }
.icon-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.icon-button-danger { color: var(--color-danger); background: var(--color-danger-soft); border-color: color-mix(in srgb, var(--color-danger) 32%, transparent); }

/* Layout primitives */
.grid-2, .grid-3, .grid-4, .stats-grid { display: grid; gap: 16px; margin-bottom: 18px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4, .stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.panel, .stat-card, .summary-card {
    min-width: 0;
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}
.panel { margin-bottom: 18px; padding: 20px; border-radius: var(--radius); }
.panel > :last-child { margin-bottom: 0; }
.panel h2, .panel h3 { margin-bottom: 12px; }
.panel-header { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.panel-header > div { min-width: 0; }
.panel-header h2, .panel-header h3 { margin: 0; }
.panel-header p { margin: 5px 0 0; color: var(--color-text-muted); font-size: .8rem; }
.panel-header > a:not(.button) { color: var(--color-primary-hover); font-size: .75rem; font-weight: 760; }
.stat-card, .summary-card { min-height: 132px; display: flex; flex-direction: column; padding: 18px; border-radius: var(--radius); }
.stat-card > span, .summary-card > span { color: var(--color-text-muted); font-size: .75rem; font-weight: 700; }
.stat-card > strong { margin: 10px 0 auto; color: var(--color-text-strong); font-size: clamp(1.65rem, 3vw, 2.15rem); line-height: 1.1; letter-spacing: -.035em; }
.stat-card .money-value { font-size: clamp(1.25rem, 2vw, 1.62rem); }
.stat-card a { margin-top: 12px; color: var(--color-primary-hover); font-size: .72rem; font-weight: 730; }
.stat-card small, .summary-card small { margin-top: auto; color: var(--color-text-muted); font-size: .72rem; }
.warning-card { border-color: color-mix(in srgb, var(--color-warning) 34%, var(--color-border)); }

/* Forms */
input, select, textarea {
    width: 100%; min-width: 0;
    color: var(--color-text);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-strong);
    border-radius: 10px;
    padding: 10px 11px;
    outline: none;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
}
input, select { min-height: 42px; }
textarea { min-height: 96px; resize: vertical; line-height: 1.5; }
input::placeholder, textarea::placeholder { color: var(--color-text-subtle); opacity: 1; }
input:hover, select:hover, textarea:hover { border-color: color-mix(in srgb, var(--color-border-strong) 78%, var(--color-text-muted)); }
input:focus, select:focus, textarea:focus { border-color: var(--color-primary-hover); box-shadow: var(--focus-ring); background: var(--color-surface); }
input[type="checkbox"], input[type="radio"] { width: 18px; height: 18px; min-height: 0; padding: 0; accent-color: var(--color-primary); }
input[type="file"] { min-height: 46px; padding: 7px; }
label { min-width: 0; display: grid; gap: 7px; color: var(--muted-strong); font-size: .75rem; font-weight: 720; }
label small { font-weight: 500; line-height: 1.45; }
.checkbox-label, .radio-label, .checkbox-line { display: flex; align-items: center; gap: 9px; }
.form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.form-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-full { grid-column: 1 / -1; }
.span-2 { grid-column: span 2; }
.form-page > .panel label + label { margin-top: 14px; }
.form-actions { min-width: 0; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 9px; margin-top: 20px; }
.form-help { margin-top: 6px; color: var(--color-text-muted); font-size: .72rem; }
.form-stack { display: grid; gap: 15px; }
.inline-form, .inline-form-block { padding: 14px; border: 1px dashed var(--color-border-strong); border-radius: var(--radius-md); background: var(--color-surface-raised); }
.inline-form summary { cursor: pointer; color: var(--muted-strong); font-size: .8rem; font-weight: 760; }
.checkbox-stack { display: grid; gap: 10px; margin: 14px 0; }
.checkbox-stack label { display: flex; flex-direction: row; align-items: center; gap: 9px; }

/* Toolbars, tabs & filters */
.toolbar, .filter-bar, .page-header { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.page-header { align-items: flex-start; }
.page-header h1 { margin: 0; }
.page-header p { margin: 5px 0 0; color: var(--color-text-muted); }
.search-form { min-width: 0; max-width: 980px; display: flex; align-items: center; gap: 8px; flex: 1; }
.search-form input { flex: 1; }
.zettle-periods, .zettle-tabs, .social-tabs, .view-switcher, .hermes-conversation-tabs {
    display: flex; align-items: center; gap: 4px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.zettle-periods::-webkit-scrollbar, .zettle-tabs::-webkit-scrollbar, .social-tabs::-webkit-scrollbar, .view-switcher::-webkit-scrollbar, .hermes-conversation-tabs::-webkit-scrollbar { display: none; }
.zettle-periods a, .zettle-tabs button, .social-tabs a, .view-switcher a, .hermes-conversation-tabs a {
    min-height: 38px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
    padding: 8px 12px; border: 1px solid transparent; border-radius: 9px;
    background: transparent; color: var(--color-text-muted); font-size: .74rem; font-weight: 760; white-space: nowrap;
}
.zettle-periods a:hover, .zettle-tabs button:hover, .social-tabs a:hover, .view-switcher a:hover, .hermes-conversation-tabs a:hover { color: var(--color-text); background: var(--color-surface-raised); }
.zettle-periods a.active, .zettle-tabs button.active, .social-tabs a.active, .social-tabs .social-tab-active, .view-switcher a.active, .hermes-conversation-tabs a.active {
    color: var(--color-text-strong); background: var(--color-primary-soft); border-color: var(--color-primary-border);
}

/* Tables & lists */
.table-panel { padding: 0; overflow: hidden; }
.table-panel > .panel-header { padding: 18px 20px 0; }
.table-responsive, .table-wrapper { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; border-spacing: 0; }
th, td { padding: 13px 15px; text-align: left; border-bottom: 1px solid var(--color-border); vertical-align: middle; }
th { color: var(--color-text-muted); background: color-mix(in srgb, var(--color-surface-raised) 65%, transparent); font-size: .67rem; font-weight: 820; letter-spacing: .055em; text-transform: uppercase; white-space: nowrap; }
td { color: var(--color-text); font-size: .79rem; }
tbody tr { transition: background var(--transition-fast); }
tbody tr:hover { background: color-mix(in srgb, var(--color-surface-raised) 65%, transparent); }
tbody tr:last-child td { border-bottom: 0; }
td strong { color: var(--color-text-strong); }
td small, td > span + small, td strong + small { display: block; margin-top: 3px; color: var(--color-text-muted); font-size: .69rem; }
.actions-cell { width: 1%; text-align: right; white-space: nowrap; }
.identity-cell { min-width: 0; display: flex; align-items: center; gap: 10px; }
.identity-cell > div { min-width: 0; }
.identity-cell strong, .identity-cell small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.client-initial, .large-initial { display: grid; place-items: center; flex: 0 0 auto; border-radius: 12px; background: linear-gradient(145deg, var(--color-surface-soft), var(--color-surface-raised)); color: var(--color-text-strong); font-weight: 850; }
.client-initial { width: 38px; height: 38px; }
.large-initial { width: 62px; height: 62px; border-radius: 16px; background: linear-gradient(145deg, var(--color-primary-hover), var(--color-primary-active)); color: #fff; font-size: 1.45rem; }
.count-pill { min-width: 28px; min-height: 26px; display: inline-grid; place-items: center; padding: 3px 8px; border: 1px solid var(--color-border); border-radius: 999px; background: var(--color-surface-soft); color: var(--color-text); font-size: .7rem; font-weight: 800; }
.compact-table { display: grid; }
.compact-table > a, .record-row { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--color-border); }
.compact-table > a:last-child, .record-row:last-child { border-bottom: 0; }
.compact-table > a > div, .record-row > div { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.compact-table strong, .compact-table span, .record-row strong, .record-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.compact-table span, .record-row span { color: var(--color-text-muted); font-size: .72rem; }
.record-link { border-radius: 8px; transition: background var(--transition-fast), padding var(--transition-fast); }
.record-link:hover { padding-inline: 9px; background: var(--color-surface-raised); }
.list-stack { display: grid; gap: 9px; }
.deadline-item { min-width: 0; display: grid; grid-template-columns: 52px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 11px; border: 1px solid transparent; border-radius: var(--radius-md); background: var(--color-surface-raised); }
.deadline-item:hover { border-color: var(--color-border-strong); }
.deadline-item > div { min-width: 0; display: flex; flex-direction: column; }
.deadline-item strong, .deadline-item span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.deadline-item span { color: var(--color-text-muted); font-size: .72rem; }
.deadline-item time { color: var(--muted-strong); font-size: .72rem; white-space: nowrap; }
.deadline-days { width: 48px; height: 42px; display: grid; place-items: center; border-radius: 10px; background: var(--color-warning-soft); color: var(--color-warning); font-size: .7rem; font-weight: 850; text-align: center; }
.deadline-days.urgent { background: var(--color-danger-soft); color: var(--color-danger); }

/* Badges & feedback */
.badge { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; border: 1px solid var(--color-border); border-radius: 999px; padding: 4px 8px; background: var(--color-surface-raised); color: var(--color-text-muted); font-size: .66rem; font-weight: 820; }
.badge-active, .badge-accepted, .badge-published, .badge-connected, .badge-done { color: var(--color-success); background: var(--color-success-soft); border-color: color-mix(in srgb, var(--color-success) 28%, transparent); }
.badge-draft, .badge-todo, .badge-ignored { color: var(--color-text-muted); background: var(--color-surface-raised); }
.badge-sent, .badge-validated, .badge-in_progress, .badge-selected, .badge-draft_created { color: var(--color-info); background: var(--color-info-soft); border-color: color-mix(in srgb, var(--color-info) 28%, transparent); }
.badge-suspended, .badge-provisional, .badge-renewal_due, .badge-waiting_client, .badge-waiting_material, .badge-pending_validation, .badge-scheduled, .badge-planned { color: var(--color-warning); background: var(--color-warning-soft); border-color: color-mix(in srgb, var(--color-warning) 28%, transparent); }
.badge-expired, .badge-terminated, .badge-cancelled, .badge-refused, .badge-error, .badge-revoked, .badge-retired { color: var(--color-danger); background: var(--color-danger-soft); border-color: color-mix(in srgb, var(--color-danger) 28%, transparent); }
.priority-high, .priority-urgent { color: var(--color-danger); background: var(--color-danger-soft); }
.priority-normal, .priority-medium { color: var(--color-warning); background: var(--color-warning-soft); }
.priority-low { color: var(--color-info); background: var(--color-info-soft); }
.empty-state, .empty-cell { color: var(--color-text-muted); text-align: center; }
.empty-state { padding: 28px 18px; border: 1px dashed var(--color-border); border-radius: var(--radius-md); background: color-mix(in srgb, var(--color-surface-raised) 44%, transparent); }
.empty-cell { padding: 28px 16px !important; }
.large-empty { min-height: 220px; display: grid; place-content: center; gap: 9px; text-align: center; }
.large-empty strong { color: var(--color-text-strong); }
.loading-state { position: relative; pointer-events: none; opacity: .76; }
.loading-state::after { content: ""; width: 18px; height: 18px; margin-left: 8px; display: inline-block; vertical-align: -4px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: ailink-spin .75s linear infinite; }
@keyframes ailink-spin { to { transform: rotate(360deg); } }

/* Detail pages */
.detail-header { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.detail-identity { min-width: 0; display: flex; align-items: center; gap: 14px; }
.detail-identity > div { min-width: 0; }
.detail-identity h2 { margin: 3px 0 4px; font-size: clamp(1.35rem, 2vw, 1.8rem); }
.detail-identity p { margin: 0; color: var(--color-text-muted); }
.eyebrow { color: var(--color-primary-hover); font-size: .65rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.info-panel dl { display: grid; grid-template-columns: minmax(90px, .75fr) minmax(0, 1.35fr); gap: 9px 14px; margin: 0; }
.info-panel dt { color: var(--color-text-muted); font-size: .72rem; }
.info-panel dd { min-width: 0; margin: 0; color: var(--color-text); overflow-wrap: anywhere; }
.info-panel p, .prose { color: var(--muted-strong); line-height: 1.65; }
.prose a { color: var(--color-primary-hover); text-decoration: underline; text-underline-offset: 2px; }
.danger-zone { border-color: color-mix(in srgb, var(--color-danger) 38%, var(--color-border)); background: linear-gradient(180deg, var(--color-danger-soft), var(--color-surface)); }

/* Dashboard */
.dashboard-grid .panel { min-height: 100%; }
.compact-stats .stat-card { min-height: 116px; }
.bar-row { display: grid; gap: 7px; padding: 9px 0; }
.bar-row > div:first-child { display: flex; justify-content: space-between; gap: 12px; }
.bar-row span { color: var(--color-text-muted); font-size: .72rem; }
.bar-track { height: 8px; overflow: hidden; border-radius: 999px; background: var(--color-surface-soft); }
.bar-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--color-primary-active), var(--color-primary-hover)); }

/* Calendar & agenda */
.agenda-toolbar { align-items: flex-start; }
.calendar-navigation { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 14px; margin-bottom: 14px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
.calendar-navigation > div:nth-child(2) { text-align: center; }
.week-calendar { display: grid; grid-template-columns: repeat(7, minmax(155px, 1fr)); gap: 8px; overflow-x: auto; padding-bottom: 7px; scroll-snap-type: x proximity; }
.week-day { min-height: 410px; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); scroll-snap-align: start; }
.week-day.today { border-color: var(--color-primary-border); box-shadow: inset 0 0 0 1px var(--color-primary); }
.week-day > header { display: flex; justify-content: space-between; gap: 8px; padding: 11px; border-bottom: 1px solid var(--color-border); background: var(--color-surface-raised); }
.calendar-task-stack { display: grid; gap: 8px; padding: 9px; }
.calendar-task { padding: 9px; border-left: 3px solid var(--color-info); border-radius: 8px; background: var(--color-surface-raised); }
.calendar-task > a { display: grid; gap: 3px; }
.calendar-task time, .calendar-task span:not(.badge) { color: var(--color-text-muted); font-size: .68rem; }
.calendar-empty { padding: 18px 5px; color: var(--color-text-subtle); font-size: .7rem; text-align: center; }
.month-calendar { overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
.month-weekdays, .month-grid { display: grid; grid-template-columns: repeat(7, minmax(120px, 1fr)); }
.month-weekdays span { padding: 9px; border-right: 1px solid var(--color-border); background: var(--color-surface-raised); color: var(--color-text-muted); font-size: .67rem; font-weight: 820; text-align: center; text-transform: uppercase; }
.month-day { min-height: 125px; padding: 7px; border-top: 1px solid var(--color-border); border-right: 1px solid var(--color-border); background: var(--color-surface); }
.month-day.outside { background: var(--color-bg-subtle); opacity: .62; }
.month-day.today { box-shadow: inset 0 0 0 2px var(--color-primary); }
.month-day > header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.month-day > header > span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; font-weight: 800; }
.month-day.today > header > span { background: var(--color-primary); color: #fff; }
.month-task-stack { display: grid; gap: 4px; }
.month-task { display: block; padding: 5px 6px; border-left: 3px solid var(--color-info); border-radius: 6px; background: var(--color-surface-raised); color: var(--color-text); font-size: .66rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Quick tasks */
.quick-task-create-panel { position: sticky; top: calc(var(--topbar-height) + var(--safe-area-top) + 10px); z-index: 8; }
.quick-task-create { display: grid; grid-template-columns: minmax(150px, .35fr) minmax(260px, 1.65fr) auto; gap: 10px; align-items: end; }
.quick-task-list { display: grid; gap: 8px; }
.quick-task-row { min-width: 0; display: grid; grid-template-columns: 8px minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
.quick-task-indicator { align-self: stretch; border-radius: 999px; background: var(--color-text-subtle); }
.quick-task-row.is-today .quick-task-indicator { background: var(--color-success); }
.quick-task-row.is-warning .quick-task-indicator { background: var(--color-warning); }
.quick-task-row.is-overdue .quick-task-indicator { background: var(--color-danger); }
.quick-task-main { min-width: 0; }
.quick-task-main strong { display: block; overflow-wrap: anywhere; }
.quick-task-main small { color: var(--color-text-muted); }
.quick-task-delay { color: var(--color-text-muted); font-size: .7rem; font-weight: 760; white-space: nowrap; }
.quick-task-done, .quick-task-removed { opacity: .72; }
.quick-task-actions { display: flex; align-items: center; gap: 8px; }

/* Quotes */
.quote-customer-choices, .quote-add-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-bottom: 18px; }
.quote-add-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.radio-card { display: flex; align-items: flex-start; gap: 10px; padding: 14px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-raised); cursor: pointer; }
.radio-card:has(input:checked) { border-color: var(--color-primary-hover); background: var(--color-primary-soft); box-shadow: var(--focus-ring); }
.radio-card span { display: flex; flex-direction: column; gap: 3px; }
.radio-card small { color: var(--color-text-muted); font-weight: 500; }
.quote-lines-panel { overflow: hidden; }
.quote-lines-panel > .panel-header { padding: 18px 20px 0; }
.quote-lines-table td small { max-width: 560px; }
.quote-totals { display: flex; justify-content: space-between; align-items: stretch; gap: 18px; padding: 14px 18px; border-top: 1px solid var(--color-border); background: var(--color-bg-subtle); }
.quote-totals-group { display: flex; align-items: stretch; }
.quote-total-item { min-width: 160px; display: flex; flex-direction: column; gap: 3px; padding: 8px 15px; border-left: 1px solid var(--color-border); }
.quote-total-item span { color: var(--color-text-muted); font-size: .67rem; font-weight: 820; text-transform: uppercase; }
.quote-total-item strong { font-size: 1.05rem; }
.quote-add-card, .pricing-rule-row { padding: 14px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-raised); }
.quote-add-card > summary { cursor: pointer; font-weight: 850; }
.pricing-rule-list { display: grid; gap: 10px; }
.pricing-rule-row { display: grid; grid-template-columns: 1.4fr repeat(5,minmax(100px,.8fr)) auto auto; gap: 9px; align-items: end; }
.negative-value, .amount-negative { color: var(--color-danger); }
.amount-positive { color: var(--color-success); }

/* Hermes */
.hermes-page { min-width: 0; display: grid; grid-template-columns: minmax(220px, 290px) minmax(0, 1fr); gap: 16px; align-items: stretch; }
.hermes-page > .panel { margin-bottom: 0; }
.hermes-conversations { min-width: 0; height: calc(100dvh - var(--topbar-height) - var(--safe-area-top) - 56px); display: flex; flex-direction: column; padding: 15px; overflow: hidden; }
.hermes-conversations-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.hermes-conversations-head h2 { margin: 0; font-size: 1rem; }
.hermes-conversations-head p { margin: 3px 0 0; color: var(--color-text-muted); font-size: .68rem; }
.hermes-conversation-list { min-height: 0; display: grid; gap: 7px; margin-top: 10px; overflow-y: auto; padding-right: 3px; }
.hermes-conversation-tabs { margin: 12px 0 2px; gap: 8px; }
.hermes-conversation-tabs a { min-height: 40px; flex: 1 0 auto; }
.hermes-conversation-item { min-width: 0; display: grid; gap: 3px; padding: 10px; border: 1px solid transparent; border-radius: 10px; color: var(--color-text-muted); }
.hermes-conversation-item:hover { background: var(--color-surface-raised); border-color: var(--color-border); }
.hermes-conversation-item.active { background: var(--color-primary-soft); border-color: var(--color-primary-border); color: var(--color-text); }
.hermes-conversation-item strong, .hermes-conversation-item span, .hermes-conversation-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hermes-conversation-item strong { color: var(--color-text-strong); font-size: .76rem; }
.hermes-conversation-item span, .hermes-conversation-item small { color: var(--color-text-muted); font-size: .66rem; }
.hermes-settings-link { margin-top: 12px; }
.hermes-chat { min-width: 0; height: calc(100dvh - var(--topbar-height) - var(--safe-area-top) - 56px); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; padding: 0; overflow: hidden; }
.hermes-chat-header { min-width: 0; display: flex; justify-content: space-between; gap: 14px; padding: 17px 18px; border-bottom: 1px solid var(--color-border); background: var(--color-surface); }
.hermes-chat-header h2 { margin: 5px 0 2px; font-size: 1.05rem; }
.hermes-chat-header p { margin: 0; color: var(--color-text-muted); font-size: .7rem; }
.hermes-status { display: inline-flex; align-items: center; gap: 7px; color: var(--color-text-muted); font-size: .67rem; font-weight: 760; }
.hermes-status i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 13%, transparent); }
.hermes-status.online { color: var(--color-success); }
.hermes-status.offline { color: var(--color-danger); }
.hermes-messages { min-width: 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px; scroll-behavior: smooth; }
.hermes-message { min-width: 0; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; margin-bottom: 16px; }
.hermes-message-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--color-surface-soft); color: var(--color-text-strong); font-size: .75rem; font-weight: 850; }
.hermes-message.user .hermes-message-avatar { background: linear-gradient(145deg, var(--color-primary-hover), var(--color-primary-active)); color: #fff; }
.hermes-message-body { min-width: 0; }
.hermes-message-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
.hermes-message-meta strong { font-size: .74rem; }
.hermes-message-meta span { color: var(--color-text-muted); font-size: .64rem; }
.hermes-message-content { min-width: 0; max-width: 100%; overflow-wrap: anywhere; word-break: break-word; color: var(--muted-strong); line-height: 1.65; }
.hermes-message.user .hermes-message-content { display: inline-block; padding: 10px 12px; border-radius: 13px 13px 4px 13px; background: var(--color-primary-soft); color: var(--color-text); }
.hermes-message-content pre { max-width: 100%; overflow-x: auto; padding: 12px; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-bg-subtle); }
.hermes-message-content table { display: block; max-width: 100%; overflow-x: auto; }
.hermes-message.error .hermes-message-content { color: var(--color-danger); }
.hermes-composer-wrap { padding: 12px 16px calc(14px + var(--safe-area-bottom)); border-top: 1px solid var(--color-border); background: color-mix(in srgb, var(--color-surface) 94%, transparent); }
.hermes-quick-prompts { display: flex; gap: 7px; overflow-x: auto; margin-bottom: 9px; scrollbar-width: none; }
.hermes-quick-prompts::-webkit-scrollbar { display: none; }
.hermes-quick-prompts button { min-height: 34px; flex: 0 0 auto; padding: 7px 10px; border: 1px solid var(--color-border); border-radius: 999px; background: var(--color-surface-raised); color: var(--color-text-muted); font-size: .68rem; white-space: nowrap; }
.hermes-quick-prompts button:hover { color: var(--color-text); border-color: var(--color-border-strong); }
.hermes-composer textarea { min-height: 84px; max-height: 30vh; background: var(--color-bg-subtle); }
.hermes-composer-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; }
.hermes-composer-footer span { color: var(--color-text-muted); font-size: .65rem; }
.hermes-config-warning, .hermes-archive-notice { margin: 12px 16px 0; padding: 12px; border: 1px solid var(--color-warning); border-radius: 10px; background: var(--color-warning-soft); }
.hermes-offline-warning { border-color: var(--color-danger); background: var(--color-danger-soft); }
.hermes-welcome { min-height: 100%; display: grid; place-content: center; justify-items: center; gap: 10px; padding: 30px; text-align: center; }
.hermes-welcome p { max-width: 620px; color: var(--color-text-muted); }
.hermes-orb { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 18px; background: linear-gradient(145deg, var(--color-primary-hover), var(--color-primary-active)); color: #fff; font-size: 1.4rem; font-weight: 900; box-shadow: 0 12px 30px rgba(214,25,34,.24); }
.hermes-chat-menu { position: relative; }
.hermes-chat-menu > summary { list-style: none; }
.hermes-chat-menu > summary::-webkit-details-marker { display: none; }
.hermes-chat-menu > div { position: absolute; right: 0; top: calc(100% + 7px); z-index: 10; width: min(300px, 82vw); display: grid; gap: 10px; padding: 12px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); box-shadow: var(--shadow); }
.hermes-primary-actions { display: flex; align-items: center; gap: 8px; }
.hermes-primary-actions > form { margin: 0; }
.hermes-chat-menu > div form { display: grid; gap: 8px; margin: 0; }
.hermes-chat-menu > div form .button { width: 100%; justify-content: center; }
.button-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.social-news-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.social-news-row-actions form { margin: 0; }
.social-source-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: nowrap; }
.social-source-actions form { display: inline-flex; margin: 0; }
.social-source-actions .button-icon { display: inline-flex; align-items: center; justify-content: center; }
.social-news-source-form { padding: 18px 20px 20px; }
.social-news-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 14px 20px 18px; border-top: 1px solid var(--color-border); }
.social-news-pagination span { color: var(--color-text-muted); font-size: .72rem; }

/* Hermes quick drawer */
.hermes-floating-overlay { position: fixed; inset: 0; z-index: 100; display: grid; grid-template-columns: 1fr auto; }
.hermes-floating-overlay[hidden] { display: none !important; }
.hermes-floating-backdrop { grid-column: 1 / -1; grid-row: 1; width: 100%; height: 100%; border: 0; background: var(--color-overlay); opacity: 0; transition: opacity var(--transition); }
.hermes-floating-window {
    grid-column: 2; grid-row: 1; width: min(560px, 100dvw); height: 100dvh;
    display: grid; grid-template-rows: auto minmax(0,1fr);
    padding-right: var(--safe-area-right); border-left: 1px solid var(--color-border);
    background: var(--color-surface); box-shadow: -22px 0 60px rgba(0,0,0,.30);
    transform: translateX(100%); transition: transform 260ms cubic-bezier(.2,.8,.2,1);
}
.hermes-floating-overlay.is-open .hermes-floating-backdrop { opacity: 1; }
.hermes-floating-overlay.is-open .hermes-floating-window { transform: translateX(0); }
.hermes-floating-window > header { min-height: calc(58px + var(--safe-area-top)); display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: calc(10px + var(--safe-area-top)) 12px 10px 16px; border-bottom: 1px solid var(--color-border); }
.hermes-floating-window > header div { display: flex; align-items: center; gap: 9px; }
.hermes-floating-window > header a { color: var(--color-primary-hover); font-size: .72rem; font-weight: 760; }
.hermes-floating-window > header button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-surface-raised); color: var(--color-text); font-size: 1.3rem; }
.hermes-floating-window iframe { width: 100%; height: 100%; min-height: 0; border: 0; background: var(--color-surface); }
.hermes-floating-body { min-width: 0; overflow: hidden; background: var(--color-surface); }
.hermes-floating-shell { height: 100dvh; }
.hermes-floating-title { display: none; }
.hermes-floating-body .hermes-page { display: block; height: 100dvh; }
.hermes-floating-body .hermes-conversations { display: none; }
.hermes-floating-body .hermes-chat { height: 100dvh; border: 0; border-radius: 0; box-shadow: none; }
.hermes-floating-body .hermes-chat-header p { display: none; }

/* Zettle */
.zettle-page-header { align-items: center; }
.zettle-status-line { display: flex; align-items: center; gap: 12px; margin: -5px 0 14px; }
.zettle-periods { margin-bottom: 16px; }
.zettle-chart-panel { overflow: hidden; }
.zettle-chart { min-width: 0; min-height: 235px; display: flex; align-items: flex-end; gap: clamp(8px, 1.6vw, 18px); overflow-x: auto; padding: 32px 10px 8px; border-bottom: 1px solid var(--color-border); scroll-snap-type: x proximity; }
.zettle-bar { position: relative; min-width: max(34px, calc((100% - (var(--zettle-points, 1) - 1) * 12px) / var(--zettle-points, 1))); max-width: 74px; display: flex; align-items: flex-end; justify-content: center; flex: 1 0 38px; border-radius: 8px 8px 3px 3px; background: linear-gradient(180deg, var(--color-primary-hover), var(--color-primary-active)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 7px 18px rgba(214,25,34,.14); scroll-snap-align: center; }
.zettle-bar strong { position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); color: var(--color-text); font-size: .66rem; white-space: nowrap; }
.zettle-bar span { position: absolute; top: calc(100% + 7px); left: 50%; transform: translateX(-50%); color: var(--color-text-muted); font-size: .64rem; }
.zettle-tabs { margin: 18px 0 12px; }
.zettle-tab-panel { display: none; }
.zettle-tab-panel.active { display: block; }
.zettle-settings-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 22px; background: var(--color-surface-raised); }
.zettle-settings-card p { margin-bottom: 0; color: var(--color-text-muted); }
.table-search { width: min(300px, 100%); }
.zettle-sync-feedback { min-height: 20px; color: var(--color-text-muted); font-size: .72rem; }

/* Social */
.social-kpi-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px; }
.social-kpi-grid > div { display: grid; gap: 3px; padding: 14px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-raised); }
.social-kpi-grid strong { color: var(--color-text-strong); font-size: 1.35rem; }
.social-kpi-grid span { color: var(--color-text-muted); font-size: .7rem; }
.social-template-grid, .social-template-category-grid, .social-meta-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.social-template-card, .social-template-category-card, .social-meta-card, .social-preview, .social-intro-panel { min-width: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.social-template-card:hover { border-color: var(--color-border-strong); transform: translateY(-2px); }
.social-template-card-body { padding: 14px; }
.social-template-live-preview, .social-preview-media { aspect-ratio: 4 / 5; overflow: hidden; background: var(--color-bg-subtle); }
.social-template-live-preview img, .social-preview-media img { width: 100%; height: 100%; object-fit: cover; }
.social-carousel-builder { margin-top: 14px; padding: 14px; border: 1px solid var(--color-border); border-radius: var(--radius); background: var(--color-surface-raised); }
.social-carousel-builder summary { cursor: pointer; font-weight: 800; }
.social-carousel-builder .form-grid { margin-top: 14px; }
.social-carousel-slide-field { position: relative; padding: 14px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
.social-carousel-slide-field::before { content: attr(data-slide-label); display: block; margin-bottom: 8px; color: var(--color-primary-hover); font-size: .68rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }

/* Settings & administration */
.settings-link-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.settings-link-card { min-width: 0; min-height: 106px; display: flex; flex-direction: column; gap: 7px; padding: 16px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-raised); transition: border-color var(--transition-fast), transform var(--transition-fast), background var(--transition-fast); }
.settings-link-card:hover { transform: translateY(-2px); border-color: var(--color-border-strong); background: var(--color-surface-soft); }
.settings-link-card strong { color: var(--color-text-strong); }
.settings-link-card span { color: var(--color-text-muted); font-size: .73rem; }
.settings-link-card-strong { border-color: var(--color-primary-border); background: var(--color-primary-soft); }
.maintenance-link-grid .settings-link-card { border-color: var(--color-border); background: var(--color-surface-raised); }
.maintenance-link-grid .settings-link-card:hover { border-color: var(--color-primary-border); background: var(--color-primary-soft); }
.settings-collapsible { padding: 0; overflow: hidden; }
.settings-collapsible > summary { margin: 0; padding: 18px 20px; cursor: pointer; list-style: none; user-select: none; }
.settings-collapsible > summary::-webkit-details-marker { display: none; }
.settings-collapsible > summary:hover { background: var(--color-surface-soft); }
.settings-collapsible-chevron { width: 11px; height: 11px; flex: 0 0 auto; margin-left: auto; border-right: 2px solid var(--color-text-muted); border-bottom: 2px solid var(--color-text-muted); transform: rotate(45deg); transition: transform var(--transition-fast); }
.settings-collapsible[open] .settings-collapsible-chevron { transform: rotate(225deg); }
.settings-collapsible-content { padding: 12px 20px 20px; }
.api-module-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin: 16px 0; }
.api-module-grid span { min-height: 42px; display: flex; align-items: center; padding: 9px 11px; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-surface-raised); }
.api-secret { display: block; margin-top: 8px; padding: 10px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-bg-subtle); user-select: all; overflow-wrap: anywhere; }
.avatar-options { display: flex; flex-wrap: wrap; gap: 8px; }
.avatar-option { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--color-border); border-radius: 50%; background: var(--color-surface-raised); cursor: pointer; }
.avatar-option:has(input:checked) { border-color: var(--color-primary); box-shadow: var(--focus-ring); }
.avatar-option input { position: absolute; opacity: 0; pointer-events: none; }

/* Auth */
.auth-body { position: relative; min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: calc(26px + var(--safe-area-top)) calc(20px + var(--safe-area-right)) calc(26px + var(--safe-area-bottom)) calc(20px + var(--safe-area-left)); background: var(--color-bg); }
.auth-body::before { content: ""; position: fixed; inset: 0; pointer-events: none; background: radial-gradient(circle at 15% 12%, rgba(214,25,34,.16), transparent 28rem), radial-gradient(circle at 90% 88%, rgba(52,120,189,.08), transparent 32rem); }
.auth-card { position: relative; width: min(430px, 100%); padding: 32px; border: 1px solid var(--color-border); border-radius: var(--radius-xl); background: color-mix(in srgb, var(--color-surface) 95%, transparent); box-shadow: var(--shadow-lg); backdrop-filter: blur(20px); }
.auth-brand { display: grid; justify-items: center; gap: 9px; margin-bottom: 24px; }
.auth-logo { width: min(245px, 78vw); }
.auth-brand > span { color: var(--color-text-muted); font-size: .62rem; font-weight: 850; letter-spacing: .2em; }
.auth-heading { margin-bottom: 22px; }
.auth-heading h1 { margin-bottom: 6px; font-size: 1.45rem; }
.auth-heading p { color: var(--color-text-muted); font-size: .78rem; }
.auth-links { margin-top: 16px; text-align: center; }
.auth-links a { color: var(--color-text-muted); font-size: .74rem; }
.auth-links a:hover { color: var(--color-primary-hover); }
.auth-theme-toggle { position: fixed; top: calc(16px + var(--safe-area-top)); right: calc(16px + var(--safe-area-right)); z-index: 3; min-height: 42px; display: flex; align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid var(--color-border); border-radius: 11px; background: color-mix(in srgb, var(--color-surface) 90%, transparent); color: var(--color-text-muted); box-shadow: var(--shadow-sm); backdrop-filter: blur(16px); }

/* Drawer / modal primitives */
.drawer-backdrop, .modal-backdrop { position: fixed; inset: 0; z-index: 90; border: 0; background: var(--color-overlay); backdrop-filter: blur(3px); }

/* Responsive */
@media (max-width: 1280px) {
    .stats-grid, .grid-4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .social-kpi-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .pricing-rule-row { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .top-actions .button-secondary:not(.top-hermes-button) { display: none; }
}
@media (max-width: 1050px) {
    .grid-3, .social-template-grid, .social-template-category-grid, .social-meta-grid, .settings-link-grid, .api-module-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .hermes-page { grid-template-columns: minmax(190px, 240px) minmax(0,1fr); }
    .top-search { width: min(400px, 33vw); }
}
@media (max-width: 850px) {
    .app-shell { display: block; width: 100%; }
    .sidebar {
        position: fixed; left: 0; top: 0;
        width: min(var(--sidebar-width), calc(100dvw - 54px));
        transform: translateX(-104%);
        box-shadow: 22px 0 70px rgba(0,0,0,.32);
        transition: transform 220ms cubic-bezier(.2,.8,.2,1);
    }
    .sidebar.open { transform: translateX(0); }
    body.menu-open .sidebar-backdrop { display: block; }
    .menu-button, .top-mobile-actions { display: flex; }
    .menu-button { display: grid; }
    .topbar { min-height: calc(66px + var(--safe-area-top)); padding: calc(10px + var(--safe-area-top)) calc(14px + var(--safe-area-right)) 10px calc(14px + var(--safe-area-left)); gap: 10px; }
    .top-title { min-width: 0; margin-right: auto; }
    .top-title h1 { max-width: min(50vw, 360px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1.15rem; }
    .top-title p { display: none; }
    .top-search, .top-actions { display: none; }
    .page-content { max-width: none; padding: 18px calc(14px + var(--safe-area-right)) calc(44px + var(--safe-area-bottom)) calc(14px + var(--safe-area-left)); }
    .flash { margin: 12px calc(14px + var(--safe-area-right)) 0 calc(14px + var(--safe-area-left)); }
    .grid-2, .grid-3 { grid-template-columns: 1fr; }
    .detail-header { flex-direction: column; }
    .detail-actions { width: 100%; flex-wrap: wrap; }
    .toolbar, .filter-bar, .page-header { align-items: stretch; flex-direction: column; }
    .toolbar > .button, .page-actions, .page-actions .button { width: 100%; }
    .search-form { width: 100%; max-width: none; }
    .form-actions { position: sticky; bottom: 0; z-index: 9; margin: 20px -20px -20px; padding: 12px 20px calc(12px + var(--safe-area-bottom)); border-top: 1px solid var(--color-border); background: color-mix(in srgb, var(--color-surface) 94%, transparent); backdrop-filter: blur(14px); }
    body.keyboard-open .form-actions { position: static; margin: 20px 0 0; padding: 0; border: 0; background: transparent; backdrop-filter: none; }
    .hermes-page { grid-template-columns: 1fr; }
    .hermes-conversations { height: auto; max-height: 180px; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 10px; }
    .hermes-conversations-head { grid-column: 1 / -1; }
    .hermes-conversation-tabs { grid-column: 1; flex-direction: column; align-items: stretch; overflow: visible; }
    .hermes-conversation-list { grid-column: 2; grid-auto-flow: column; grid-auto-columns: minmax(190px, 240px); overflow-x: auto; overflow-y: hidden; margin: 0; }
    .hermes-settings-link { display: none; }
    .hermes-chat { height: calc(100dvh - 66px - var(--safe-area-top) - 230px); min-height: 520px; }
    .zettle-settings-card { align-items: stretch; flex-direction: column; }
}
@media (max-width: 680px) {
    body { font-size: 1rem; }
    .panel { padding: 16px; border-radius: 13px; }
    .stats-grid, .grid-4, .social-kpi-grid, .settings-link-grid, .api-module-grid, .social-template-grid, .social-template-category-grid, .social-meta-grid { grid-template-columns: 1fr; }
    .stat-card { min-height: 112px; }
    .form-grid, .form-grid.compact { grid-template-columns: 1fr; }
    .span-2 { grid-column: auto; }
    input, select { min-height: 46px; }
    .button { min-height: 44px; }
    .button-small { min-height: 40px; }
    .search-form { flex-wrap: wrap; }
    .search-form input { flex-basis: 100%; }
    .search-form .button { flex: 1; }
    .panel-header { align-items: stretch; flex-direction: column; }
    .panel-header .button, .panel-header > a.button { width: 100%; }
    .form-actions .button { flex: 1 1 140px; }
    .detail-identity { align-items: flex-start; }
    .large-initial { width: 52px; height: 52px; font-size: 1.15rem; }
    .info-panel dl { grid-template-columns: 1fr; gap: 3px; }
    .info-panel dd { margin-bottom: 8px; }
    .deadline-item { grid-template-columns: 48px minmax(0,1fr); }
    .deadline-item time { grid-column: 2; }
    .quick-task-create { grid-template-columns: 1fr; }
    .quick-task-create .button { width: 100%; }
    .quote-customer-choices, .quote-add-grid { grid-template-columns: 1fr; }
    .quote-totals { flex-direction: column; gap: 0; }
    .quote-totals-group { width: 100%; flex-wrap: wrap; }
    .quote-total-item { flex: 1 1 140px; border-left: 0; border-top: 1px solid var(--color-border); padding-left: 0; }
    .hermes-conversations { display: block; max-height: 176px; }
    .hermes-conversation-tabs { flex-direction: row; margin-bottom: 8px; }
    .hermes-conversation-list { display: flex; overflow-x: auto; }
    .hermes-conversation-item { min-width: 210px; }
    .hermes-chat { height: calc(100dvh - 66px - var(--safe-area-top) - 225px); min-height: 460px; }
    .hermes-chat-header { padding: 14px; }
    .hermes-chat-header p { display: none; }
    .hermes-messages { padding: 14px 12px; }
    .hermes-message { grid-template-columns: 30px minmax(0,1fr); gap: 8px; }
    .hermes-message-avatar { width: 30px; height: 30px; }
    .hermes-composer-wrap { padding-inline: 12px; }
    .hermes-composer-footer { align-items: stretch; flex-direction: column; }
    .hermes-composer-footer .button { width: 100%; }
    .hermes-composer-footer span { display: none; }
    .hermes-floating-window { width: 100%; max-width: 100%; border-left: 0; padding-right: 0; }
    .auth-card { padding: 26px 20px; }

    /* Tables become cards on mobile */
    table.mobile-card-table, .mobile-card-table thead, .mobile-card-table tbody, .mobile-card-table tr, .mobile-card-table td { display: block; width: 100%; }
    .mobile-card-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
    .mobile-card-table tbody { display: grid; gap: 10px; padding: 10px; }
    .mobile-card-table tbody tr { overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); box-shadow: var(--shadow-xs); }
    .mobile-card-table tbody tr:hover { background: var(--color-surface); }
    .mobile-card-table td { min-height: 38px; display: grid; grid-template-columns: minmax(105px, .42fr) minmax(0, 1fr); align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--color-border); text-align: right; }
    .mobile-card-table td::before { content: attr(data-label); color: var(--color-text-muted); font-size: .65rem; font-weight: 820; letter-spacing: .04em; text-align: left; text-transform: uppercase; }
    .mobile-card-table td:last-child { border-bottom: 0; }
    .mobile-card-table td.mobile-card-full { display: block; text-align: left; }
    .mobile-card-table td.mobile-card-full::before { display: none; }
    .mobile-card-table td.actions-cell, .mobile-card-table td[data-label="Actions"] { display: flex; justify-content: flex-end; gap: 8px; }
    .mobile-card-table td.actions-cell::before, .mobile-card-table td[data-label="Actions"]::before { margin-right: auto; }
    .mobile-card-table .identity-cell { justify-content: flex-end; }
    .mobile-card-table td strong, .mobile-card-table td small { text-align: right; }
    .table-panel > .panel-header { padding: 16px 16px 0; }
}
@media (max-width: 430px) {
    .page-content { padding-inline: calc(10px + var(--safe-area-left)) calc(10px + var(--safe-area-right)); }
    .topbar { padding-inline: calc(10px + var(--safe-area-left)) calc(10px + var(--safe-area-right)); }
    .top-title h1 { max-width: 42vw; }
    .panel { padding: 14px; }
    .form-actions { margin: 18px -14px -14px; padding-inline: 14px; }
    .quick-task-row { grid-template-columns: 7px minmax(0,1fr); }
    .quick-task-delay, .quick-task-actions { grid-column: 2; }
    .quick-task-actions { justify-content: flex-start; flex-wrap: wrap; }
    .zettle-chart { min-height: 215px; }
    .zettle-bar { min-width: 42px; }
    .mobile-card-table td { grid-template-columns: minmax(88px, .38fr) minmax(0,1fr); padding-inline: 10px; }
}
@media (display-mode: standalone) and (max-width: 850px) {
    html, body, .app-shell, .main-content { width: 100%; max-width: 100%; }
    .topbar { padding-top: calc(10px + var(--safe-area-top)); }
    .page-content { padding-bottom: calc(54px + var(--safe-area-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}
@media print {
    .sidebar, .topbar, .sidebar-backdrop, .hermes-floating-overlay, .flash, .form-actions, .button, button { display: none !important; }
    .app-shell { display: block; }
    .page-content { max-width: none; padding: 0; }
    .panel { box-shadow: none; break-inside: avoid; }
    body { background: #fff; color: #000; }
}

/* États réseau et compléments v0.8.0 */
.network-status {
    position: sticky;
    top: calc(var(--topbar-height) + var(--safe-area-top));
    z-index: 24;
    max-width: var(--content-max);
    margin: 0 auto;
    padding: 9px 16px;
    border-bottom: 1px solid color-mix(in srgb, var(--color-warning) 34%, transparent);
    background: var(--color-warning-soft);
    color: var(--color-warning);
    font-size: .74rem;
    font-weight: 760;
    text-align: center;
}
.zettle-bar-negative { background: linear-gradient(180deg, var(--color-danger), var(--danger-700)); }
@media (max-width: 850px) {
    .network-status { top: calc(66px + var(--safe-area-top)); }
}
.settings-management-panel, .contract-config-panel { min-width: 0; }
.quote-company-field[hidden], .structure-field[hidden] { display: none !important; }
.quick-task-input { min-width: 0; }
.quote-list-toolbar { align-items: flex-start; }
.quote-totals-sale { margin-left: auto; }
.social-template-style-form { display: grid; gap: 12px; }
@media (max-width: 680px) {
    .quote-list-toolbar { flex-direction: column; align-items: stretch; }
    .quote-totals-sale { margin-left: 0; }
}
@media (max-width: 850px) {
    .top-mobile-actions .top-icon-button { display: grid; }
}

/* --- Component completion: operational tasks and ticket messages --- */
.task-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(116px, 150px) auto auto;
  gap: var(--space-3);
  align-items: center;
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  border-left: 4px solid transparent;
  background: var(--color-surface);
}

.task-row:last-child { border-bottom: 0; }
.task-row > div:first-child { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.task-row > div:first-child span { color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-row time { color: var(--color-text-muted); font-variant-numeric: tabular-nums; }
.task-row .row-actions { justify-content: flex-end; }
.task-row.priority-low { border-left-color: var(--color-text-subtle); }
.task-row.priority-normal { border-left-color: var(--color-info); }
.task-row.priority-high { border-left-color: var(--color-warning); }
.task-row.priority-urgent { border-left-color: var(--color-danger); }

.message-card {
  margin-bottom: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
  box-shadow: var(--shadow-xs);
}

.message-card.draft {
  border-style: dashed;
  border-color: var(--color-warning);
  background: var(--color-warning-soft);
}

.message-card header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-3);
  margin-bottom: var(--space-2);
}

.message-card header span { color: var(--color-text-muted); font-size: var(--text-xs); }
.message-card p { margin: 0; line-height: 1.65; overflow-wrap: anywhere; }

@media (max-width: 680px) {
  .task-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }
  .task-row time,
  .task-row > .badge { justify-self: start; }
  .task-row .row-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .message-card header { align-items: flex-start; flex-direction: column; gap: 2px; }
}

/* --------------------------------------------------------------------------
   Correctifs UI v0.8.0.1
   Contraste clair, recherche, Zettle, tâches, agenda, Hermes et social.
   -------------------------------------------------------------------------- */

/* Contraste clair : neutralise les inversions accidentelles héritées. */
html.theme-light body,
html.theme-light .page-content,
html.theme-light .panel,
html.theme-light .stat-card,
html.theme-light .summary-card,
html.theme-light .social-template-card,
html.theme-light .social-template-category-card,
html.theme-light .social-linked-template {
    color: var(--color-text);
}

html.theme-light h1,
html.theme-light h2,
html.theme-light h3,
html.theme-light h4,
html.theme-light .topbar h1,
html.theme-light .panel h2,
html.theme-light .panel h3,
html.theme-light .detail-identity h2,
html.theme-light td strong,
html.theme-light .stat-card > strong,
html.theme-light .summary-card strong,
html.theme-light label {
    color: var(--color-text-strong);
}

html.theme-light p,
html.theme-light small,
html.theme-light .muted,
html.theme-light .panel-header p,
html.theme-light .page-header p,
html.theme-light .stat-card > span,
html.theme-light .summary-card > span,
html.theme-light .stat-card small,
html.theme-light .summary-card small,
html.theme-light .link-button,
html.theme-light .zettle-periods a,
html.theme-light .zettle-tabs button,
html.theme-light .social-tabs a,
html.theme-light .view-switcher a,
html.theme-light .hermes-conversation-tabs a {
    color: var(--color-text-muted);
}

html.theme-light input,
html.theme-light select,
html.theme-light textarea,
html.theme-light .rich-editor,
html.theme-light .api-secret,
html.theme-light .timer-box > span,
html.theme-light .top-search input {
    color: var(--color-text);
    background: var(--color-surface);
    border-color: var(--color-border-strong);
}

html.theme-light input::placeholder,
html.theme-light textarea::placeholder {
    color: var(--color-text-subtle);
}

html.theme-light .button-secondary,
html.theme-light .menu-button,
html.theme-light .icon-button,
html.theme-light .rich-toolbar button,
html.theme-light .count-pill {
    color: var(--color-text);
    background: var(--color-surface-raised);
    border-color: var(--color-border-strong);
}

html.theme-light .button-secondary:hover,
html.theme-light .menu-button:hover,
html.theme-light .icon-button:hover,
html.theme-light .rich-toolbar button:hover {
    color: var(--color-text-strong);
    background: var(--color-surface-hover);
}

html.theme-light th,
html.theme-light .week-day > header,
html.theme-light .month-weekdays span,
html.theme-light .month-day > header small,
html.theme-light .view-switcher,
html.theme-light .quote-totals,
html.theme-light .rich-toolbar,
html.theme-light .document-block-head {
    color: var(--color-text);
    background: var(--color-surface-raised);
}

/* Recherche supérieure : réserve toujours la place de la loupe. */
.top-search input,
html.theme-light .top-search input {
    padding-left: 42px !important;
    padding-right: 44px !important;
}
.top-search > svg { left: 14px; z-index: 2; }

/* Zettle : toutes les barres restent dans le panneau, sans défilement horizontal. */
.zettle-chart-panel { overflow: visible; }
.zettle-chart {
    width: 100%;
    min-width: 0;
    min-height: 290px;
    display: grid;
    grid-template-columns: repeat(var(--zettle-points, 1), minmax(0, 1fr));
    align-items: end;
    gap: clamp(4px, .8vw, 12px);
    overflow: visible;
    padding: 42px 18px 48px;
}
.zettle-bar {
    width: 100%;
    min-width: 0;
    max-width: none;
    flex: none;
}
.zettle-bar strong { font-size: .65rem; }
.zettle-bar span {
    top: calc(100% + 9px);
    font-size: .62rem;
    line-height: 1;
    white-space: nowrap;
}
@media (max-width: 700px) {
    .zettle-chart { min-height: 250px; padding-inline: 8px; gap: 3px; }
    .zettle-bar strong { font-size: .56rem; }
    .zettle-bar span { font-size: .54rem; transform: translateX(-50%) rotate(-38deg); transform-origin: top center; }
}

/* Tâches rapides : structure à quatre zones et couleurs de retard restaurées. */
.quick-task-row {
    grid-template-columns: 8px minmax(0, 1fr) auto auto;
    align-items: center;
}
.quick-task-check-form { grid-row: auto !important; padding: 0 !important; margin: 0; }
.quick-task-row > form:last-child { margin: 0; }
.quick-task-today .quick-task-indicator,
.quick-task-row.is-today .quick-task-indicator { background: var(--color-success); }
.quick-task-warning .quick-task-indicator,
.quick-task-row.is-warning .quick-task-indicator { background: var(--color-warning); }
.quick-task-overdue .quick-task-indicator,
.quick-task-row.is-overdue .quick-task-indicator { background: var(--color-danger); }
.quick-task-today .quick-task-delay {
    color: var(--color-success);
    background: var(--color-success-soft);
}
.quick-task-warning .quick-task-delay {
    color: var(--color-warning);
    background: var(--color-warning-soft);
}
.quick-task-overdue .quick-task-delay {
    color: var(--color-danger);
    background: var(--color-danger-soft);
}
.quick-task-delay {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 9px;
    border-radius: 999px;
}
@media (max-width: 700px) {
    .quick-task-row { grid-template-columns: auto 7px minmax(0,1fr); }
    .quick-task-delay,
    .quick-task-row > form:last-child { grid-column: 3; justify-self: start; }
}

/* Agenda : différenciation visuelle des priorités. */
.calendar-task,
.month-task { border-left-width: 4px; }
.calendar-task.priority-low,
.month-task.priority-low { border-left-color: var(--color-info); background: var(--color-info-soft); }
.calendar-task.priority-normal,
.month-task.priority-normal { border-left-color: var(--color-success); background: var(--color-success-soft); }
.calendar-task.priority-high,
.month-task.priority-high { border-left-color: var(--color-warning); background: var(--color-warning-soft); }
.calendar-task.priority-urgent,
.month-task.priority-urgent { border-left-color: var(--color-danger); background: var(--color-danger-soft); }
.calendar-task:hover,
.month-task:hover { filter: saturate(1.08); }

/* Hermes : conversation pleine largeur et zone de lecture recentrée. */
.hermes-page { width: 100%; max-width: none; }
.hermes-chat { width: 100%; max-width: none; }
.hermes-messages,
.hermes-composer,
.hermes-chat-header { width: 100%; }
.hermes-messages > * { max-width: 1100px; margin-left: auto; margin-right: auto; }
.hermes-message { width: 100%; }
.hermes-message-content { color: var(--color-text); }
@media (max-width: 1100px) {
    .hermes-page { grid-template-columns: minmax(190px, 240px) minmax(0,1fr); }
}
@media (max-width: 820px) {
    .hermes-page { display: block; }
    .hermes-conversations { height: auto; max-height: 240px; margin-bottom: 12px; }
    .hermes-chat { min-height: 520px; }
}
.hermes-floating-body .hermes-messages > *,
.hermes-floating-body .hermes-composer > *,
.hermes-floating-body .hermes-chat-header > * { max-width: none; }

/* Réseaux sociaux : respiration, aperçu permanent et suppression du logo plein cadre. */
.social-tabs { margin-bottom: 16px; }
.social-template-category-grid,
.social-template-grid { padding: 16px 20px 20px; }
.social-template-category-card { padding: 18px; }
.social-template-category-card strong { display: block; margin-bottom: 7px; color: var(--color-text-strong); }
.social-template-category-card span { display: block; color: var(--color-text-muted); line-height: 1.45; }
.social-template-live-preview {
    position: relative;
    display: block;
    background: var(--tpl-bg, var(--color-bg-subtle));
}
.social-template-live-preview > img { display: none !important; }
.social-template-pill,
.social-template-alert,
.social-template-preview-box { opacity: 1; visibility: visible; }
html.theme-light .social-template-card,
html.theme-light .social-template-category-card,
html.theme-light .social-linked-template {
    color: var(--color-text);
    background: var(--color-surface);
    border-color: var(--color-border);
}
html.theme-light .social-template-card-body,
html.theme-light .social-template-style-form,
html.theme-light .social-template-style-form label {
    color: var(--color-text);
    background: transparent;
}

/* --------------------------------------------------------------------------
   Correctifs UI v0.8.0.2
   Hermes, navigation Facturation, templates sociaux, tâches mobiles et PWA.
   -------------------------------------------------------------------------- */

/* Le sous-menu ne réserve aucun espace lorsqu'il est fermé. */
.nav-submenu {
    display: none;
    opacity: 0;
}
.nav-group.is-open .nav-submenu {
    display: grid;
    opacity: 1;
}
.nav-group:not(.is-open) .nav-submenu a {
    margin-top: 0;
    margin-bottom: 0;
}

/* Le lien d'évitement reste disponible au clavier sur ordinateur, mais pas en webapp tactile. */
@media (display-mode: standalone), (hover: none), (pointer: coarse) {
    .skip-link { display: none !important; }
}

/* Hermes : centre réellement la conversation dans la colonne visible. */
.hermes-chat,
.hermes-messages,
.hermes-welcome,
.hermes-welcome.compact {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
.hermes-messages > .hermes-welcome,
.hermes-messages > .hermes-welcome.compact {
    width: 100%;
    max-width: none;
    margin: 0;
    justify-self: stretch;
    align-self: stretch;
    place-content: center;
    justify-items: center;
}
.hermes-welcome h2,
.hermes-welcome h3,
.hermes-welcome p { text-align: center; }
.hermes-message,
.hermes-composer-wrap > *,
.hermes-chat-header > * { min-width: 0; }

/* Tiroir Hermes : évite le bouton d'envoi en bande pleine et garde le contenu centré. */
.hermes-floating-body .hermes-welcome,
.hermes-floating-body .hermes-welcome.compact { width: 100%; }
.hermes-floating-body .hermes-composer-footer { align-items: center; }
.hermes-floating-body .hermes-composer-footer .button { width: auto; flex: 0 0 auto; }

/* Catégories sociales : icônes distinctes et alignement propre. */
.social-template-category-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    column-gap: 13px;
    row-gap: 4px;
    align-items: start;
}
.social-template-category-icon {
    grid-row: 1 / span 2;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: var(--color-primary-soft);
    color: var(--color-primary-hover);
    border: 1px solid var(--color-primary-border);
}
.social-template-category-icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.social-template-category-card strong,
.social-template-category-card span { grid-column: 2; }

/* Tâches mobiles : le bloc d'ajout défile normalement et chaque tâche est mieux séparée. */
.quick-task-row {
    box-shadow: var(--shadow-sm);
    border-left: 4px solid var(--color-border-strong);
}
.quick-task-future { border-left-color: var(--color-info); background: color-mix(in srgb, var(--color-info-soft) 42%, var(--color-surface)); }
.quick-task-today { border-left-color: var(--color-success); background: color-mix(in srgb, var(--color-success-soft) 46%, var(--color-surface)); }
.quick-task-late-warning { border-left-color: var(--color-warning); background: color-mix(in srgb, var(--color-warning-soft) 48%, var(--color-surface)); }
.quick-task-late-danger { border-left-color: var(--color-danger); background: color-mix(in srgb, var(--color-danger-soft) 48%, var(--color-surface)); }
.quick-task-future .quick-task-indicator { background: var(--color-info); }
.quick-task-today .quick-task-indicator { background: var(--color-success); }
.quick-task-late-warning .quick-task-indicator { background: var(--color-warning); }
.quick-task-late-danger .quick-task-indicator { background: var(--color-danger); }
.quick-task-future .quick-task-delay { color: var(--color-info); background: var(--color-info-soft); }
.quick-task-today .quick-task-delay { color: var(--color-success); background: var(--color-success-soft); }
.quick-task-late-warning .quick-task-delay { color: var(--color-warning); background: var(--color-warning-soft); }
.quick-task-late-danger .quick-task-delay { color: var(--color-danger); background: var(--color-danger-soft); }

@media (max-width: 820px) {
    .quick-task-create-panel {
        position: static;
        top: auto;
        z-index: auto;
    }
    .quick-task-list { gap: 11px; }
    .quick-task-row { border-radius: 14px; padding: 13px 12px; }
}

/* Ailink Gestion v0.8.0.3 — correctifs Hermes et historique des tâches */
/* Hermes : l’état vide occupe explicitement toute la zone et reste centré. */
.hermes-messages.is-empty {
    display: grid;
    place-items: center;
    align-content: center;
    justify-content: stretch;
}
.hermes-messages.is-empty > .hermes-welcome,
.hermes-messages.is-empty > .hermes-welcome.compact {
    width: min(100%, 760px);
    min-height: auto;
    margin: 0 auto;
    padding: 28px;
    place-self: center;
    place-content: center;
    justify-items: center;
    text-align: center;
}
.hermes-messages.is-empty .hermes-orb,
.hermes-messages.is-empty h2,
.hermes-messages.is-empty h3,
.hermes-messages.is-empty p {
    margin-left: auto;
    margin-right: auto;
}

/* Tâches terminées et retirées : grille sans colonne de case à cocher. */
.quick-task-history .quick-task-row {
    grid-template-columns: 8px minmax(0, 1fr) auto auto;
}
.quick-task-history .quick-task-row > .quick-task-indicator { grid-column: 1; }
.quick-task-history .quick-task-row > .quick-task-main { grid-column: 2; }
.quick-task-history .quick-task-row > .quick-task-delay { grid-column: 3; }
.quick-task-history .quick-task-row > form:last-child {
    grid-column: 4;
    justify-self: end;
}

@media (max-width: 700px) {
    .quick-task-history .quick-task-row {
        grid-template-columns: 7px minmax(0, 1fr);
        align-items: start;
    }
    .quick-task-history .quick-task-row > .quick-task-indicator {
        grid-column: 1;
        grid-row: 1 / span 3;
    }
    .quick-task-history .quick-task-row > .quick-task-main,
    .quick-task-history .quick-task-row > .quick-task-delay,
    .quick-task-history .quick-task-row > form:last-child {
        grid-column: 2;
        justify-self: start;
    }
}


/* --------------------------------------------------------------------------
   Correctif UI v0.8.0.4 — cadrage interne Hermes
   L'état vide est centré dans la zone de messages et le compositeur reste
   intégralement contenu dans la largeur réellement disponible.
   -------------------------------------------------------------------------- */
.hermes-chat {
    min-width: 0;
    overflow: hidden;
}

.hermes-messages {
    position: relative;
    width: auto;
    min-width: 0;
    max-width: none;
}

.hermes-messages.is-empty {
    display: block;
}

.hermes-messages.is-empty > .hermes-welcome.compact {
    position: absolute;
    inset: 0;
    width: auto;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 24px;
    display: grid;
    place-content: center;
    justify-items: center;
    text-align: center;
    overflow: hidden;
}

.hermes-messages.is-empty > .hermes-welcome.compact > * {
    max-width: min(620px, 100%);
    margin-left: auto;
    margin-right: auto;
}

.hermes-composer-wrap {
    min-width: 0;
    overflow: hidden;
}

.hermes-composer-wrap > .hermes-quick-prompts,
.hermes-composer-wrap > .hermes-composer {
    width: min(100%, 1100px);
    max-width: 100%;
    min-width: 0;
    margin-left: auto;
    margin-right: auto;
}

.hermes-quick-prompts {
    min-width: 0;
    max-width: 100%;
}

.hermes-composer {
    display: block;
    min-width: 0;
}

.hermes-composer textarea {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.hermes-composer-footer {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.hermes-composer-footer .button {
    flex: 0 0 auto;
    margin-left: auto;
}

.hermes-floating-body .hermes-composer-wrap > .hermes-quick-prompts,
.hermes-floating-body .hermes-composer-wrap > .hermes-composer {
    width: 100%;
}

@media (max-width: 820px) {
    .hermes-messages.is-empty > .hermes-welcome.compact {
        padding: 18px;
    }

    .hermes-composer-footer .button {
        width: 100%;
        margin-left: 0;
    }
}

/* --------------------------------------------------------------------------
   Correctif UI v0.8.0.5 — Hermes : suggestions, tiroir et ordre mobile
   -------------------------------------------------------------------------- */
.hermes-quick-prompts {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-behavior: smooth;
    scroll-snap-type: inline proximity;
    touch-action: pan-x;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: var(--color-border-strong) transparent;
    padding: 0 10px 7px 0;
}
.hermes-quick-prompts::-webkit-scrollbar {
    display: block;
    height: 5px;
}
.hermes-quick-prompts::-webkit-scrollbar-track { background: transparent; }
.hermes-quick-prompts::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: var(--color-border-strong);
}
.hermes-quick-prompts button { scroll-snap-align: start; }
.hermes-quick-prompts:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 3px;
    border-radius: 10px;
}

/* Le même centrage s'applique explicitement dans le panneau latéral Hermes. */
.hermes-floating-body .hermes-messages.is-empty {
    position: relative;
    display: block;
}
.hermes-floating-body .hermes-messages.is-empty > .hermes-welcome.compact {
    position: absolute;
    inset: 0;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 0;
    margin: 0;
    padding: 24px;
    display: grid;
    place-content: center;
    justify-items: center;
    text-align: center;
}
.hermes-floating-body .hermes-messages.is-empty > .hermes-welcome.compact > * {
    max-width: min(420px, 100%);
    margin-inline: auto;
}

/* Sur mobile : le chat occupe le premier écran, la liste des conversations suit. */
@media (max-width: 820px) {
    .hermes-page {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .hermes-chat {
        order: 1;
        width: 100%;
        height: calc(var(--visual-viewport-height, 100dvh) - var(--topbar-height) - var(--safe-area-top) - 24px);
        min-height: calc(var(--visual-viewport-height, 100dvh) - var(--topbar-height) - var(--safe-area-top) - 24px);
        max-height: none;
    }
    .hermes-conversations {
        order: 2;
        width: 100%;
        height: auto;
        max-height: none;
        overflow: visible;
        margin-bottom: calc(16px + var(--safe-area-bottom));
    }
    .hermes-conversation-list {
        max-height: none;
        overflow-x: auto;
        overflow-y: visible;
    }
    .hermes-quick-prompts {
        padding-bottom: 8px;
    }
}

/* Dans le tiroir, le chat reste plein écran et la liste demeure masquée. */
.hermes-floating-body .hermes-page {
    display: block;
    height: 100dvh;
}
.hermes-floating-body .hermes-chat {
    order: initial;
    height: 100dvh;
    min-height: 100dvh;
}

/* v0.8.0.6 — Authentification */
.auth-remember {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    color: var(--color-text);
    font-size: .82rem;
    cursor: pointer;
}
.auth-remember input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-height: 0;
    margin: 0;
    accent-color: var(--color-primary);
}

/* Clients : sélecteur Professionnels / Particuliers */
.client-segment-tabs {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    margin: 0 0 18px;
    padding: 5px;
    overflow-x: auto;
    scrollbar-width: none;
    border: 1px solid var(--color-border-strong);
    border-radius: 12px;
    background: var(--color-surface-raised);
    box-shadow: var(--shadow-sm);
    -webkit-overflow-scrolling: touch;
}
.client-segment-tabs::-webkit-scrollbar { display: none; }
.client-segment-tabs a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--color-text-muted);
    background: transparent;
    font-size: .76rem;
    font-weight: 800;
    white-space: nowrap;
}
.client-segment-tabs a:hover {
    color: var(--color-text-strong);
    background: var(--color-surface-hover);
}
.client-segment-tabs a.active {
    color: #fff;
    background: var(--color-primary);
    border-color: var(--color-primary);
    box-shadow: 0 4px 12px rgba(220, 38, 38, .22);
}
html.theme-light .client-segment-tabs {
    background: var(--color-surface-raised);
    border-color: var(--color-border-strong);
}
html.theme-light .client-segment-tabs a { color: var(--color-text-muted); }
html.theme-light .client-segment-tabs a.active { color: #fff; }

@media (max-width: 760px) {
    .client-segment-tabs { width: 100%; }
    .client-segment-tabs a { flex: 1 0 auto; }
}


/* Hermes : indicateurs de réponses non lues. */
.hermes-button-with-badge { position: relative; }
.hermes-unread-badge {
    display: inline-grid;
    place-items: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--color-danger, #dc3545);
    color: #fff;
    font-size: .62rem;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 0 0 2px var(--color-surface, #11151c);
}
.hermes-unread-badge[hidden] { display: none !important; }
.top-icon-button .hermes-unread-badge { position: absolute; top: -5px; right: -5px; }
.top-hermes-button .hermes-unread-badge { margin-left: 4px; box-shadow: none; }
.hermes-conversation-item strong { display: flex; align-items: center; gap: 7px; }
.hermes-conversation-unread {
    display: inline-grid;
    place-items: center;
    min-width: 18px;
    height: 18px;
    margin-left: auto;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--color-primary);
    color: #fff;
    font-size: .6rem;
    flex: 0 0 auto;
}


/* Tableau de bord : tâches combinées et derniers contrats repliables. */
.panel-header-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.dashboard-task-source { white-space: nowrap; }
.dashboard-collapsible { padding: 0; overflow: hidden; }
.dashboard-collapsible > summary {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 18px 20px; cursor: pointer; list-style: none; font-weight: 700;
}
.dashboard-collapsible > summary::-webkit-details-marker { display: none; }
.dashboard-collapsible > summary:hover { background: var(--color-surface-raised); }
.dashboard-collapsible-icon { transition: transform .18s ease; }
.dashboard-collapsible[open] .dashboard-collapsible-icon { transform: rotate(180deg); }
.dashboard-collapsible-content { padding: 0 20px 20px; border-top: 1px solid var(--color-border); }
.dashboard-collapsible-toolbar { padding-top: 14px; margin-bottom: 4px; }
@media (max-width: 700px) {
    .panel-header-actions { gap: 8px; }
    .dashboard-collapsible > summary { padding: 16px; }
    .dashboard-collapsible-content { padding: 0 16px 16px; }
}


/* Messagerie */
.messaging-stats{margin-bottom:1rem}.messaging-stats .stat-card{text-decoration:none;color:inherit}.messaging-stats .stat-card strong{font-size:2rem}.mail-unread td{font-weight:600}.mail-unread td small{font-weight:400}.mail-content{white-space:pre-wrap;overflow-wrap:anywhere}.stack-actions{display:grid;gap:.65rem}.stack-actions form,.stack-actions button{width:100%}.inline-actions{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}

/* Messagerie v0.8.3.2 */
.messaging-toolbar-actions{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.messaging-toolbar-actions form{margin:0}.mail-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:.45rem}.mail-row-actions form{margin:0}.button-icon{min-width:2.25rem;padding-inline:.55rem}.button-danger-soft{background:rgba(185,28,28,.10);border-color:rgba(185,28,28,.35);color:#b91c1c}.button-danger-soft:hover{background:#b91c1c;border-color:#b91c1c;color:#fff}.mail-status{border:1px solid transparent}.mail-status-new{background:rgba(37,99,235,.14);border-color:rgba(37,99,235,.28);color:#1d4ed8}.mail-status-todo{background:rgba(234,88,12,.14);border-color:rgba(234,88,12,.28);color:#c2410c}.mail-status-waiting{background:rgba(202,138,4,.14);border-color:rgba(202,138,4,.28);color:#a16207}.mail-status-done,.mail-status-sent{background:rgba(22,163,74,.14);border-color:rgba(22,163,74,.28);color:#15803d}.mail-status-archived,.mail-status-cancelled{background:rgba(100,116,139,.16);border-color:rgba(100,116,139,.28);color:#475569}.mail-status-draft,.mail-status-approved{background:rgba(124,58,237,.14);border-color:rgba(124,58,237,.28);color:#6d28d9}.mail-status-error{background:rgba(220,38,38,.14);border-color:rgba(220,38,38,.28);color:#b91c1c}.mail-priority-low{background:rgba(100,116,139,.15);color:#475569}.mail-priority-normal{background:rgba(37,99,235,.13);color:#1d4ed8}.mail-priority-high{background:rgba(234,88,12,.14);color:#c2410c}.mail-priority-urgent{background:rgba(220,38,38,.14);color:#b91c1c}@media(max-width:640px){.messaging-toolbar-actions{width:100%}.messaging-toolbar-actions form,.messaging-toolbar-actions .button{flex:1;text-align:center}.mail-row-actions{justify-content:flex-start}}

/* Messagerie v0.8.3.3 */
.messaging-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:0 0 1rem}.messaging-tabs a{display:inline-flex;align-items:center;min-height:2.45rem;padding:.6rem .9rem;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface);color:var(--color-text-muted);text-decoration:none;font-weight:700;transition:.18s ease}.messaging-tabs a:hover{border-color:var(--color-primary);background:var(--color-primary-soft);color:var(--color-text)}.messaging-tabs a.active{border-color:var(--color-primary);background:var(--color-primary);color:#fff}.mail-row[data-href]{cursor:pointer}.mail-row[data-href]:hover td{background:var(--color-primary-soft)}.mail-row[data-href]:focus{outline:2px solid var(--color-primary);outline-offset:-2px}.mail-row-delete{margin:0}.mail-content{white-space:normal;line-height:1.65}.mail-content p{margin:.45rem 0}.mail-content br{content:""}.mail-content blockquote{margin:1rem 0;padding-left:1rem;border-left:3px solid var(--color-border)}


/* Messagerie v0.8.3.4 — ouverture fiable des lignes sans JavaScript inline */
.mail-row{cursor:pointer}.mail-row:hover td{background:var(--color-primary-soft)}.mail-cell-link{display:flex;align-items:center;width:100%;min-height:3.25rem;padding:0;color:inherit;text-decoration:none}.mail-cell-link:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px;border-radius:6px}.mail-subject-link{align-items:flex-start;justify-content:center;flex-direction:column}.mail-subject-link small{display:block}.mail-row td:last-child{cursor:default}

/* Messagerie v0.8.3.5 */
.mail-detail-back{display:flex;justify-content:flex-start;margin-bottom:1rem}.mail-client-form{display:grid;gap:.85rem}.mail-client-form .button{justify-self:start}.mail-read{background:rgba(22,163,74,.14);border:1px solid rgba(22,163,74,.28);color:#15803d}.mail-not-read{background:rgba(37,99,235,.14);border:1px solid rgba(37,99,235,.28);color:#1d4ed8}.mail-replied-icon{display:inline-block;margin-left:.45rem;font-size:.9em}.mail-replied-label{display:inline-flex;align-items:center;margin-left:.55rem;font-weight:700;color:var(--color-text-muted)}.email-send-panel{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;margin-top:1rem}.email-send-panel>div{min-width:0}.email-send-panel form{margin:0;flex:0 0 auto}.email-send-panel .button{white-space:nowrap}@media(max-width:700px){.email-send-panel{align-items:stretch;flex-direction:column}.email-send-panel form,.email-send-panel .button{width:100%}}

.mail-draft-send-actions{display:flex;justify-content:flex-end;margin-top:1rem}.mail-draft-send-actions form{margin:0}@media(max-width:640px){.mail-draft-send-actions{justify-content:stretch}.mail-draft-send-actions form,.mail-draft-send-actions .button{width:100%}}


/* Messagerie v0.8.3.17 — interface webmail simplifiée */
.webmail-page-toolbar{margin-bottom:1rem}.webmail-shell{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:66vh;border:1px solid var(--color-border);border-radius:18px;overflow:hidden;background:var(--color-surface);box-shadow:var(--shadow-sm)}.webmail-sidebar{display:flex;flex-direction:column;gap:1rem;padding:1rem;border-right:1px solid var(--color-border);background:var(--color-surface-raised)}.webmail-sidebar-title{padding:.35rem .65rem;color:var(--color-text);font-size:1.02rem;font-weight:800}.webmail-folder-nav{display:grid;gap:.2rem}.webmail-folder-link{display:grid;grid-template-columns:1.6rem minmax(0,1fr) auto;align-items:center;gap:.5rem;min-height:2.55rem;padding:.58rem .7rem;border-radius:10px;color:var(--color-text-muted);font-weight:650;text-decoration:none;transition:background .16s ease,color .16s ease}.webmail-folder-link:hover{background:var(--color-primary-soft);color:var(--color-text)}.webmail-folder-link.active{background:var(--color-primary-soft);color:var(--color-primary);font-weight:800}.webmail-folder-icon{display:grid;place-items:center;width:1.6rem;font-size:1rem}.webmail-folder-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.webmail-folder-count{display:inline-grid;place-items:center;min-width:1.45rem;height:1.45rem;padding:0 .35rem;border-radius:999px;background:var(--color-primary);color:#fff;font-size:.72rem;font-weight:800}.webmail-sidebar-section{padding-top:.9rem;border-top:1px solid var(--color-border)}.webmail-sidebar-heading{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:0 .65rem .45rem;color:var(--color-text-muted);font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.webmail-online-dot{width:.5rem;height:.5rem;border-radius:50%;background:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.12)}.webmail-folder-empty,.webmail-folder-warning{display:block;margin:.45rem .7rem;color:var(--color-text-muted);font-size:.78rem;line-height:1.4}.webmail-folder-warning{color:#b45309}.webmail-sidebar-tools{display:grid;gap:.15rem;margin-top:auto}.webmail-sidebar-tools a{padding:.48rem .7rem;border-radius:8px;color:var(--color-text-muted);font-size:.84rem;text-decoration:none}.webmail-sidebar-tools a:hover{background:var(--color-primary-soft);color:var(--color-text)}.webmail-main{min-width:0;background:var(--color-surface)}.webmail-list-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:76px;padding:1rem 1.25rem;border-bottom:1px solid var(--color-border)}.webmail-list-header h3{margin:0 0 .15rem;font-size:1.12rem}.webmail-list-header span{color:var(--color-text-muted);font-size:.82rem}.webmail-list-header form{margin:0}.webmail-message-list{display:grid}.webmail-message-row{display:grid;grid-template-columns:minmax(0,1fr) auto;border-bottom:1px solid var(--color-border);background:var(--color-surface);transition:background .15s ease}.webmail-message-row:hover{background:var(--color-primary-soft)}.webmail-message-row.is-unread{background:color-mix(in srgb,var(--color-primary-soft) 55%,var(--color-surface))}.webmail-message-link{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(260px,2fr) minmax(145px,.65fr);align-items:center;gap:1rem;min-width:0;padding:.85rem 1rem;color:inherit;text-decoration:none}.webmail-message-sender,.webmail-message-content,.webmail-message-meta{min-width:0}.webmail-message-sender strong,.webmail-message-subject{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.webmail-message-row.is-unread .webmail-message-sender strong,.webmail-message-row.is-unread .webmail-message-subject{font-weight:850}.webmail-message-sender span{display:block;overflow:hidden;margin-top:.18rem;color:var(--color-text-muted);font-size:.74rem;text-overflow:ellipsis;white-space:nowrap}.webmail-message-subject{font-weight:700}.webmail-message-snippet{overflow:hidden;margin-top:.2rem;color:var(--color-text-muted);font-size:.82rem;text-overflow:ellipsis;white-space:nowrap}.webmail-message-meta{display:grid;justify-items:end;gap:.35rem;color:var(--color-text-muted);font-size:.76rem;text-align:right}.webmail-read-state{display:inline-flex;align-items:center;min-height:1.45rem;padding:.15rem .5rem;border-radius:999px;background:var(--color-surface-raised);color:var(--color-text-muted);font-size:.7rem;font-weight:750}.webmail-read-state.is-unread{background:var(--color-primary);color:#fff}.webmail-message-action{display:flex;align-items:center;padding-right:.75rem}.webmail-message-action form{margin:0}.webmail-empty-state{display:grid;justify-items:center;gap:.4rem;padding:4rem 1rem;color:var(--color-text-muted);text-align:center}.webmail-empty-state strong{color:var(--color-text)}
@media(max-width:980px){.webmail-shell{grid-template-columns:210px minmax(0,1fr)}.webmail-message-link{grid-template-columns:minmax(125px,.72fr) minmax(220px,1.8fr) minmax(120px,.55fr);gap:.75rem}}
@media(max-width:780px){.webmail-shell{display:block;min-height:0}.webmail-sidebar{border-right:0;border-bottom:1px solid var(--color-border)}.webmail-sidebar-title{display:none}.webmail-folder-nav{display:flex;gap:.35rem;overflow-x:auto;padding-bottom:.25rem;scrollbar-width:thin}.webmail-folder-link{flex:0 0 auto;grid-template-columns:1.35rem auto auto;min-height:2.35rem;padding:.48rem .65rem;border:1px solid var(--color-border);background:var(--color-surface)}.webmail-folder-link.active{border-color:var(--color-primary)}.webmail-sidebar-section{padding-top:.65rem}.webmail-server-folders{max-width:100%}.webmail-sidebar-tools{display:flex;margin-top:0;overflow-x:auto}.webmail-sidebar-tools .webmail-sidebar-heading{display:none}.webmail-sidebar-tools a{flex:0 0 auto;border:1px solid var(--color-border);background:var(--color-surface)}.webmail-folder-warning{margin-left:.2rem}.webmail-message-link{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"sender meta" "content content";gap:.45rem .8rem}.webmail-message-sender{grid-area:sender}.webmail-message-content{grid-area:content}.webmail-message-meta{grid-area:meta}.webmail-read-state{display:none}}
@media(max-width:560px){.webmail-list-header{align-items:flex-start;flex-direction:column}.webmail-list-header form,.webmail-list-header .button{width:100%}.webmail-message-link{padding:.78rem .8rem}.webmail-message-action{padding-right:.45rem}.webmail-message-meta time{font-size:.7rem}.webmail-message-sender strong{max-width:58vw}.webmail-message-snippet{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.webmail-page-toolbar p{max-width:100%}}

.mail-sent-metadata{display:flex;gap:1rem;flex-wrap:wrap;margin:0 0 1.25rem;padding: .75rem 0;border-bottom:1px solid var(--color-border);color:var(--color-text-muted);font-size:.85rem}.mail-sent-content{min-height:180px}

/* Messagerie v0.8.3.18 — actions IMAP bidirectionnelles */
.webmail-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:.55rem;flex-wrap:wrap}.webmail-header-actions form{margin:0}.webmail-message-action .button-icon{min-width:2.25rem}.webmail-message-action{opacity:.76}.webmail-message-row:hover .webmail-message-action,.webmail-message-action:focus-within{opacity:1}@media(max-width:560px){.webmail-header-actions{width:100%;justify-content:stretch}.webmail-header-actions form,.webmail-header-actions .button{width:100%}}

/* Ailink Gestion v0.8.3.20 — panneau de dossiers webmail repliable. */
.webmail-shell,
.webmail-sidebar {
    transition: grid-template-columns var(--transition), width var(--transition), padding var(--transition);
}
.webmail-sidebar-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    min-height: 2.5rem;
}
.webmail-sidebar-toggle {
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 2.35rem;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: var(--color-surface);
    color: var(--color-text-muted);
    transition: color var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast), transform var(--transition);
}
.webmail-sidebar-toggle:hover {
    color: var(--color-text);
    background: var(--color-primary-soft);
    border-color: var(--color-primary-border);
}
.webmail-sidebar-toggle svg {
    width: 1.15rem;
    height: 1.15rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform var(--transition);
}
.webmail-sidebar-tools a {
    display: flex;
    align-items: center;
    gap: .55rem;
}
.webmail-tool-icon {
    width: 1.6rem;
    flex: 0 0 1.6rem;
    display: grid;
    place-items: center;
    font-size: 1rem;
}
.webmail-shell.is-sidebar-collapsed {
    grid-template-columns: 74px minmax(0, 1fr);
}
.webmail-shell.is-sidebar-collapsed .webmail-sidebar {
    gap: .75rem;
    padding: .75rem .6rem;
}
.webmail-shell.is-sidebar-collapsed .webmail-sidebar-top {
    justify-content: center;
}
.webmail-shell.is-sidebar-collapsed .webmail-sidebar-title,
.webmail-shell.is-sidebar-collapsed .webmail-sidebar-heading,
.webmail-shell.is-sidebar-collapsed .webmail-folder-link > span:not(.webmail-folder-icon):not(.webmail-folder-count),
.webmail-shell.is-sidebar-collapsed .webmail-folder-empty,
.webmail-shell.is-sidebar-collapsed .webmail-folder-warning,
.webmail-shell.is-sidebar-collapsed .webmail-sidebar-tools a > span:not(.webmail-tool-icon) {
    display: none;
}
.webmail-shell.is-sidebar-collapsed .webmail-sidebar-toggle svg {
    transform: rotate(180deg);
}
.webmail-shell.is-sidebar-collapsed .webmail-folder-nav {
    gap: .3rem;
}
.webmail-shell.is-sidebar-collapsed .webmail-folder-link {
    position: relative;
    width: 46px;
    min-height: 46px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    place-items: center;
    gap: 0;
    padding: 0;
}
.webmail-shell.is-sidebar-collapsed .webmail-folder-icon {
    width: auto;
    font-size: 1.12rem;
}
.webmail-shell.is-sidebar-collapsed .webmail-folder-count {
    position: absolute;
    top: -3px;
    right: -4px;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 .25rem;
    font-size: .62rem;
    box-shadow: 0 0 0 2px var(--color-surface-raised);
}
.webmail-shell.is-sidebar-collapsed .webmail-sidebar-section {
    padding-top: .65rem;
}
.webmail-shell.is-sidebar-collapsed .webmail-sidebar-tools {
    display: grid;
    gap: .3rem;
    overflow: visible;
}
.webmail-shell.is-sidebar-collapsed .webmail-sidebar-tools a {
    width: 46px;
    min-height: 46px;
    margin: 0 auto;
    justify-content: center;
    padding: 0;
    border: 0;
}
.webmail-shell.is-sidebar-collapsed .webmail-tool-icon {
    width: auto;
    flex-basis: auto;
    font-size: 1.12rem;
}
@media (max-width:780px) {
    .webmail-sidebar-top {
        min-height: 2.35rem;
    }
    .webmail-sidebar-title {
        display: block;
    }
    .webmail-shell.is-sidebar-collapsed .webmail-sidebar {
        padding: .65rem;
    }
    .webmail-shell.is-sidebar-collapsed .webmail-folder-nav,
    .webmail-shell.is-sidebar-collapsed .webmail-sidebar-tools {
        display: flex;
        gap: .35rem;
        overflow-x: auto;
    }
    .webmail-shell.is-sidebar-collapsed .webmail-folder-link,
    .webmail-shell.is-sidebar-collapsed .webmail-sidebar-tools a {
        flex: 0 0 44px;
        width: 44px;
        min-height: 44px;
        margin: 0;
    }
}


/* Ailink Gestion v0.8.3.21 — menu principal repliable sur ordinateur. */
.brand-block {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: center;
    gap: 8px;
}
.sidebar-collapse-toggle {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: var(--color-surface-raised);
    color: var(--color-text-muted);
    transition: color var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);
}
.sidebar-collapse-toggle:hover {
    color: var(--color-text-strong);
    background: var(--color-surface-soft);
    border-color: var(--color-border-strong);
}
.sidebar-collapse-toggle svg,
.sidebar-logout-button svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.sidebar-collapse-toggle svg {
    transition: transform var(--transition);
}
.sidebar-logout-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

@media (min-width: 851px) {
    .app-shell {
        transition: grid-template-columns var(--transition);
    }
    .app-shell.is-sidebar-collapsed {
        grid-template-columns: var(--sidebar-collapsed-width) minmax(0, 1fr);
    }
    .app-shell.is-sidebar-collapsed .sidebar {
        width: var(--sidebar-collapsed-width);
        overflow-x: hidden;
        padding-left: 10px;
        padding-right: 10px;
    }
    .app-shell.is-sidebar-collapsed .brand-block {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 7px;
        padding-right: 0;
        padding-left: 0;
    }
    .app-shell.is-sidebar-collapsed .brand {
        justify-content: center;
    }
    .app-shell.is-sidebar-collapsed .brand-copy,
    .app-shell.is-sidebar-collapsed .nav-label,
    .app-shell.is-sidebar-collapsed .sidebar nav a > span,
    .app-shell.is-sidebar-collapsed .nav-group-main > span,
    .app-shell.is-sidebar-collapsed .theme-toggle > span:not(.theme-toggle-icons),
    .app-shell.is-sidebar-collapsed .user-chip > div,
    .app-shell.is-sidebar-collapsed .sidebar-logout-button > span {
        display: none;
    }
    .app-shell.is-sidebar-collapsed .sidebar-collapse-toggle {
        margin: 0 auto;
    }
    .app-shell.is-sidebar-collapsed .sidebar-collapse-toggle svg {
        transform: rotate(180deg);
    }
    .app-shell.is-sidebar-collapsed .sidebar nav {
        gap: 5px;
    }
    .app-shell.is-sidebar-collapsed .sidebar nav > a,
    .app-shell.is-sidebar-collapsed .nav-group-main {
        justify-content: center;
        gap: 0;
        min-height: 44px;
        padding: 9px;
    }
    .app-shell.is-sidebar-collapsed .nav-count-badge {
        position: absolute;
        top: 1px;
        right: 1px;
        min-width: 17px;
        height: 17px;
        margin: 0;
        padding: 0 4px;
        font-size: .54rem;
    }
    .app-shell.is-sidebar-collapsed .nav-live-dot {
        position: absolute;
        right: 4px;
        bottom: 4px;
        width: 6px;
        height: 6px;
        margin: 0;
        box-shadow: 0 0 0 3px var(--color-success-soft);
    }
    .app-shell.is-sidebar-collapsed .nav-group-row {
        grid-template-columns: 40px 18px;
        justify-content: center;
    }
    .app-shell.is-sidebar-collapsed .nav-group-main {
        width: 40px;
        padding-right: 4px;
        padding-left: 4px;
    }
    .app-shell.is-sidebar-collapsed .nav-submenu-toggle {
        width: 18px;
        height: 36px;
        border-radius: 7px;
    }
    .app-shell.is-sidebar-collapsed .nav-submenu-toggle svg {
        width: 13px;
        height: 13px;
    }
    .app-shell.is-sidebar-collapsed .nav-submenu a {
        justify-content: center;
        min-height: 40px;
        margin: 2px 0;
        padding: 8px;
    }
    .app-shell.is-sidebar-collapsed .sidebar-footer {
        display: grid;
        justify-items: center;
        gap: 8px;
        padding-right: 0;
        padding-left: 0;
    }
    .app-shell.is-sidebar-collapsed .theme-toggle {
        width: 44px;
        min-height: 42px;
        grid-template-columns: 1fr;
        justify-items: center;
        margin: 0;
        padding: 8px;
    }
    .app-shell.is-sidebar-collapsed .theme-toggle-icons {
        width: 20px;
    }
    .app-shell.is-sidebar-collapsed .user-chip {
        justify-content: center;
        gap: 0;
        margin: 0;
        padding: 0;
    }
    .app-shell.is-sidebar-collapsed .sidebar-footer form {
        width: 44px;
        margin: 0;
    }
    .app-shell.is-sidebar-collapsed .sidebar-logout-button {
        width: 44px;
        min-height: 40px;
        justify-content: center;
        padding: 7px;
    }
}

@media (max-width: 850px) {
    .brand-block {
        grid-template-columns: 1fr;
    }
    .sidebar-collapse-toggle {
        display: none;
    }
}

/* Ailink Gestion v0.8.3.30 — suivi rapide des factures en attente */
.pending-payment-page {
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
}
.pending-payment-create-panel {
    position: sticky;
    top: calc(var(--topbar-height) + var(--safe-area-top) + 10px);
    z-index: 8;
}
.pending-payment-create {
    display: grid;
    grid-template-columns: minmax(250px, 1.5fr) minmax(150px, .55fr) auto;
    gap: 10px;
    align-items: end;
}
.pending-payment-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
}
.pending-payment-heading h2,
.pending-payment-heading p {
    margin: 0;
}
.pending-payment-heading p {
    margin-top: 4px;
    color: var(--color-text-muted);
}
.pending-payment-total {
    min-width: 220px;
    display: grid;
    gap: 3px;
    padding: 13px 16px;
    border: 1px solid var(--color-primary-border);
    border-radius: var(--radius-md);
    background: var(--color-primary-soft);
    text-align: right;
}
.pending-payment-total span {
    color: var(--color-text-muted);
    font-size: .68rem;
    font-weight: 780;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.pending-payment-total strong {
    color: var(--color-primary-hover);
    font-size: clamp(1.35rem, 2.5vw, 2rem);
    line-height: 1.05;
}
.pending-payment-list {
    display: grid;
    gap: 9px;
}
.pending-payment-row {
    min-width: 0;
    display: grid;
    grid-template-columns: 8px minmax(0, 1fr) auto auto;
    gap: 12px;
    align-items: center;
    padding: 13px 12px;
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-warning);
    border-radius: 14px;
    background: color-mix(in srgb, var(--color-warning-soft) 35%, var(--color-surface));
    box-shadow: var(--shadow-sm);
}
.pending-payment-row > form {
    margin: 0;
}
.pending-payment-indicator {
    align-self: stretch;
    border-radius: 999px;
    background: var(--color-warning);
}
.pending-payment-main {
    min-width: 0;
}
.pending-payment-main strong,
.pending-payment-main small {
    display: block;
    overflow-wrap: anywhere;
}
.pending-payment-main small {
    margin-top: 3px;
    color: var(--color-text-muted);
}
.pending-payment-amount {
    color: var(--color-text);
    font-size: 1.05rem;
    white-space: nowrap;
}
.pending-payment-history {
    padding: 0;
}
.pending-payment-history > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.15rem;
    font-weight: 800;
}
.pending-payment-history > summary::-webkit-details-marker {
    display: none;
}
.pending-payment-history > summary span {
    min-width: 1.6rem;
    padding: .15rem .45rem;
    border-radius: 999px;
    background: var(--surface-soft);
    text-align: center;
}
.pending-payment-history[open] > summary {
    border-bottom: 1px solid var(--border);
}
.pending-payment-history .pending-payment-list {
    padding: 1rem;
}
.pending-payment-paid {
    grid-template-columns: 8px minmax(0, 1fr) auto auto;
    border-left-color: var(--color-success);
    background: color-mix(in srgb, var(--color-success-soft) 30%, var(--color-surface));
    opacity: .78;
}
.pending-payment-paid .pending-payment-indicator {
    background: var(--color-success);
}

@media (max-width: 820px) {
    .pending-payment-create-panel {
        position: static;
        top: auto;
        z-index: auto;
    }
    .pending-payment-create {
        grid-template-columns: 1fr 1fr;
    }
    .pending-payment-create .button {
        grid-column: 1 / -1;
        width: 100%;
    }
    .pending-payment-heading {
        align-items: stretch;
        flex-direction: column;
    }
    .pending-payment-total {
        min-width: 0;
        text-align: left;
    }
}

@media (max-width: 650px) {
    .pending-payment-create {
        grid-template-columns: 1fr;
    }
    .pending-payment-create .button {
        grid-column: auto;
    }
    .pending-payment-row {
        grid-template-columns: 7px minmax(0, 1fr);
        align-items: start;
    }
    .pending-payment-row > .pending-payment-amount,
    .pending-payment-row > form:last-child {
        grid-column: 2;
        justify-self: start;
    }
    .pending-payment-paid {
        grid-template-columns: 7px minmax(0, 1fr);
    }
    .pending-payment-paid > .pending-payment-indicator {
        grid-column: 1;
        grid-row: 1 / span 3;
    }
    .pending-payment-paid > .pending-payment-main,
    .pending-payment-paid > .pending-payment-amount,
    .pending-payment-paid > form:last-child {
        grid-column: 2;
        justify-self: start;
    }
}

/* Messagerie : pagination des dossiers IMAP */
.webmail-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 18px 16px;
    border-top: 1px solid var(--color-border);
}
.webmail-pagination-page,
.webmail-pagination-arrow {
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    background: var(--color-surface);
    color: var(--color-text);
    text-decoration: none;
    font-size: .82rem;
    font-weight: 650;
}
.webmail-pagination-page:hover,
.webmail-pagination-arrow:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}
.webmail-pagination-page.active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
}
.webmail-pagination-arrow.is-disabled {
    opacity: .4;
    pointer-events: none;
}
.webmail-pagination-ellipsis {
    min-width: 24px;
    text-align: center;
    color: var(--color-text-muted);
}

/* Ailink Gestion v0.8.3.36 — correction de la grille des tâches rapides. */
.quick-task-row {
    grid-template-columns: auto 5px minmax(0, 1fr) auto auto;
}
.quick-task-row > .quick-task-check-form {
    grid-column: 1;
    grid-row: 1;
}
.quick-task-row > .quick-task-indicator {
    grid-column: 2;
    grid-row: 1;
    width: 5px;
    min-width: 5px;
    max-width: 5px;
    justify-self: stretch;
    align-self: stretch;
}
.quick-task-row > .quick-task-main {
    grid-column: 3;
    grid-row: 1;
}
.quick-task-row > .quick-task-delay {
    grid-column: 4;
    grid-row: 1;
}
.quick-task-row > form:last-child {
    grid-column: 5;
    grid-row: 1;
}

@media (max-width: 700px) {
    .quick-task-row {
        grid-template-columns: auto 5px minmax(0, 1fr);
        align-items: start;
    }
    .quick-task-row > .quick-task-check-form {
        grid-column: 1;
        grid-row: 1;
    }
    .quick-task-row > .quick-task-indicator {
        grid-column: 2;
        grid-row: 1 / span 3;
    }
    .quick-task-row > .quick-task-main,
    .quick-task-row > .quick-task-delay,
    .quick-task-row > form:last-child {
        grid-column: 3;
        justify-self: start;
    }
    .quick-task-row > .quick-task-main { grid-row: 1; }
    .quick-task-row > .quick-task-delay { grid-row: 2; }
    .quick-task-row > form:last-child { grid-row: 3; }
}


/* v0.8.3.38 — Tri des colonnes de la liste clients */
.table-sort-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: inherit;
    font: inherit;
    text-decoration: none;
    white-space: nowrap;
}
.table-sort-link:hover { color: var(--color-primary); }
.sort-indicator {
    color: var(--color-text-muted);
    font-size: .72rem;
    line-height: 1;
    opacity: .55;
}
.sort-indicator.active {
    color: var(--color-primary);
    opacity: 1;
}

/* Ailink Gestion v0.8.3.39 — ouverture des sous-menus au survol de la souris. */
@media (min-width: 851px) and (hover: hover) and (pointer: fine) {
    .nav-group:hover .nav-submenu,
    .nav-group:focus-within .nav-submenu {
        display: grid;
        opacity: 1;
    }

    .nav-group:hover .nav-submenu-toggle svg,
    .nav-group:focus-within .nav-submenu-toggle svg {
        transform: rotate(180deg);
    }
}

/* Templates sociaux v0.8.3.42 : icône de catégorie dans les aperçus. */
.social-template-category-preview-icon svg {
    width: 42px;
    height: 42px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* v0.8.3.43 — aperçu complet des carrousels Instagram */
.social-preview-media.social-carousel-preview {
    aspect-ratio: auto;
    overflow: visible;
    padding: 16px;
}
.social-carousel-preview-header {
    margin-bottom: 14px;
}
.social-carousel-preview-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
}
.social-carousel-preview-item {
    margin: 0;
    min-width: 0;
}
.social-carousel-preview-item a {
    display: block;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    background: var(--color-bg-subtle);
}
.social-carousel-preview-item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.social-carousel-preview-item figcaption {
    padding-top: 7px;
    text-align: center;
    font-size: 0.85rem;
    color: var(--color-text-muted);
}
@media (max-width: 640px) {
    .social-carousel-preview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .social-preview-media.social-carousel-preview {
        padding: 10px;
    }
}

/* v0.8.3.49 — paramètres sociaux regroupés et actions réseau iconographiques */
.social-settings-menu{position:relative;margin:0}.social-settings-trigger{cursor:pointer}.social-settings-trigger svg,.social-network-action svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.social-settings-dropdown{position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:220px;padding:8px;background:var(--panel,#11161d);border:1px solid var(--border,#29313d);border-radius:10px;box-shadow:0 14px 35px rgba(0,0,0,.28);display:grid;gap:3px;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-4px);transition:opacity .15s ease,transform .15s ease,visibility .15s}.social-settings-menu::after{content:"";position:absolute;right:0;top:100%;width:100%;height:8px}.social-settings-menu:hover .social-settings-dropdown,.social-settings-menu:focus-within .social-settings-dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}.social-settings-dropdown a{padding:9px 11px;border-radius:7px;color:inherit;text-decoration:none;white-space:nowrap}.social-settings-dropdown a:hover,.social-settings-dropdown a.active{background:rgba(255,255,255,.08)}.social-network-action{min-width:34px}.social-network-action svg{pointer-events:none}@media(max-width:700px){.social-settings-dropdown{right:auto;left:0}.social-tabs{overflow:visible;flex-wrap:wrap}}


/* v0.8.3.51 — ouverture fiable du menu Paramètres des réseaux sociaux */
.social-settings-menu.is-open .social-settings-dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}


/* v0.8.3.52 — le menu Paramètres est sorti du conteneur horizontal qui le masquait. */
.social-nav-bar {
    position: relative;
    z-index: 20;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 16px;
    overflow: visible;
}
.social-nav-bar .social-tabs-primary {
    flex: 1 1 auto;
    min-width: 0;
    margin-bottom: 0;
}
.social-nav-bar .social-settings-menu {
    flex: 0 0 auto;
    z-index: 40;
}
.social-nav-bar .social-settings-dropdown {
    z-index: 50;
}
@media (max-width: 700px) {
    .social-nav-bar {
        align-items: stretch;
    }
    .social-nav-bar .social-settings-dropdown {
        right: 0;
        left: auto;
    }
}

/* Facebook draft preview: keep the generated image readable without filling the page. */
.social-facebook-preview-image {
    display: block;
    width: min(100%, 420px);
    max-height: 520px;
    height: auto;
    object-fit: contain;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    background: var(--color-bg-subtle);
}
.field-help {
    display: block;
    margin-top: 6px;
    color: var(--color-text-muted);
}


/* Agenda Exchange en lecture seule. */
.exchange-event-row { border-left: 3px solid var(--color-info); }
.exchange-badge { background: color-mix(in srgb, var(--color-info) 16%, transparent); color: var(--color-info); }
.exchange-calendar-event { border-left-color: var(--color-info); background: color-mix(in srgb, var(--color-info) 8%, var(--color-surface-raised)); }
.exchange-calendar-event > div { display: grid; gap: 3px; }
.exchange-month-event { border-left: 3px solid var(--color-info); background: color-mix(in srgb, var(--color-info) 10%, var(--color-surface-raised)); }

/* Agenda — distinction des sources */
.agenda-sync-form { margin: 0; }
.exchange-event-row,
.calendar-task.exchange-calendar-event,
.month-task.exchange-month-event {
    border-left-color: #2563eb !important;
    background: color-mix(in srgb, #2563eb 18%, var(--color-surface-raised)) !important;
    color: var(--color-text);
}
.exchange-event-row { border-left: 4px solid #2563eb; }
.task-row.task-source-hermes,
.calendar-task.task-source-hermes,
.month-task.task-source-hermes {
    border-left-color: #dc2626 !important;
    background: color-mix(in srgb, #dc2626 18%, var(--color-surface-raised)) !important;
    color: var(--color-text);
}
html.theme-light .exchange-event-row,
html.theme-light .calendar-task.exchange-calendar-event,
html.theme-light .month-task.exchange-month-event {
    background: color-mix(in srgb, #2563eb 13%, #ffffff) !important;
}
html.theme-light .task-row.task-source-hermes,
html.theme-light .calendar-task.task-source-hermes,
html.theme-light .month-task.task-source-hermes {
    background: color-mix(in srgb, #dc2626 12%, #ffffff) !important;
}

/* Ailink Gestion v0.8.3.67 — sous-menus latéraux sur ordinateur. */
@media (min-width: 851px) and (hover: hover) and (pointer: fine) {
    .nav-group {
        position: relative;
    }

    .nav-group .nav-submenu,
    .nav-group.is-open .nav-submenu,
    .nav-group:hover .nav-submenu,
    .nav-group:focus-within .nav-submenu {
        position: fixed;
        z-index: 120;
        top: var(--nav-flyout-top, 0px);
        left: var(--nav-flyout-left, calc(var(--sidebar-width) + 8px));
        display: none;
        min-width: 230px;
        max-width: min(320px, calc(100vw - var(--nav-flyout-left, 240px) - 16px));
        padding: 8px;
        border: 1px solid var(--color-border);
        border-radius: 12px;
        background: var(--color-surface);
        box-shadow: var(--shadow);
        opacity: 0;
        transform: translateX(-6px);
        transition: opacity var(--transition-fast), transform var(--transition-fast);
    }

    .nav-group:hover .nav-submenu,
    .nav-group:focus-within .nav-submenu,
    .nav-group.is-open .nav-submenu {
        display: grid;
        opacity: 1;
        transform: translateX(0);
    }

    .nav-submenu a,
    .app-shell.is-sidebar-collapsed .nav-submenu a {
        justify-content: flex-start;
        min-height: 40px;
        margin: 0;
        padding: 9px 11px;
        border-radius: 9px;
        white-space: nowrap;
    }

    .nav-submenu-toggle svg,
    .nav-group.is-open .nav-submenu-toggle svg,
    .nav-group:hover .nav-submenu-toggle svg,
    .nav-group:focus-within .nav-submenu-toggle svg {
        transform: rotate(-90deg);
    }
}

/* Ailink Gestion v0.8.3.68 — ouverture fiable des sous-menus latéraux sur ordinateur. */
@media (min-width: 851px) {
    .nav-group {
        position: relative;
    }

    .nav-group .nav-submenu,
    .nav-group.is-open .nav-submenu,
    .nav-group.is-flyout-open .nav-submenu,
    .nav-group:focus-within .nav-submenu {
        position: fixed;
        z-index: 160;
        top: var(--nav-flyout-top, 8px);
        left: var(--nav-flyout-left, calc(var(--sidebar-width) + 4px));
        min-width: 230px;
        max-width: min(340px, calc(100vw - var(--nav-flyout-left, 240px) - 12px));
        max-height: calc(100vh - 16px);
        overflow-y: auto;
        padding: 8px;
        border: 1px solid var(--color-border);
        border-radius: 12px;
        background: var(--color-surface);
        box-shadow: 0 18px 42px rgba(0, 0, 0, .28);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateX(-4px);
        transition: opacity var(--transition-fast), transform var(--transition-fast), visibility var(--transition-fast);
    }

    .nav-group.is-flyout-open .nav-submenu,
    .nav-group.is-open .nav-submenu,
    .nav-group:focus-within .nav-submenu {
        display: grid;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(0);
    }

    .nav-group.is-flyout-open .nav-submenu-toggle svg,
    .nav-group.is-open .nav-submenu-toggle svg,
    .nav-group:focus-within .nav-submenu-toggle svg {
        transform: rotate(-90deg);
    }
}

/* Ailink Gestion v0.8.3.69 — sous-menu toujours au premier plan, notamment en thème clair. */
@media (min-width: 851px) {
    .sidebar.has-nav-flyout-open {
        z-index: 500;
        overflow: visible;
    }

    .sidebar.has-nav-flyout-open .nav-group.is-flyout-open .nav-submenu,
    .sidebar.has-nav-flyout-open .nav-group.is-open .nav-submenu,
    .sidebar.has-nav-flyout-open .nav-group:focus-within .nav-submenu {
        z-index: 520;
        isolation: isolate;
        background: var(--color-surface) !important;
        box-shadow: 0 20px 48px rgba(0, 0, 0, .34);
    }

    html.theme-light .sidebar.has-nav-flyout-open {
        z-index: 500;
    }

    html.theme-light .sidebar.has-nav-flyout-open .nav-submenu {
        background: #ffffff !important;
        border-color: rgba(15, 23, 42, .14);
        box-shadow: 0 20px 50px rgba(15, 23, 42, .24);
    }
}

/* v0.8.3.70 — bouton Paramètres lisible en thème clair et édition des brouillons Facebook. */
html.theme-light .social-settings-trigger {
    background: var(--color-surface-raised) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}
html.theme-light .social-settings-trigger:hover,
html.theme-light .social-settings-menu.is-open .social-settings-trigger {
    background: var(--color-surface-soft) !important;
    border-color: var(--color-border-strong) !important;
    color: var(--color-text) !important;
}
html.theme-light .social-settings-dropdown {
    background: var(--color-surface-raised);
    border-color: var(--color-border);
    color: var(--color-text);
}
html.theme-light .social-settings-dropdown a:hover,
html.theme-light .social-settings-dropdown a.active {
    background: var(--color-surface-soft);
}
.social-facebook-current-media { display: grid; gap: 8px; }
.social-facebook-current-media .field-label { font-weight: 700; }
.social-facebook-publish-form { margin-top: 18px; }

/* v0.8.3.75 — mise en page dédiée des brouillons Facebook. */
.social-facebook-draft-page {
    display: grid;
    gap: 20px;
}
.social-facebook-draft-header {
    margin-bottom: 0;
}
.social-facebook-draft-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.social-facebook-draft-title-row h2 {
    min-width: 0;
    overflow-wrap: anywhere;
}
.social-facebook-draft-form {
    display: grid;
    gap: 18px;
}
.social-facebook-draft-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, .75fr);
    gap: 18px;
    align-items: start;
}
.social-facebook-draft-column {
    display: grid;
    gap: 18px;
    min-width: 0;
}
.social-facebook-form-card {
    display: grid;
    gap: 15px;
    padding: 18px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg, 14px);
    background: var(--color-surface-raised);
    min-width: 0;
}
.social-facebook-form-card-header {
    display: grid;
    gap: 3px;
}
.social-facebook-form-card h3 {
    margin: 0;
    font-size: 1rem;
}
.social-facebook-form-card-header p,
.social-facebook-publish-zone p {
    margin: 0;
    color: var(--color-text-muted);
    font-size: .82rem;
}
.social-facebook-form-card label {
    display: grid;
    gap: 7px;
    min-width: 0;
}
.social-facebook-form-card input[type="text"],
.social-facebook-form-card input[type="url"],
.social-facebook-form-card textarea {
    width: 100%;
    min-width: 0;
}
.social-facebook-form-card textarea[name="body"] {
    min-height: 300px;
    resize: vertical;
}
.social-facebook-form-card textarea[name="hashtags"] {
    min-height: 92px;
    resize: vertical;
}
.social-facebook-current-media {
    display: grid;
    place-items: center;
    padding: 10px;
    border-radius: var(--radius, 10px);
    background: var(--color-bg-subtle);
}
.social-facebook-preview-image {
    width: 100%;
    max-width: 430px;
    max-height: 430px;
    object-fit: contain;
}
.social-facebook-empty-media {
    display: grid;
    place-items: center;
    min-height: 180px;
    padding: 20px;
    border: 1px dashed var(--color-border-strong);
    border-radius: var(--radius, 10px);
    color: var(--color-text-muted);
    text-align: center;
    background: var(--color-bg-subtle);
}
.social-facebook-file-field input[type="file"] {
    width: 100%;
    padding: 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius, 10px);
    background: var(--color-bg-subtle);
    color: var(--color-text);
}
.social-facebook-summary-card dl {
    display: grid;
    gap: 10px;
    margin: 0;
}
.social-facebook-summary-card dl > div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 9px;
    border-bottom: 1px solid var(--color-border);
}
.social-facebook-summary-card dl > div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}
.social-facebook-summary-card dt {
    color: var(--color-text-muted);
}
.social-facebook-summary-card dd {
    margin: 0;
    font-weight: 700;
    text-align: right;
}
.social-facebook-draft-actions {
    display: flex;
    justify-content: flex-end;
}
.social-facebook-draft-error {
    margin: 0;
}
.social-facebook-publish-zone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px;
    border: 1px solid var(--color-primary-border);
    border-radius: var(--radius-lg, 14px);
    background: var(--color-primary-soft);
}
.social-facebook-publish-form {
    margin: 0;
    flex: 0 0 auto;
}
@media (max-width: 1050px) {
    .social-facebook-draft-layout {
        grid-template-columns: 1fr;
    }
    .social-facebook-draft-media {
        grid-template-columns: minmax(0, 1fr) minmax(260px, .7fr);
        align-items: start;
    }
}
@media (max-width: 720px) {
    .social-facebook-draft-page {
        gap: 14px;
    }
    .social-facebook-form-card {
        padding: 14px;
    }
    .social-facebook-draft-media {
        grid-template-columns: 1fr;
    }
    .social-facebook-draft-actions,
    .social-facebook-publish-zone {
        align-items: stretch;
        flex-direction: column;
    }
    .social-facebook-draft-actions .button,
    .social-facebook-publish-form,
    .social-facebook-publish-form .button {
        width: 100%;
    }
}

/* Ailink Gestion v0.8.3.77 — stabilité des sous-menus et du défilement de la navigation. */
.sidebar {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.sidebar::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

@media (min-width: 851px) {
    /* Le sous-menu de la rubrique active reste fermé tant qu'il n'est pas réellement survolé ou focalisé. */
    .nav-group.is-open:not(.is-flyout-open):not(:focus-within) .nav-submenu {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateX(-4px);
    }

    /* L'ouverture d'un sous-menu ne change plus la largeur ni le mode de défilement du menu principal. */
    .sidebar.has-nav-flyout-open {
        overflow-y: auto;
        overflow-x: hidden;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .sidebar.has-nav-flyout-open::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none;
    }
}

/* Ailink Gestion v0.8.3.78 — sous-menu au premier plan en thème clair et flèche décorative sur ordinateur. */
@media (min-width: 851px) {
    /* Le flyout doit pouvoir sortir de la barre latérale sans être masqué par son contexte d'empilement. */
    .sidebar.has-nav-flyout-open {
        z-index: 600;
        overflow: visible;
    }

    html.theme-light .sidebar.has-nav-flyout-open {
        z-index: 600;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .sidebar.has-nav-flyout-open .nav-group.is-flyout-open .nav-submenu {
        z-index: 620;
    }

    html.theme-light .sidebar.has-nav-flyout-open .nav-group.is-flyout-open .nav-submenu {
        background: #ffffff !important;
        border-color: rgba(15, 23, 42, .16);
        box-shadow: 0 20px 50px rgba(15, 23, 42, .26);
    }

    /* Sur ordinateur, la flèche indique uniquement la présence d'un sous-menu : l'ouverture reste pilotée au survol. */
    .nav-submenu-toggle {
        pointer-events: none;
        cursor: default;
    }
}

/* Ailink Gestion v0.8.3.79 — alignement du menu réduit et libellés visibles dans les sous-menus. */
@media (min-width: 851px) {
    /* En mode icônes, l'indicateur de sous-menu est masqué et l'entrée reste centrée comme les liens simples. */
    .app-shell.is-sidebar-collapsed .nav-group-row {
        grid-template-columns: 40px;
        justify-content: center;
    }

    .app-shell.is-sidebar-collapsed .nav-submenu-toggle {
        display: none;
    }

    .app-shell.is-sidebar-collapsed .nav-group-main {
        width: 40px;
        padding-right: 9px;
        padding-left: 9px;
    }

    /* Les libellés du flyout restent visibles même lorsque la barre latérale principale est réduite. */
    .app-shell.is-sidebar-collapsed .nav-submenu a > span,
    .app-shell.is-sidebar-collapsed .nav-group .nav-submenu a > span {
        display: inline !important;
        min-width: 0;
        overflow: visible;
        text-overflow: clip;
        white-space: nowrap;
    }

    .app-shell.is-sidebar-collapsed .nav-submenu a {
        display: flex;
        justify-content: flex-start;
        gap: 9px;
        min-width: 210px;
        padding: 9px 11px;
        text-align: left;
    }
}
