/* ===== Polices hébergées sur ce serveur (aucun appel à Google) : licences dans /fonts/LICENSES.txt ===== */ @font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/atkinson-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/atkinson-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/bricolage-ext-wght.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/bricolage-wght.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} /* Direction : le bleu de travail et le jaune du mètre ruban. Un seul geste mémorable : le ruban gradué (étapes du hero, avancement des chantiers). Le reste reste calme et plat. Mise en page : site asymétrique aligné à gauche ; application avec barre latérale nuit, contenu sur craie. Thème clair unique (lisible en plein soleil). */ :root{ --nuit:#0E1F40; --bleu:#1A3A73; --bleu-clair:#E7EEF9; --craie:#F2F5F9; --papier:#FFFFFF; --metre:#FFC20E; --metre-fonce:#E6AC00; --encre:#101B2E; --ardoise:#46556F; --trait:#D7DDE7; --ok-bg:#DDF4E4; --ok:#14532D; --warn-bg:#FDEBD3; --warn:#7A3A07; --bad-bg:#FBE0E0; --bad:#8A1C1C; --info-bg:#DEE8FA; --info:#17306A; --neutral-bg:#E4E8EF; --neutral:#34405A; --titre:"Bricolage Grotesque","Trebuchet MS",system-ui,sans-serif; --texte:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; --r:10px; color-scheme:light; } /* ---- Thème sombre (bascule via le bouton lune ; préférence enregistrée) ---- */ :root[data-theme="dark"]{ --craie:#0F1623; --papier:#182233; --metre:#FFC20E; --metre-fonce:#E6AC00; --encre:#E7ECF3; --ardoise:#9DAAC0; --trait:#2B3549; --bleu:#6FA0FF; --bleu-clair:#1E2B47; --ok-bg:#153024; --ok:#86EFAC; --warn-bg:#3A2A12; --warn:#FBBF77; --bad-bg:#3A1E1E; --bad:#FCA5A5; --info-bg:#182A4D; --info:#9DB8F5; --neutral-bg:#222C3D; --neutral:#AEB9CC; --ring-track:#33405A; color-scheme:dark; } /* ==== AUTO-DARK:START (généré par scripts/gen-dark.js : ne pas modifier à la main) ==== */ :root[data-theme="dark"] .btn.line-light{border-color:rgba(39,53,73,0.45)} :root[data-theme="dark"] .btn.line-light:hover{background:rgba(28,37,51,0.12)} :root[data-theme="dark"] .switch .track::after{background:#1C2533} :root[data-theme="dark"] .ruler{background:#1B212C} :root[data-theme="dark"] .ruler::after{background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1.5px),rgba(28,37,51,0.9) calc(10% - 1.5px) 10%)} :root[data-theme="dark"] .project-accent{background:color-mix(in srgb,var(--project-color) 60%,#fff)} :root[data-theme="dark"] .project-status{color:color-mix(in srgb,var(--project-color) 60%,#fff)} :root[data-theme="dark"] .project-progress{background:#1B212C} :root[data-theme="dark"] .project-progress i{background:color-mix(in srgb,var(--project-color) 60%,#fff)} :root[data-theme="dark"] .project-ring{background:conic-gradient(color-mix(in srgb,var(--project-color) 60%,#fff) var(--progress),var(--ring-track,#E5EAF2) 0)} :root[data-theme="dark"] .priority-count{background:#1C232E} :root[data-theme="dark"] .priority-reminders{background:linear-gradient(135deg,#352B17,#362E17)} :root[data-theme="dark"] .priority-reminders .priority-count{background:#312915;color:#E9C390} :root[data-theme="dark"] .priority-reminder{border-top:1px solid #5A492A} :root[data-theme="dark"] .priority-tasks{background:#1C2533} :root[data-theme="dark"] .priority-date{background:#312915;color:#E6C194} :root[data-theme="dark"] .priority-date.late{background:#331616;color:#E09A9A} :root[data-theme="dark"] .avatar.photo{background:#1C2533} :root[data-theme="dark"] .nav a:hover{background:rgba(28,37,51,0.08)} :root[data-theme="dark"] .nav a[aria-current="page"]{background:linear-gradient(90deg,rgba(74,104,153,.55),rgba(28,37,51,0.1))} :root[data-theme="dark"] .side-foot{background:linear-gradient(135deg,rgba(28,37,51,0.12),rgba(89,116,160,.18))} :root[data-theme="dark"] .side-foot:hover{background:rgba(28,37,51,0.15)} :root[data-theme="dark"] .overview-icon{background:#162034} :root[data-theme="dark"] .overview-metric.receivable .overview-icon{color:#E09C99;background:#341916} :root[data-theme="dark"] .overview-metric.quotes .overview-icon{color:#EDCC8D;background:#322A16} :root[data-theme="dark"] .overview-metric.jobs .overview-icon{color:#EDCC8D;background:#322A16} :root[data-theme="dark"] .overview-metric.receivable small{color:#DD9F9C} :root[data-theme="dark"] .overview-attention{color:#A4D6B7} :root[data-theme="dark"] .overview-attention.is-alert{color:#DBA29F} :root[data-theme="dark"] .paper{background:#1C2533;color:#DAE0EC;border:1px solid #364254} :root[data-theme="dark"] .paper table th{background:#1A2331;color:#AEB7CC} :root[data-theme="dark"] .paper table td{border-bottom:1px solid #2F3B4E} :root[data-theme="dark"] .paper .ph{color:#EDC08D} :root[data-theme="dark"] .quote-paper{border:1px solid #2F3E52} :root[data-theme="dark"] .quote-head{background:linear-gradient(120deg,#192735 0%,#182434 100%);border-bottom:1px solid #2E3D52} :root[data-theme="dark"] .quote-mark{background:#162234;color:#95B7E4} :root[data-theme="dark"] .quote-brand h3{color:#B1C5E7} :root[data-theme="dark"] .quote-brand>div>span{color:#B1BAC8} :root[data-theme="dark"] .quote-doc span{color:#B3BAC7} :root[data-theme="dark"] .quote-doc b{color:#C7D3E8} :root[data-theme="dark"] .quote-doc small{color:#B1BAC8} :root[data-theme="dark"] .quote-party{border:1px solid #2E3B50;background:#1C2533} :root[data-theme="dark"] .quote-party span{color:#B3BAC7} :root[data-theme="dark"] .quote-party b{color:#C7D3E8} :root[data-theme="dark"] .quote-party p{color:#B2BBC8} :root[data-theme="dark"] .quote-object{background:#342C16;border-color:#615329} :root[data-theme="dark"] .quote-table{border:1px solid #2D3C51} :root[data-theme="dark"] .quote-table table th{background:#1A2430;color:#B0B9CA} :root[data-theme="dark"] .quote-note{color:#B1BBC8} :root[data-theme="dark"] .quote-note b,:root[data-theme="dark"] .quote-sign b{color:#C6D2E5} :root[data-theme="dark"] .quote-sign{border-top:1px solid #2D3C51} :root[data-theme="dark"] .quote-sign span{color:#B3BBC7} :root[data-theme="dark"] .quote-sign-box{border:1.5px dashed #3B4A60;background:repeating-linear-gradient(135deg,#172237 0,#172237 7px,#1B2431 7px,#1B2431 14px)} :root[data-theme="dark"] .quote-totals{background:#192433} :root[data-theme="dark"] .quote-totals .t.big{border-color:#314257;color:#B8CBE9} :root[data-theme="dark"] .quote-legal{border-top:1px solid #2D3B50} :root[data-theme="dark"] .planning-toolbar{border:1px solid #2E3F54;background:linear-gradient(120deg,#1C2533 0%,#172435 100%)} :root[data-theme="dark"] .planning-kicker{color:#B3BBC7} :root[data-theme="dark"] .planning-toolbar h2{color:#B8CAE7} :root[data-theme="dark"] .week-nav .icon-btn{border:1px solid #314258;background:#1C2533} :root[data-theme="dark"] .planning-surface{border:1px solid #314257;background:#192430} :root[data-theme="dark"] .plan-table th{background:#192734;color:#B2BAC8;border-bottom:1px solid #304054} :root[data-theme="dark"] .plan-table th.person span{color:#AABBD5} :root[data-theme="dark"] .plan-table th.today{background:#342C16;color:#EECB96} :root[data-theme="dark"] .plan-table th small{color:#EDC88D} :root[data-theme="dark"] .plan-table td{border-left:1px solid #303F52;border-bottom:1px solid #303F52;background:#1B2631} :root[data-theme="dark"] .plan-table td.today{background:#352E17} :root[data-theme="dark"] .plan-table tbody th.person{background:#1C2533;border-bottom:1px solid #303F52} :root[data-theme="dark"] .chip{border:1px solid #2F4053;border-left:5px solid color-mix(in srgb,var(--c) 60%,#fff);background:#1C2533} :root[data-theme="dark"] .chip:hover{border-color:color-mix(in srgb,var(--c) 60%,#fff)} :root[data-theme="dark"] .add-cell{border:1px dashed #3A485B;background:rgba(28,37,51,0.55);color:#B3BBC6} :root[data-theme="dark"] .day-block.today h3{background:#322C15} :root[data-theme="dark"] .material-overview{border:1px solid #2E4256;background:linear-gradient(115deg,#1C2533 0%,#172635 100%)} :root[data-theme="dark"] .material-kpi{border-right:1px solid #2E3E50} :root[data-theme="dark"] .material-kpi-icon{background:#1A2531;color:#B0BBC9} :root[data-theme="dark"] .material-kpi-icon.warn{background:#322816;color:#EDC48D} :root[data-theme="dark"] .material-kpi-icon.info{background:#162134;color:#97B7E2} :root[data-theme="dark"] .material-kpi-icon.ok{background:#183120;color:#95E4B5} :root[data-theme="dark"] .material-kpi small{color:#B1BBC8} :root[data-theme="dark"] .material-donut:before{background:#182435} :root[data-theme="dark"] .material-donut b{color:#B8CAE7} :root[data-theme="dark"] .material-list{border:1px solid #2E4155;background:#1B2530} :root[data-theme="dark"] .material-list>header{background:#1C2533;border-bottom:1px solid #2D3F54} :root[data-theme="dark"] .material-list>header span{color:#B3BBC6} :root[data-theme="dark"] .material-row{border:1px solid #2E4053;background:#1C2533} :root[data-theme="dark"] .material-accent{background:color-mix(in srgb,var(--material-color) 60%,#fff)} :root[data-theme="dark"] .material-request-icon{background:#342816;color:#EDC58D} :root[data-theme="dark"] .material-qty{background:#1A2531;color:#AABACF} :root[data-theme="dark"] .material-meta{color:#B1BBC9} :root[data-theme="dark"] .material-main p{color:#B4BBC5} :root[data-theme="dark"] .ch-card:hover{background:#172237} :root[data-theme="dark"] .ch-card-accent{background:color-mix(in srgb,var(--project-color) 60%,#fff)} :root[data-theme="dark"] .ch-card-status{color:color-mix(in srgb,var(--project-color) 60%,#fff)} :root[data-theme="dark"] .ch-card-progress{background:#1B212C} :root[data-theme="dark"] .ch-card-progress i{background:color-mix(in srgb,var(--project-color) 60%,#fff)} :root[data-theme="dark"] .ch-card-ring{background:conic-gradient(color-mix(in srgb,var(--project-color) 60%,#fff) var(--progress),#1A222D 0)} :root[data-theme="dark"] .ch-card-ring::before{background:#1C2533} :root[data-theme="dark"] .tasks-page .kanban{background:linear-gradient(145deg,#172436,#19222D)} :root[data-theme="dark"] .col{background:linear-gradient(145deg,#1A2530,#19222D);border:1px solid #334256} :root[data-theme="dark"] .col > header .n{background:#182131} :root[data-theme="dark"] .task{border:1px solid #303F53} :root[data-theme="dark"] .task:hover{border-color:#36465A} :root[data-theme="dark"] .task::before{background:color-mix(in srgb,var(--task-color) 60%,#fff)} :root[data-theme="dark"] .task-project{border:1px solid #2E3C53;background:#1A2433;color:#ABB8CF} :root[data-theme="dark"] .task-due.late{color:#E39797} :root[data-theme="dark"] .member-search{border:1px solid #334256} :root[data-theme="dark"] .member-role-filter select{border:1px solid #334256} :root[data-theme="dark"] .member-table{border:1px solid #313F54} :root[data-theme="dark"] .member-table-head{border-bottom:1px solid #2D3C51} :root[data-theme="dark"] .member-row{border-bottom:1px solid #2E3C4F} :root[data-theme="dark"] .member-row:hover{background:#182435} :root[data-theme="dark"] .member-role{background:#1D222E;color:#ADB8CC} :root[data-theme="dark"] .member-load em{color:#E39797} :root[data-theme="dark"] .member-state{background:#342A16;color:#E3D6BC} :root[data-theme="dark"] .member-state.late{background:#341618;color:#E4959A} :root[data-theme="dark"] .devis-start-icon,:root[data-theme="dark"] .devis-summary-icon{color:#EDCD8D;background:#312A15} :root[data-theme="dark"] .devis-client-select{background:#1C2533} :root[data-theme="dark"] .devis-summary{background:linear-gradient(145deg,var(--client-tint,#FFFDF8),#362D17)} :root[data-theme="dark"] .devis-summary dl div{border-bottom:1px solid #574930} :root[data-theme="dark"] .devis-summary dt{color:#AEB9CB} :root[data-theme="dark"] .badge.draft{background:#2D2613;color:#E4C895} :root[data-theme="dark"] .devis-summary p{color:#B4BAC6} :root[data-theme="dark"] .devis-start-modal footer{background:#1C2533} :root[data-theme="dark"] .site-nav button:hover{background:rgba(28,37,51,0.1)} :root[data-theme="dark"] .hero{background-image:linear-gradient(rgba(28,37,51,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(28,37,51,0.05) 1px,transparent 1px)} :root[data-theme="dark"] .trade-chip[aria-pressed="true"]{color:#0B1730} :root[data-theme="dark"] .ba-before{background:#1A2331} :root[data-theme="dark"] .ba-after h3 .ic{color:#92E8B1} :root[data-theme="dark"] .sim-incl.on{color:#0B1730} :root[data-theme="dark"] .testi-av{color:#0B1730} :root[data-theme="dark"] .signup .side{background-image:linear-gradient(rgba(28,37,51,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(28,37,51,0.05) 1px,transparent 1px)} :root[data-theme="dark"] .mchip{border-left:4px solid color-mix(in srgb,var(--c) 60%,#fff)} :root[data-theme="dark"] .faq-item.open .faq-i::before,:root[data-theme="dark"] .faq-item.open .faq-i::after{background:#1C2533} :root[data-theme="dark"] .su-sec{color:var(--encre)} :root[data-theme="dark"] .plan-opt input:checked + .po-body{background:#352F17} :root[data-theme="dark"] .po-price{color:var(--encre)} :root[data-theme="dark"] .pay-box{background:linear-gradient(180deg,#172336,#1C2533)} :root[data-theme="dark"] .material-kpi-grid article{border:1px solid #313F4E;background:#1C2533} :root[data-theme="dark"] .material-kpi-icon.violet{background:#1E1735;color:#AC9BDF} :root[data-theme="dark"] .material-kpi-grid small{color:#B6BCC4} :root[data-theme="dark"] .material-kpi-grid em{color:#B7BCC2} :root[data-theme="dark"] .material-suppliers{border:1px solid #313F4E;background:#1C2533} :root[data-theme="dark"] .supplier-pin{background:#193022;color:#9EDCB8} :root[data-theme="dark"] .material-suppliers small{color:#B7BCC2} :root[data-theme="dark"] .material-supplier{border:1px solid #313A4B} :root[data-theme="dark"] .supplier-logo.blue{background:#162034;color:#97B5E3} :root[data-theme="dark"] .supplier-logo.orange{background:#332616;color:#ECC48D} :root[data-theme="dark"] .supplier-logo.navy{background:#1A232E;color:#A5BADA} :root[data-theme="dark"] .supplier-go{background:#1A2331} :root[data-theme="dark"] .material-requests,:root[data-theme="dark"] .material-detail,:root[data-theme="dark"] .material-analytics article{border:1px solid #313F4E;background:#1C2533} :root[data-theme="dark"] .material-requests>header span{background:#1A222F;color:#B8BCC2} :root[data-theme="dark"] .material-search{background:#1A2331;color:#B8BCC2} :root[data-theme="dark"] .material-filter-tabs button{border:1px solid #2D3C53;background:#1C2533;color:#B7BDC3} :root[data-theme="dark"] .material-filter-tabs button b{background:#1A2330} :root[data-theme="dark"] .material-filter-tabs button.active b{background:rgba(28,37,51,0.2)} :root[data-theme="dark"] .material-row{border-top:1px solid #2A394F;background:#1C2533} :root[data-theme="dark"] .material-row:hover,:root[data-theme="dark"] .material-row.selected{background:#1D2E21} :root[data-theme="dark"] .material-row .material-request-icon{background:#172135;color:#90B3E9} :root[data-theme="dark"] .material-main>span{color:#B6BCC3} :root[data-theme="dark"] .material-main>span i{background:color-mix(in srgb,var(--c) 60%,#fff)} :root[data-theme="dark"] .material-person{color:#B6BCC3} :root[data-theme="dark"] .material-requests footer{color:#B8BCC1} :root[data-theme="dark"] .material-detail-close{color:#B8BCC2} :root[data-theme="dark"] .material-detail-close:hover{background:#1A2330} :root[data-theme="dark"] .detail-kicker{color:#B8BDC2} :root[data-theme="dark"] .detail-title .material-request-icon{background:#172135;color:#90B3E9} :root[data-theme="dark"] .material-detail dl{border-top:1px solid #2C3B51} :root[data-theme="dark"] .material-detail dl>div{border-bottom:1px solid #2C3B51} :root[data-theme="dark"] .material-detail dt{color:#B8BCC2} :root[data-theme="dark"] .detail-note{background:#1A2431;color:#B7BCC3} :root[data-theme="dark"] .material-timeline{background:#1A2431} :root[data-theme="dark"] .material-timeline small{color:#B8BCC2} :root[data-theme="dark"] .material-timeline b{color:#A7D2BF} :root[data-theme="dark"] .material-detail-empty{color:#B7BDC2} :root[data-theme="dark"] .material-chart:before{background:#1C2533} :root[data-theme="dark"] .material-chart small{color:#B8BDC1} :root[data-theme="dark"] .material-chart-legend div{border-bottom:1px solid #2A394F} :root[data-theme="dark"] .material-chart-legend i{background:color-mix(in srgb,var(--c) 60%,#fff)} :root[data-theme="dark"] .material-chart-legend small{color:#B8BDC2} :root[data-theme="dark"] .notif-filters button[aria-selected="true"]{color:#0B1730} :root[data-theme="dark"] .plan-table th.today small{color:#EECB96} :root[data-theme="dark"] .material-row{border:1px solid #30404F!important;border-left:4px solid color-mix(in srgb,var(--material-color) 60%,#fff)!important;background:#1C2533!important} :root[data-theme="dark"] .material-row:hover{border-color:color-mix(in srgb,var(--material-color) 60%,#fff)!important} :root[data-theme="dark"] .material-row.selected{background:linear-gradient(100deg,color-mix(in srgb,var(--material-color) 8%,#1C2533),#1C2533 55%)!important} :root[data-theme="dark"] .material-row .material-request-icon{background:#172135} :root[data-theme="dark"] .material-row .material-open{background:#1E262E;color:#B1BCC9} :root[data-theme="dark"] .material-person{border-left:1px solid #2F3E4C} :root[data-theme="dark"] .material-row+.material-row{border-top:1px solid #313E4A!important} :root[data-theme="dark"] .material-row.selected{background:#1E2D21!important} :root[data-theme="dark"] .material-row:hover{border-left-color:color-mix(in srgb,var(--material-color) 60%,#fff)!important;background:#1E292E!important} :root[data-theme="dark"] .material-main>span .material-category{background:#211735;color:#B59CDD} :root[data-theme="dark"] .material-date{color:#B6BDC4} :root[data-theme="dark"] .material-row .material-open{background:#1B2431} :root[data-theme="dark"] .material-row:hover .material-open{background:#1C262D;color:#ACBCCD} :root[data-theme="dark"] .material-row{border:1px solid #2E4051!important;border-left:1px solid #2E4051!important;background:#1C2533!important} :root[data-theme="dark"] .material-row+.material-row{border-top:1px solid #2E4051!important} :root[data-theme="dark"] .material-row.selected{border-color:#32455A!important;border-left-color:#32455A!important;background:#1C2533!important} :root[data-theme="dark"] .material-row:hover{border-color:#36485E!important;border-left-color:#36485E!important;background:#1C2533!important} :root[data-theme="dark"] .material-row .material-request-icon{background:#1C2533;color:#A2C1E5} :root[data-theme="dark"] .material-main>span{color:#B2BBC7} :root[data-theme="dark"] .material-row .material-person{border-left:1px solid #2E4051;background:#1B2631;color:#B4CBEA} :root[data-theme="dark"] .material-person small{color:#B4CBEA} :root[data-theme="dark"] .material-status-pill.warn{background:#322815;color:#E9C190} :root[data-theme="dark"] .material-status-pill.info{background:#162334;color:#93B4E6} :root[data-theme="dark"] .material-status-pill.ok{background:#183023;color:#96E3BE} :root[data-theme="dark"] .material-more{background:#1C2430;color:#B0C9E3} :root[data-theme="dark"] .material-analytics article{border-color:#2E4051;background:linear-gradient(135deg,#1C2533 0%,#172237 100%)} :root[data-theme="dark"] .material-chart::before{background:linear-gradient(145deg,#1C2533,#1A2433)} :root[data-theme="dark"] .material-chart-line>i{background:color-mix(in srgb,var(--c) 60%,#fff)} :root[data-theme="dark"] .material-chart-line span{color:#ACBACE} :root[data-theme="dark"] .material-chart-line small{color:#B6BCC3} :root[data-theme="dark"] .material-chart-legend em{background:#1A262F} :root[data-theme="dark"] .material-chart-legend em i{background:linear-gradient(90deg,color-mix(in srgb,var(--c) 60%,#fff),color-mix(in srgb,var(--c) 68%,#1C2533))} :root[data-theme="dark"] .material-chart{outline:5px solid color-mix(in srgb,var(--chart-color) 14%,#293C4E)} :root[data-theme="dark"] .material-chart::before{background:radial-gradient(circle at 32% 25%,color-mix(in srgb,var(--chart-color) 24%,#1C2533),color-mix(in srgb,var(--chart-color) 9%,#1C2533) 58%,#1C2533 100%)} :root[data-theme="dark"] .material-chart-legend em{background:#1A232F} :root[data-theme="dark"] .material-chart-legend em i{background:linear-gradient(90deg,color-mix(in srgb,var(--c) 60%,#fff),color-mix(in srgb,var(--c) 78%,#1C2533))} :root[data-theme="dark"] .material-analytics article{background:#1C2533} :root[data-theme="dark"] .material-analytics h2{color:#C8D2E5} :root[data-theme="dark"] .material-chart::before{background:#1C2533} :root[data-theme="dark"] .material-chart-line,:root[data-theme="dark"] .material-chart-total{border-bottom:1px solid #323E4B!important} :root[data-theme="dark"] .material-chart-line span{color:#B2BBC8} :root[data-theme="dark"] .material-chart-line small{color:#B7BDC3} :root[data-theme="dark"] .material-chart-total{color:#B7BDC2} :root[data-theme="dark"] .material-chart-total b{color:#B3BECA} :root[data-theme="dark"] .material-chart-total small{color:#B7BDC3} :root[data-theme="dark"] .material-chart::before{background:#1C2533} :root[data-theme="dark"] .material-chart-total{border-top:1px solid #313F4E!important} :root[data-theme="dark"] .material-more-requests{border-top:1px solid #2F3E4C;color:#9DBADD} :root[data-theme="dark"] .material-more-requests:hover{color:#AEC9EA;background:#172736} :root[data-theme="dark"] .task-board-icon{background:#322615;color:#B6C4D9} :root[data-theme="dark"] .task-chantier-select{border:1px solid #2F4058;background:#1C2533;color:#D0D8E9} :root[data-theme="dark"] .task-chantier-select select option{color:#D0D8E9} :root[data-theme="dark"] .col{background:linear-gradient(145deg,#2E281D,#1A2230)} :root[data-theme="dark"] .col-heading .ic{color:#D5DBE8} :root[data-theme="dark"] .col-terminé .col-heading .ic{color:#9BDEB7} :root[data-theme="dark"] .col > header .n{background:#18212D;color:#D5DBE8} :root[data-theme="dark"] .task{border:1px solid #2F3F57;background:linear-gradient(135deg,#1C2533,#312A1C)} :root[data-theme="dark"] .task:hover{border-color:#33455F} :root[data-theme="dark"] .task-project{border-color:#2D3D54;background:#1A2331;color:#B0B9C9} :root[data-theme="dark"] .task-project .ic{color:#B5BBC4} :root[data-theme="dark"] .task-bottom{color:#B9C3D4} :root[data-theme="dark"] .task-state.progress{background:#162234;color:#8FAFEB} :root[data-theme="dark"] .task-open{border-color:#2F3F58;background:#1C2533} :root[data-theme="dark"] .task-menu{color:#B5C2D5} :root[data-theme="dark"] .col .empty-state{background:rgba(28,37,51,0.48)} :root[data-theme="dark"] .task-chantier-select select{color:#D0D8E9} :root[data-theme="dark"] .company-hero{border:1px solid #2C3E55;background:radial-gradient(circle at 88% 0,#162334 0,transparent 29%),linear-gradient(135deg,#1C2533,#172436)} :root[data-theme="dark"] .company-eyebrow{color:#B1BAC8} :root[data-theme="dark"] .company-hero p{color:#B1BAC9} :root[data-theme="dark"] .company-hero-status{background:#322815;color:#E7C493} :root[data-theme="dark"] .company-hero-status.ready{background:#183021;color:#98E1BB} :root[data-theme="dark"] .company-card{border:1px solid #2D3E53!important;background:#1C2533!important} :root[data-theme="dark"] .company-card p{color:#B3BAC7} :root[data-theme="dark"] .company-card-icon.blue{background:#162234;color:#97B6E3} :root[data-theme="dark"] .company-card-icon.gold{background:#322915;color:#EDCC8D} :root[data-theme="dark"] .company-card-icon.green{background:#183123;color:#97E3C1} :root[data-theme="dark"] .company-card-icon.violet{background:#211634;color:#B49EDB} :root[data-theme="dark"] .company-save{background:#172434;color:#B2BBC8} :root[data-theme="dark"] .company-chip{background:#172135;color:#9BB8DF} :root[data-theme="dark"] .company-field span{color:#B0BAC9} :root[data-theme="dark"] .company-field input,:root[data-theme="dark"] .company-field select{border:1px solid #304156;background:#172237;color:#C5D2E7} :root[data-theme="dark"] .company-legal-note{background:#192234;color:#B0BAC9} :root[data-theme="dark"] .company-legal-note .ic{color:#A8BBD2} :root[data-theme="dark"] .company-electronic{border:1px solid #332658;background:linear-gradient(145deg,#241737,#211735)} :root[data-theme="dark"] .company-electronic .company-eyebrow{color:#B8A9D0} :root[data-theme="dark"] .company-electronic p{color:#B8B6C3} :root[data-theme="dark"] .company-electronic-steps span{color:#B8B4C5} :root[data-theme="dark"] .company-electronic-steps .ic{color:#B4A4D6} :root[data-theme="dark"] .worker-head p{color:#B2BAC7} :root[data-theme="dark"] .worker-material{border:1px solid #2D3E54;background:#1C2533;color:#A0BADA} :root[data-theme="dark"] .worker-job{border:1px solid #2A3F56;background:linear-gradient(135deg,#1C2533,#172436)} :root[data-theme="dark"] .worker-job-icon{background:color-mix(in srgb,var(--worker-job) 13%,#1C2533)} :root[data-theme="dark"] .worker-job p{color:#B2BBC7} :root[data-theme="dark"] .worker-job-date{background:color-mix(in srgb,var(--worker-job) 12%,#1C2533)} :root[data-theme="dark"] .worker-job-address{background:#182434;color:#AEBACB} :root[data-theme="dark"] .worker-job-footer{border-top:1px solid #2C3C51;color:#B0BBC9} :root[data-theme="dark"] .worker-no-job{border:1px solid #2D3E52;background:#1C2533} :root[data-theme="dark"] .worker-no-job>.ic{color:#A9BAD0} :root[data-theme="dark"] .worker-no-job span{color:#B3BAC7} :root[data-theme="dark"] .worker-section{border:1px solid #2C3D53;background:#1C2533} :root[data-theme="dark"] .worker-count{background:#162234;color:#99B9E1} :root[data-theme="dark"] .worker-task{border:1px solid #2C3F53;background:#1C2533} :root[data-theme="dark"] .worker-task.late{border-color:#5D2828;background:#371818} :root[data-theme="dark"] .worker-task-main{color:#C4D1E5} :root[data-theme="dark"] .worker-task-main small{color:#B2BBC7} :root[data-theme="dark"] .worker-task.late .worker-task-main small{color:#D9A1A1} :root[data-theme="dark"] .worker-done{background:#183021;color:#98E1BB} :root[data-theme="dark"] .worker-more{color:#99B9E0} :root[data-theme="dark"] .worker-slot{border:1px solid #2E3D50;background:#172736} :root[data-theme="dark"] .worker-slot-day{background:#162234;color:#9BB8DF} :root[data-theme="dark"] .worker-slot small{color:#B2BBC7} :root[data-theme="dark"] .tasks-page .col{background:linear-gradient(145deg,#19212E,#18202C)} :root[data-theme="dark"] .assistant-choice{background:#1C2533} :root[data-theme="dark"] .assistant-choice button{border:1px solid #263D59;background:#172436;color:#A8BDD1} :root[data-theme="dark"] .assistant-choice button.active{background:#162234;color:#96BBE3} :root[data-theme="dark"] .assistant-messages{background:linear-gradient(180deg,#172336 0%,#1C2533 100%)!important} :root[data-theme="dark"] .assistant-msg.bot{border-color:#263D59!important} :root[data-theme="dark"] .assistant-msg.user{background:#162233!important;color:#96BBE3!important} :root[data-theme="dark"] .assistant-suggestions{border-top:1px solid #283A52} :root[data-theme="dark"] .assistant-suggestions::before{color:#B1BBC8} :root[data-theme="dark"] .assistant-suggestions button{border-color:#263D59!important;background:#172536!important;color:#9FBADB!important} :root[data-theme="dark"] .assistant-suggestions button:hover{background:#162234!important;border-color:#293F5F!important} :root[data-theme="dark"] .assistant-panel{border:1px solid #2B3E55;background:#1C2533} :root[data-theme="dark"] .assistant-head-icon{background:rgba(28,37,51,0.15)} :root[data-theme="dark"] .assistant-panel header button{background:rgba(28,37,51,0.1)} :root[data-theme="dark"] .assistant-panel header button:hover{background:rgba(28,37,51,0.2)} :root[data-theme="dark"] .assistant-messages{background:linear-gradient(180deg,#182435,#1C2533)} :root[data-theme="dark"] .assistant-msg.bot{border:1px solid #2C3D52;background:#1C2533;color:#ADBED5} :root[data-theme="dark"] .assistant-msg.user{background:#162234;color:#9EBDE4} :root[data-theme="dark"] .assistant-suggestions{background:#1C2533} :root[data-theme="dark"] .assistant-suggestions button{border:1px solid #2C3E54;background:#182435;color:#A3BBD7} :root[data-theme="dark"] .assistant-suggestions button:hover{background:#172235} :root[data-theme="dark"] .assistant-compose{border-top:1px solid #2E3C4D;background:#1C2533} :root[data-theme="dark"] .assistant-compose input{border:1px solid #2F4358} /* ==== AUTO-DARK:END ==== */ :root[data-theme="dark"] .col{background:#121A28} :root[data-theme="dark"] .ba-before{background:#141D2B} :root[data-theme="dark"] .paper table th{background:#222C3D;color:#C7D2E3} :root[data-theme="dark"] .priority-section{background:#141D2B} :root[data-theme="dark"] .priority-count{background:#222C3D;color:var(--ardoise)} :root[data-theme="dark"] .project-progress{background:#222C3D} :root[data-theme="dark"] .overview-icon{background:#222C3D} :root[data-theme="dark"] .priority-date.late{background:var(--bad-bg);color:var(--bad)} *{box-sizing:border-box} html,body{margin:0;padding:0} body{background:var(--craie);color:var(--encre);font-family:var(--texte);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased} h1,h2,h3,.brand b,.kpi .value{font-family:var(--titre);font-optical-sizing:auto;letter-spacing:-.015em;margin:0;line-height:1.15;text-wrap:balance} h1{font-size:1.9rem;font-weight:700} h2{font-size:1.25rem;font-weight:650} h3{font-size:1.05rem;font-weight:650} p{margin:0} button,input,select,textarea{font:inherit;color:inherit} a{color:var(--bleu)} .num{font-variant-numeric:tabular-nums} .muted{color:var(--ardoise)} .small{font-size:.875rem} .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} [hidden]{display:none !important} :focus-visible{outline:3px solid #2F6FEB;outline-offset:2px;border-radius:6px} .on-dark :focus-visible,.sidebar :focus-visible,.hero :focus-visible{outline-color:var(--metre)} .skip{position:absolute;left:-999px;top:8px;background:var(--metre);color:var(--encre);padding:8px 12px;border-radius:8px;z-index:200;font-weight:700} .skip:focus{left:8px} svg.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none} /* ---------- Boutons, champs, pastilles ---------- */ .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 18px;border-radius:var(--r);border:1px solid var(--trait);background:var(--papier);color:var(--encre);font-weight:700;cursor:pointer;text-decoration:none;line-height:1.2} .btn:hover{background:var(--craie)} .btn.primary{background:var(--metre);border-color:var(--metre);color:var(--encre)} .btn.primary:hover{background:var(--metre-fonce);border-color:var(--metre-fonce)} .btn.dark{background:var(--nuit);border-color:var(--nuit);color:#fff} .btn.dark:hover{background:var(--bleu)} .btn.danger{color:var(--bad);border-color:var(--bad)} .btn.sm{min-height:36px;padding:5px 12px;font-size:.9rem;border-radius:8px} .btn.lg{min-height:52px;padding:12px 24px;font-size:1.05rem} .btn.ghost{border-color:transparent;background:transparent} .btn.ghost:hover{background:var(--bleu-clair)} .btn.line-light{background:transparent;border-color:rgba(255,255,255,.45);color:#fff} .btn.line-light:hover{background:rgba(255,255,255,.12)} .btn[disabled]{opacity:.5;cursor:not-allowed} .icon-btn{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:var(--r);border:1px solid transparent;background:transparent;cursor:pointer;color:var(--ardoise)} .icon-btn:hover{background:var(--bleu-clair);color:var(--encre)} .icon-btn.sm{width:36px;height:36px} .link-btn{background:none;border:0;padding:0;color:var(--bleu);font-weight:700;cursor:pointer;text-align:left;text-decoration:underline;text-underline-offset:3px} .field{display:flex;flex-direction:column;gap:6px;min-width:0} .field label,.field .lbl{font-size:.9rem;font-weight:700;color:var(--ardoise)} input[type=text],input[type=number],input[type=date],input[type=search],input[type=email],input[type=tel],select,textarea{width:100%;min-height:44px;padding:9px 12px;border-radius:var(--r);border:1px solid #8C98AE;background:var(--papier);color:var(--encre)} textarea{min-height:120px;resize:vertical;line-height:1.5} input:disabled,select:disabled{background:var(--craie);color:var(--ardoise);border-color:var(--trait)} .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px} .form-grid .full{grid-column:1/-1} .err{color:var(--bad);background:var(--bad-bg);padding:9px 12px;border-radius:8px;font-size:.9rem;font-weight:700} .hint-box{background:var(--bleu-clair);color:var(--info);padding:11px 14px;border-radius:var(--r);font-size:.92rem} .badge{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;font-size:.8rem;font-weight:700;white-space:nowrap} .badge::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor} .badge.ok{background:var(--ok-bg);color:var(--ok)} .badge.warn{background:var(--warn-bg);color:var(--warn)} .badge.bad{background:var(--bad-bg);color:var(--bad)} .badge.info{background:var(--info-bg);color:var(--info)} .badge.neutral{background:var(--neutral-bg);color:var(--neutral)} .tag{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:700;padding:1px 8px;border-radius:6px;background:var(--craie);border:1px solid var(--trait);color:var(--ardoise)} .dot{width:9px;height:9px;border-radius:50%;background:var(--c,#64748B);flex:none} .avatar{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--c,#64748B);color:#fff;font-size:.72rem;font-weight:700;flex:none} .avatar.lg{width:42px;height:42px;font-size:.92rem} .switch{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;min-height:44px} .switch input{position:absolute;opacity:0;width:44px;height:44px;margin:0;cursor:pointer} .switch .track{width:44px;height:26px;border-radius:99px;background:#6B7890;position:relative;transition:background .15s;flex:none} .switch .track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .15s} .switch input:checked + .track{background:var(--bleu)} .switch input:checked + .track::after{transform:translateX(18px)} .switch input:focus-visible + .track{outline:3px solid #2F6FEB;outline-offset:2px} /* Ruban gradué : l'avancement se lit comme un mètre */ .ruler{position:relative;height:12px;border-radius:3px;background:#E3E8F0;overflow:hidden} .ruler > i{display:block;height:100%;background:var(--bleu)} .ruler::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1.5px),rgba(255,255,255,.9) calc(10% - 1.5px) 10%)} .projects-card{padding:17px 18px!important}.projects-card > header{padding-bottom:12px;border-bottom:1px solid var(--trait);margin-bottom:0}.projects-title{display:flex;align-items:center;gap:8px}.projects-title .ic{width:23px;height:23px;color:var(--bleu)}.projects-title h2{margin:0;font-size:1.22rem}.projects-card header .btn{white-space:nowrap}.projects-card header .btn .ic{width:15px;height:15px} .project-row{position:relative;display:grid;grid-template-columns:5px minmax(0,1fr) 62px;gap:11px;width:100%;padding:13px 0;border:0;border-bottom:1px solid var(--trait);background:transparent;color:var(--encre);text-align:left;cursor:pointer}.project-row:last-child{border-bottom:0;padding-bottom:0}.project-row:hover .project-content b{text-decoration:underline;text-underline-offset:3px}.project-accent{border-radius:99px;background:var(--project-color)}.project-content{min-width:0}.project-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.project-top b{display:block;font-size:.96rem;line-height:1.2}.project-top small{display:block;margin-top:3px;color:var(--ardoise);font-size:.8rem;font-weight:500}.project-status{flex:none;border-radius:999px;background:var(--project-tint);color:var(--project-color);padding:4px 7px;font-size:.68rem;font-weight:800;white-space:nowrap}.project-progress{display:block;position:relative;height:8px;margin:10px 0 9px;border-radius:99px;background:#E3E8F0;overflow:hidden}.project-progress i{display:block;height:100%;width:0;background:var(--project-color);border-radius:inherit}.project-meta{display:flex;align-items:center;gap:5px;color:var(--ardoise);font-size:.7rem;line-height:1.3}.project-meta .ic{width:14px;height:14px;flex:none}.project-meta em{font-style:normal;margin:0 1px}.project-ring{display:grid;place-items:center;align-self:center;width:58px;height:58px;border-radius:50%;background:conic-gradient(var(--project-color) var(--progress),var(--ring-track,#E5EAF2) 0);position:relative}.project-ring::before{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--papier)}.project-ring b{position:relative;font-size:.78rem;white-space:nowrap;color:var(--encre)} .priorities-card{padding:20px!important}.priorities-card > header{align-items:center;padding-bottom:14px;border-bottom:1px solid var(--trait);margin-bottom:14px}.priorities-title{display:flex;align-items:center;gap:9px}.priorities-title .ic{width:25px;height:25px}.priorities-title h2{margin:0}.priorities-all{margin-left:auto;display:flex;align-items:center;gap:5px;text-decoration:none}.priorities-all .ic{width:17px;height:17px}.priority-list{display:flex;flex-direction:column;gap:16px}.priority-section{border-radius:16px;padding:16px}.priority-section header{display:flex;align-items:center;gap:10px;margin-bottom:8px}.priority-heading{display:flex;align-items:center;gap:9px;font-size:1rem}.priority-heading .ic{width:21px;height:21px}.priority-count{border-radius:999px;padding:4px 8px;background:#EEF1F6;color:var(--ardoise);font-size:.75rem;font-weight:800}.priority-reminders{background:linear-gradient(135deg,#FFF8EA,#FFFDF7)}.priority-reminders .priority-count{background:#FFF0CD;color:#8A5510}.priority-reminder{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:9px;align-items:center;width:100%;padding:11px 0;border:0;border-top:1px solid #F0E4CD;background:transparent;color:var(--encre);text-align:left;cursor:pointer}.priority-reminder:first-of-type{border-top:0}.priority-reminder b,.priority-task b{display:block;font-size:.93rem}.priority-reminder small,.priority-task small{display:block;color:var(--ardoise);font-size:.78rem;font-weight:500;margin-top:2px}.priority-phone .ic{width:19px;height:19px}.priority-reminder .btn{display:inline-flex;align-items:center;gap:5px}.priority-reminder .btn .ic{width:15px;height:15px}.priority-tasks{border:1px solid var(--trait);background:#fff}.priority-task{display:grid;grid-template-columns:26px minmax(0,1fr) auto 18px;gap:10px;align-items:center;width:100%;padding:12px 0;border:0;border-top:1px solid var(--trait);background:transparent;color:var(--encre);text-align:left;cursor:pointer}.priority-task:hover b{text-decoration:underline;text-underline-offset:3px}.priority-check{width:19px;height:19px;border:2px solid var(--encre);border-radius:4px}.priority-date{display:flex;align-items:center;gap:6px;border-radius:999px;padding:4px 8px;background:#FFF0CD;color:#865315;font-size:.72rem;font-weight:800;white-space:nowrap}.priority-date.late{background:#FCE4E4;color:#9D2525}.priority-date small{margin:0;color:inherit;font-size:.7rem;font-weight:600}.priority-task > .ic{width:18px;height:18px} /* ---------- Application : structure ---------- */ .app{display:grid;grid-template-columns:252px minmax(0,1fr);min-height:100vh} .sidebar{background:var(--nuit);color:#E8EEF9;padding:20px 14px;display:flex;flex-direction:column;gap:22px;position:sticky;top:0;height:100vh} .brand{display:flex;align-items:center;gap:10px;padding:4px 8px;color:inherit;text-decoration:none} .brand-mark{width:34px;height:34px;border-radius:8px;background:var(--metre);color:var(--encre);display:grid;place-items:center;font-family:var(--titre);font-weight:800;font-size:1.1rem} .avatar.photo{object-fit:cover;object-position:center top;background:#fff;border:1px solid var(--trait);display:inline-block} .viewas{background:var(--metre);color:var(--encre);padding:9px 24px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-weight:700;position:sticky;top:69px;z-index:29} .viewas .btn{background:var(--encre);border-color:var(--encre);color:#fff} .photo-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap} .brand-mark svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} .brand b{display:block;font-size:1.15rem;line-height:1.1} .brand span{font-size:.78rem;opacity:.75} .nav{display:flex;flex-direction:column;gap:17px}.nav-group{display:flex;flex-direction:column;gap:2px}.nav-label{margin:0 0 3px 12px;color:#9AACC9;font-size:.63rem;font-weight:850;letter-spacing:.11em;text-transform:uppercase}.nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;min-height:42px;border-radius:10px;color:#E8EEF9;text-decoration:none;font-weight:700;position:relative;font-size:.88rem}.nav a .ic{width:18px;height:18px;color:#C8D5EB}.nav a:hover{background:rgba(255,255,255,.075);color:#fff}.nav a[aria-current="page"]{background:linear-gradient(90deg,rgba(74,104,153,.55),rgba(255,255,255,.10));color:#fff;box-shadow:inset 0 1px rgba(255,255,255,.05)}.nav a[aria-current="page"] .ic{color:#fff}.nav a[aria-current="page"]::before{content:"";position:absolute;left:-14px;top:8px;bottom:8px;width:4px;border-radius:0 4px 4px 0;background:var(--metre);box-shadow:0 0 10px rgba(255,202,40,.55)}.nav-archive{margin-top:-5px;padding-top:11px;border-top:1px solid rgba(213,226,247,.12)} .nav .count{margin-left:auto;background:var(--metre);color:var(--encre);border-radius:999px;font-size:.78rem;font-weight:800;padding:0 8px} /* Rangée d'outils en bas de la barre latérale : bouton clair/sombre + déconnexion, juste au-dessus du profil */ .side-tools{margin-top:auto;display:grid;grid-template-columns:44px 1fr;gap:8px} .side-tool{display:flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:0 12px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);color:#E8EEF9;font:inherit;font-size:.88rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s} .side-tool .ic{width:19px;height:19px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} .side-tool:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.34)} .side-tool:focus-visible{outline:2px solid #fff;outline-offset:2px} .side-theme{padding:0} /* Sur ordinateur, le bouton clair/sombre est dans la barre de gauche : on retire le doublon en haut à droite. Sous 900 px la barre de gauche disparaît (barre du bas), le bouton du haut reste donc sur téléphone et tablette. */ @media (min-width:901px){.topbar [data-action="toggle-theme"],.topbar .notif-bell{display:none}} /* Cloche de notifications (téléphone / tablette) avec son compteur */ .notif-bell{position:relative;text-decoration:none} .notif-bell[hidden]{display:none} .notif-bell[aria-current="page"]{background:var(--bleu-clair);color:var(--encre)} .notif-bell .count{position:absolute;top:4px;right:3px;min-width:18px;height:18px;display:inline-grid;place-items:center;background:var(--metre);color:var(--encre);border-radius:99px;font-size:.66rem;font-weight:800;padding:0 4px;line-height:1} .notif-bell .count[hidden]{display:none} /* « Se déconnecter » : un style franc dans chaque thème (contraste ≥ 4,5:1). Mode jour : bouton clair, texte rouge. Mode nuit : bouton rouge translucide, texte rose clair. */ .side-logout{background:#FFFFFF;border-color:#FFFFFF;color:#B91C1C;font-weight:700} .side-logout:hover{background:#FEE2E2;border-color:#FEE2E2;color:#991B1B} :root[data-theme="dark"] .side-logout{background:rgba(248,113,113,.14);border-color:rgba(248,113,113,.5);color:#FECACA} :root[data-theme="dark"] .side-logout:hover{background:rgba(248,113,113,.28);border-color:#FCA5A5;color:#FFF1F1} /* Icône du bouton de thème : une lune en mode clair (pour passer au sombre), un soleil en mode sombre */ .th-moon,.th-sun{display:inline-grid;place-items:center} .th-sun{display:none} :root[data-theme="dark"] .th-moon{display:none} :root[data-theme="dark"] .th-sun{display:inline-grid} .side-foot{margin-top:-10px;display:flex;gap:10px;align-items:center;padding:10px;border-radius:12px;background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(89,116,160,.18));font-size:.88rem;text-align:left;border:1px solid rgba(255,255,255,.07);color:inherit;cursor:pointer;width:100%}.side-foot>span{min-width:0;flex:1}.side-foot>i{font-style:normal;font-size:1.35rem;opacity:.75} .side-foot:hover{background:rgba(255,255,255,.15)} .side-foot b{display:block;font-weight:700} .side-foot span{opacity:.75;font-size:.8rem} .content{min-width:0;display:flex;flex-direction:column} .topbar{display:flex;align-items:center;gap:10px;padding:12px 24px;background:var(--papier);border-bottom:1px solid var(--trait);position:sticky;top:0;z-index:30} .topbar .brand{display:none;color:var(--encre)} .search-btn{display:flex;align-items:center;gap:10px;flex:1;min-width:0;max-width:420px;min-height:44px;padding:8px 14px;border:1px solid var(--trait);border-radius:var(--r);background:var(--craie);color:var(--ardoise);cursor:pointer;text-align:left} .search-btn:hover{border-color:#8C98AE} .search-btn kbd{margin-left:auto;font:inherit;font-size:.78rem;border:1px solid var(--trait);border-radius:5px;padding:0 6px;background:var(--papier)} .demo-pill{margin-left:auto;font-size:.8rem;font-weight:700;background:var(--warn-bg);color:var(--warn);padding:3px 10px;border-radius:999px;white-space:nowrap} #main{padding:28px 24px 40px;max-width:1240px;width:100%;margin:0 auto} #main:has(.overview-card){max-width:1400px} .page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:22px} .page-head p{color:var(--ardoise);margin-top:4px} .head-actions{display:flex;gap:10px;flex-wrap:wrap} .stack{display:flex;flex-direction:column;gap:18px} .row{display:flex;gap:12px;align-items:center;flex-wrap:wrap} .spread{justify-content:space-between} .grid-2{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:20px;align-items:start} .card{background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);padding:20px} .card.flush{padding:0;overflow:hidden} .card > header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px} .empty-state{padding:26px 14px;text-align:center;color:var(--ardoise)} .empty-state .btn{margin-top:12px} /* Bandeau de chiffres : une seule surface, quatre cellules */ .overview-card{background:var(--papier);border:1px solid var(--trait);border-radius:20px;margin-bottom:20px;overflow:hidden}.overview-card > header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--trait);margin:0}.overview-card h2{font-size:1.45rem;margin:0}.overview-period{border:1px solid var(--trait);border-radius:9px;padding:7px 12px;color:var(--encre);font-weight:700;font-size:.86rem}.overview-period::after{content:"⌄";margin-left:8px}.overview-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:18px 0}.overview-metric{display:flex;align-items:flex-start;gap:12px;padding:0 22px;border-right:1px solid var(--trait);min-width:0}.overview-metric:last-child{border-right:0}.overview-icon{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;color:var(--bleu);background:#E9F0FF}.overview-icon .ic{width:23px;height:23px}.overview-metric.receivable .overview-icon{color:#D54A43;background:#FDEAE8}.overview-metric.quotes .overview-icon{color:#B97B00;background:#FFF4D9}.overview-metric.jobs .overview-icon{color:#B97B00;background:#FFF4D9}.overview-metric > div{min-width:0;display:flex;flex-direction:column}.overview-label{text-transform:uppercase;letter-spacing:.1em;color:var(--ardoise);font-size:.7rem;font-weight:800}.overview-metric b{font-size:1.75rem;line-height:1.15;margin:5px 0;font-variant-numeric:tabular-nums;white-space:nowrap}.overview-metric small{color:var(--ardoise);font-size:.78rem;line-height:1.3}.overview-metric.receivable small{color:#B33630;font-weight:700}.overview-attention{display:flex;align-items:center;gap:9px;padding:14px 24px;border-top:1px solid var(--trait);font-weight:700;color:#25603C}.overview-attention.is-alert{color:#A93B34}.overview-attention .ic{width:22px;height:22px} @media(max-width:760px){.overview-card > header{padding:17px}.overview-card h2{font-size:1.25rem}.overview-metrics{grid-template-columns:repeat(2,minmax(0,1fr));padding:0}.overview-metric{padding:16px;border-bottom:1px solid var(--trait)}.overview-metric:nth-child(2){border-right:0}.overview-metric:nth-child(3),.overview-metric:nth-child(4){border-bottom:0}.overview-metric b{font-size:1.45rem}.overview-attention{padding:13px 17px;font-size:.88rem}} .grid-kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--papier);border:1px solid var(--trait);border-radius:var(--r);margin-bottom:20px;overflow:hidden} .kpi{display:flex;flex-direction:column;gap:2px;padding:18px 20px;border-right:1px solid var(--trait)} .kpi:last-child{border-right:0} .kpi .label{color:var(--ardoise);font-size:.9rem;font-weight:700} .kpi .value{font-size:1.8rem;font-weight:700;font-variant-numeric:tabular-nums} .kpi .hint{font-size:.85rem;color:var(--ardoise)} .kpi.alert .hint{color:var(--bad);font-weight:700} /* Premiers pas */ .onboarding{border-color:var(--bleu);margin-bottom:20px} .onboarding ul{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column} .onboarding li{display:flex;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--trait);flex-wrap:wrap} .onboarding .tick{width:26px;height:26px;border-radius:50%;border:2px solid #8C98AE;display:grid;place-items:center;flex:none;color:#fff} .onboarding li.done .tick{background:var(--bleu);border-color:var(--bleu)} .onboarding li.done .t{color:var(--ardoise);text-decoration:line-through} .onboarding .t{flex:1;min-width:180px;font-weight:700} /* Listes et tableaux : sans boîtes, séparées par un trait */ .tabs{display:flex;gap:4px;border-bottom:1px solid var(--trait);margin-bottom:18px;overflow-x:auto} .tabs button{border:0;background:transparent;padding:10px 14px;min-height:44px;font-weight:700;color:var(--ardoise);cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap} .tabs button[aria-selected="true"]{color:var(--encre);border-bottom-color:var(--metre)} .chips{display:flex;gap:8px;flex-wrap:wrap} .chipbtn{border:1px solid var(--trait);background:var(--papier);border-radius:999px;padding:6px 14px;min-height:36px;cursor:pointer;font-weight:700;font-size:.9rem} .chipbtn[aria-pressed="true"]{background:var(--nuit);color:#fff;border-color:var(--nuit)} .table-wrap{overflow-x:auto} table{width:100%;border-collapse:collapse} th{font-size:.85rem;color:var(--ardoise);text-align:left;padding:10px 16px;background:var(--craie);border-bottom:1px solid var(--trait);font-weight:700} td{padding:13px 16px;border-bottom:1px solid var(--trait);vertical-align:middle} tr:last-child td{border-bottom:0} tbody tr.click{cursor:pointer} tbody tr.click:hover{background:var(--bleu-clair)} td.r,th.r{text-align:right} .todo-list{display:flex;flex-direction:column} .todo{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:13px 0;border-top:1px solid var(--trait)} .todo:first-child{border-top:0;padding-top:0} .todo.call{background:var(--warn-bg);border:1px solid #E7B27B;border-radius:var(--r);padding:13px;margin:6px 0} .todo .ti{display:flex;gap:12px;align-items:flex-start;min-width:0} .todo .ti .ic{margin-top:2px} .log{list-style:none;margin:0;padding:0} .log li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--trait)} .log li:first-child{border-top:0;padding-top:0} /* Éditeur de devis : lignes à gauche, récapitulatif collé à droite */ .editor{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start} .summary{position:sticky;top:84px;display:flex;flex-direction:column;gap:14px} .summary .doc-actions{flex-direction:column;align-items:stretch} .summary .doc-actions .btn{width:100%} .lines{display:flex;flex-direction:column;gap:10px} .line{display:grid;grid-template-columns:minmax(0,3fr) 74px 74px 104px 88px 104px 44px;gap:8px;align-items:center} .line.head{font-size:.85rem;color:var(--ardoise);font-weight:700} .line.head .r{text-align:right} .line .tot{text-align:right;font-weight:700;display:block} .mlabel{display:none;font-size:.8rem;font-weight:700;color:var(--ardoise)} .totals{display:flex;flex-direction:column;gap:6px} .totals .t{display:flex;justify-content:space-between;gap:12px} .totals .t.big{font-size:1.35rem;font-weight:700;border-top:1px solid var(--trait);padding-top:10px;margin-top:4px;font-family:var(--titre)} .doc-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center} .library{display:flex;gap:8px;flex-wrap:wrap;align-items:center} .library select{max-width:100%;flex:1 1 260px} .paper{background:#fff;color:#111827;border:1px solid #C9D1DE;border-radius:6px;padding:26px;font-size:.92rem}.paper h3{font-size:1.35rem;color:var(--bleu)}.paper table th{background:#F1F4F9;color:#34405A}.paper table td{border-bottom:1px solid #E3E8F0}.paper .two{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:16px 0}.paper .ph{color:#9A5200;font-weight:700}.paper .totals{margin:16px 0 0 auto;width:min(360px,100%)} .quote-paper{max-width:980px;margin:auto;padding:0;overflow:hidden;border:1px solid #D9E1EC;border-radius:16px;box-shadow:0 16px 42px rgba(20,42,76,.10);font-size:.92rem}.quote-head{display:flex;justify-content:space-between;gap:24px;padding:32px 34px 28px;background:linear-gradient(120deg,#FCFDFE 0%,#F2F6FB 100%);border-bottom:1px solid #DCE4EF}.quote-brand{display:flex;gap:14px;align-items:flex-start}.quote-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;background:#E5EFFD;color:#1A4D91}.quote-mark .ic{width:23px;height:23px}.quote-brand h3{margin:0;color:#132B53;font-size:1.42rem;line-height:1.15}.quote-brand>div>span{display:block;margin-top:5px;color:#53647E}.quote-company-legal{margin-top:8px;font-size:.72rem}.quote-doc{display:flex;flex-direction:column;align-items:flex-end;text-align:right}.quote-doc span{color:#667792;font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}.quote-doc b{margin-top:5px;font:800 1.2rem var(--titre);color:#14223B}.quote-doc small{margin-top:5px;color:#53647E}.quote-parties{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:24px 34px}.quote-party{padding:16px 18px;border:1px solid #E1E7F0;border-radius:12px;background:#fff}.quote-party span{display:block;margin-bottom:7px;color:#657691;font-size:.72rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase}.quote-party b{display:block;font-size:1rem;color:#14223B}.quote-party p{margin:5px 0 0;color:#586982;line-height:1.4}.quote-object{background:#FFF9E9;border-color:#F5E4B2}.quote-table{margin:0 34px;border:1px solid #DFE6F0;border-radius:11px}.quote-table table{margin:0}.quote-table table th{padding:12px 14px;background:#EFF3F8;color:#43526B;font-size:.76rem;text-transform:uppercase;letter-spacing:.03em}.quote-table table td{padding:13px 14px}.quote-bottom{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,350px);align-items:start;gap:28px;padding:24px 34px 16px}.quote-footer{display:flex;flex-direction:column;gap:16px}.quote-note{display:flex;flex-direction:column;gap:5px;color:#4E5F77;line-height:1.45}.quote-note b,.quote-sign b{color:#17253C}.quote-sign{padding-top:15px;border-top:1px solid #DFE6F0}.quote-sign span{display:block;margin-top:3px;color:#63748D;font-size:.8rem}.quote-sign-box{height:58px;margin-top:10px;border:1.5px dashed #A5B5CC;border-radius:9px;background:repeating-linear-gradient(135deg,#FBFCFE 0,#FBFCFE 7px,#F6F8FB 7px,#F6F8FB 14px)}.quote-totals{width:100%!important;margin:0!important;padding:17px 18px;border-radius:12px;background:#F4F7FB}.quote-totals .t{padding:2px 0}.quote-totals .t.big{margin-top:8px;padding-top:12px;border-color:#C9D6E6;font-size:1.5rem;color:#12284B}.quote-legal{margin:0 34px 28px;padding-top:15px;border-top:1px solid #E2E8F1;font-size:.76rem}@media(max-width:650px){.quote-head{padding:24px 20px;flex-direction:column}.quote-doc{align-items:flex-start;text-align:left}.quote-parties{grid-template-columns:1fr;padding:18px 20px}.quote-table{margin:0 20px}.quote-bottom{grid-template-columns:1fr;padding:20px}.quote-legal{margin:0 20px 22px}} /* Relances */ .steps{display:flex;flex-direction:column;gap:10px} .step{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 14px;align-items:center;padding:12px;border:1px solid var(--trait);border-radius:var(--r);background:var(--craie)} .step .ctl{display:flex;gap:10px;align-items:center;flex-wrap:wrap} .step input[type=number]{width:72px} .timeline{display:flex;gap:8px;flex-wrap:wrap} .tl{display:flex;flex-direction:column;gap:3px;padding:9px 11px;border-radius:var(--r);border:1px solid var(--trait);background:var(--papier);min-width:140px;font-size:.88rem} .tl b{display:flex;gap:6px;align-items:center} .tl.sent{border-color:#2E8B57} .tl.call{border-color:#D9822B;background:var(--warn-bg)} .tl.off{opacity:.6} .call-card{display:flex;gap:14px;justify-content:space-between;align-items:center;flex-wrap:wrap;border:1px solid #D9822B;background:var(--warn-bg);border-radius:var(--r);padding:14px} .call-card .who b{font-size:1.02rem;color:var(--encre);display:flex;gap:8px;align-items:center} .call-card .say{margin-top:6px;font-size:.92rem;max-width:62ch;color:var(--encre)} /* Planning */ .planning-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 18px;padding:19px 22px;border:1px solid #D5DFEC;border-radius:16px;background:linear-gradient(120deg,#fff 0%,#F3F7FC 100%);box-shadow:0 8px 20px rgba(21,48,88,.05)} .planning-kicker{display:block;margin-bottom:4px;color:#61718A;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.planning-toolbar h2{margin:0;color:#14294B;font-size:1.28rem}.planning-toolbar p{margin:5px 0 0;color:var(--ardoise);font-size:.88rem} .week-nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.week-nav .icon-btn{width:40px;height:40px;border:1px solid #C7D4E5;background:#fff;box-shadow:0 2px 5px rgba(23,45,78,.05)} .planning-surface{overflow:hidden;border:1px solid #C9D6E6;border-radius:18px;background:#E9EFF6;box-shadow:0 14px 30px rgba(23,48,83,.08),inset 0 1px 0 rgba(255,255,255,.8)} .plan-table{table-layout:fixed;min-width:1060px;margin:0;border-collapse:separate;border-spacing:0}.plan-table th{text-align:center;padding:15px 7px;background:#F9FBFD;color:#52627A;border-bottom:1px solid #D4DEEA;font-size:.75rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.plan-table th.person{text-align:left;width:205px;padding-left:18px}.plan-table th.person span{color:#263A59}.plan-table th.today{background:#FFF8E5;color:#7A4A00;box-shadow:inset 0 3px 0 #F1BA1C}.plan-table th small{display:block;margin-top:3px;color:#A96800;font-size:.62rem;letter-spacing:0;text-transform:none} .plan-table td{vertical-align:top;padding:8px;border-left:1px solid #D7E0EB;border-bottom:1px solid #D7E0EB;height:116px;background:#F4F7FA}.plan-table td.today{background:#FFFBEF}.plan-table tbody tr:last-child td{border-bottom:0}.plan-table tbody th.person{padding:14px 16px;background:#fff;color:var(--encre);font-size:.95rem;border-bottom:1px solid #D7E0EB}.plan-table tbody tr:last-child th.person{border-bottom:0}.plan-table .person .avatar{width:38px;height:38px;font-size:.75rem;box-shadow:0 3px 8px rgba(20,42,75,.18)}.plan-table .person b{font-size:.92rem}.plan-table .person .small{margin-top:2px;font-size:.75rem} .cell{display:flex;flex-direction:column;gap:6px;min-height:98px}.chip{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;border:1px solid #D6E0EB;border-left:5px solid var(--c);background:#fff;border-radius:9px;padding:8px 9px 7px;cursor:pointer;min-height:52px;width:100%;font-size:.78rem;line-height:1.25;color:var(--encre);box-shadow:0 3px 7px rgba(28,52,88,.07);transition:transform .15s ease,box-shadow .15s ease}.chip:hover{transform:translateY(-2px);box-shadow:0 7px 13px rgba(28,52,88,.12);border-color:var(--c)}.chip b{font-weight:800;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:100%}.chip span{margin-top:3px;color:var(--ardoise);font-size:.7rem;font-weight:700;text-transform:capitalize}.add-cell{align-self:stretch;border:1px dashed #B3C0D1;background:rgba(255,255,255,.55);color:#708099;border-radius:8px;min-height:28px;cursor:pointer;display:grid;place-items:center}.add-cell:hover{background:var(--bleu-clair);color:var(--encre);border-color:#6D86AA} .plan-days{display:none} .day-block{border:1px solid var(--trait);border-radius:var(--r);background:var(--papier);overflow:hidden} .day-block h3{padding:10px 14px;background:var(--craie);border-bottom:1px solid var(--trait);font-size:.98rem;text-transform:capitalize} .day-block.today h3{background:#FFF6D6} .day-block ul{list-style:none;margin:0;padding:6px 14px} .day-block li{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--trait)} .day-block li:last-child{border-bottom:0} .day-block .empty{color:var(--ardoise);padding:12px 14px} /* Matériel */ .material-overview{display:grid;grid-template-columns:minmax(0,1fr) 116px;align-items:center;gap:18px;margin-bottom:16px;padding:15px 18px;border:1px solid #D2DFEC;border-radius:14px;background:linear-gradient(115deg,#fff 0%,#F4F8FC 100%);box-shadow:0 7px 17px rgba(21,48,88,.05)}.material-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.material-kpi{display:flex;align-items:center;gap:10px;padding:4px 16px;border-right:1px solid #E1E8F0}.material-kpi:first-child{padding-left:0}.material-kpi:last-child{border-right:0}.material-kpi-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#EEF3F8;color:#556A86}.material-kpi-icon.warn{background:#FFF1D8;color:#BC6C00}.material-kpi-icon.info{background:#E8F0FF;color:#2563B8}.material-kpi-icon.ok{background:#E4F6EA;color:#14723A}.material-kpi-icon .ic{width:18px;height:18px}.material-kpi b,.material-kpi small{display:block}.material-kpi b{font-size:1.08rem;line-height:1.05}.material-kpi small{margin-top:2px;color:#5A6D87;font-size:.72rem;font-weight:700}.material-donut{display:grid;place-content:center;text-align:center;width:72px;height:72px;border-radius:50%;background:var(--donut);position:relative}.material-donut:before{content:"";position:absolute;inset:9px;border-radius:50%;background:#F8FAFD;box-shadow:inset 0 1px 2px rgba(16,39,74,.08)}.material-donut b,.material-donut small{position:relative;z-index:1}.material-donut b{font-size:1rem;color:#14294B}.material-donut small{display:none}.material-list{overflow:hidden;border:1px solid #D3DFEC;border-radius:14px;background:#F0F4F8;box-shadow:0 7px 17px rgba(21,48,88,.05)}.material-list>header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:#fff;border-bottom:1px solid #D8E2EE}.material-list>header h2{margin:0;font-size:1rem}.material-list>header span{color:#62738B;font-size:.78rem}.material-row{display:grid;grid-template-columns:4px 36px minmax(0,1fr) auto;gap:11px;align-items:center;margin:8px;padding:11px 12px 11px 0;border:1px solid #D8E2ED;border-radius:10px;background:#fff;box-shadow:0 2px 5px rgba(28,52,88,.04)}.material-accent{align-self:stretch;border-radius:0 6px 6px 0;background:var(--material-color)}.material-request-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#FFF4E2;color:#B66A00}.material-request-icon .ic{width:17px;height:17px}.material-main{min-width:0}.material-title{display:flex;gap:8px;align-items:center}.material-title b{font-size:.9rem}.material-qty{padding:3px 7px;border-radius:999px;background:#EEF3F8;color:#30445F;font-size:.68rem;font-weight:800}.material-meta{display:flex;align-items:center;gap:5px;margin-top:4px;color:#566A85;font-size:.72rem}.material-meta .avatar{width:18px;height:18px}.material-meta em{font-style:normal;color:#A5B1C0}.material-main p{margin:5px 0 0;color:#6A7A90;font-size:.75rem}.material-state{display:flex;align-items:center;gap:8px}.material-actions{display:flex;gap:6px}.material-actions .btn{white-space:nowrap}@media(max-width:700px){.material-overview{grid-template-columns:1fr;padding:14px}.material-kpi{padding:4px 8px;gap:7px}.material-kpi-icon{width:30px;height:30px}.material-kpi small{font-size:.64rem}.material-donut{justify-self:center}.material-row{grid-template-columns:4px 32px minmax(0,1fr);gap:9px;margin:7px}.material-state{grid-column:3;justify-content:space-between;flex-wrap:wrap}.material-meta{flex-wrap:wrap}.material-actions{width:100%}.material-actions .btn{flex:1}.material-list>header{padding:13px}} /* Variante légèrement plus généreuse pour une lecture confortable sur chantier. */ .material-overview{grid-template-columns:minmax(0,1fr) 132px;gap:22px;margin-bottom:18px;padding:19px 22px}.material-kpi{gap:11px;padding:5px 18px}.material-kpi-icon{width:40px;height:40px;border-radius:10px}.material-kpi-icon .ic{width:20px;height:20px}.material-kpi b{font-size:1.2rem}.material-kpi small{margin-top:3px;font-size:.77rem}.material-donut{width:88px;height:88px}.material-donut:before{inset:11px}.material-donut b{font-size:1.15rem}.material-list{border-radius:15px}.material-list>header{padding:16px 20px}.material-list>header h2{font-size:1.08rem}.material-list>header span{font-size:.84rem}.material-row{grid-template-columns:5px 42px minmax(0,1fr) auto;gap:13px;margin:10px;padding:13px 14px 13px 0;border-radius:11px}.material-request-icon{width:38px;height:38px;border-radius:9px}.material-request-icon .ic{width:19px;height:19px}.material-title{gap:9px}.material-title b{font-size:.98rem}.material-qty{padding:3px 8px;font-size:.73rem}.material-meta{gap:6px;margin-top:5px;font-size:.78rem}.material-meta .avatar{width:20px;height:20px}.material-main p{margin-top:6px;font-size:.8rem}.material-state{gap:9px}.material-actions{gap:7px} /* Chantiers */ .page-title-with-icon{display:flex;align-items:center;gap:13px}.page-title-with-icon .ic{width:34px;height:34px;color:var(--bleu)}.page-title-with-icon h1{margin:0} .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(355px,1fr));gap:14px} .ch-card{display:grid;grid-template-columns:5px minmax(0,1fr) 62px;gap:12px;text-align:left;cursor:pointer;width:100%;border:1px solid var(--trait);background:var(--papier);border-radius:var(--r);padding:15px;min-height:154px;color:var(--encre)} .ch-card:hover{background:#FBFCFE;border-color:#8C98AE}.ch-card-accent{border-radius:99px;background:var(--project-color)}.ch-card-content{min-width:0;display:flex;flex-direction:column}.ch-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.ch-card-top b{display:block;font-size:1rem;line-height:1.2}.ch-card-top small{display:block;margin-top:4px;color:var(--ardoise);font-size:.82rem;font-weight:500}.ch-card-status{flex:none;border-radius:999px;background:var(--project-tint);color:var(--project-color);padding:4px 7px;font-size:.68rem;font-weight:800;white-space:nowrap}.ch-card-progress{display:block;height:8px;margin:13px 0 9px;border-radius:99px;background:#E3E8F0;overflow:hidden}.ch-card-progress i{display:block;height:100%;background:var(--project-color);border-radius:inherit}.ch-card-meta{display:flex;align-items:center;gap:5px;color:var(--ardoise);font-size:.72rem;line-height:1.3}.ch-card-meta .ic{width:14px;height:14px;flex:none}.ch-card-meta em{font-style:normal;margin:0 1px}.ch-card-money{display:flex;align-items:baseline;gap:5px;margin-top:auto;padding-top:10px;color:var(--encre)}.ch-card-money small{color:var(--ardoise);font-size:.72rem}.ch-card-money b{font-size:.86rem}.ch-card-ring{display:grid;place-items:center;align-self:center;width:58px;height:58px;border-radius:50%;background:conic-gradient(var(--project-color) var(--progress),#E5EAF2 0);position:relative}.ch-card-ring::before{content:"";position:absolute;inset:7px;border-radius:50%;background:#fff}.ch-card-ring b{position:relative;font-size:.78rem;white-space:nowrap} @media(max-width:440px){.cards{grid-template-columns:1fr}.ch-card{grid-template-columns:4px minmax(0,1fr) 52px;gap:9px;padding:12px}.ch-card-ring{width:50px;height:50px}.ch-card-ring::before{inset:6px}.ch-card-status{font-size:.62rem}.ch-card-meta{font-size:.65rem}.ch-card-money{display:none}} .kv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px} .kv div span{display:block;font-size:.85rem;color:var(--ardoise);font-weight:700} .kv div b{font-variant-numeric:tabular-nums} .note{padding:12px 0;border-top:1px solid var(--trait)} /* Tâches */ .tasks-page{width:100%}#main:has(.tasks-page){max-width:1640px}.tasks-page .kanban{padding:4px;border-radius:18px;background:linear-gradient(145deg,#F9FBFE,#E1E8F1)}.task-filters{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:18px}.task-filters .field{position:relative;margin:0;min-width:220px}.task-filters select{appearance:none;min-height:42px;width:100%;padding:0 38px 0 40px;border-radius:9px;font-weight:700;background:var(--papier);cursor:pointer}.task-filters .field::after{content:"⌄";position:absolute;right:13px;top:9px;color:var(--encre);font-size:1rem;pointer-events:none}.filter-icon{position:absolute;z-index:1;left:12px;top:11px;color:var(--ardoise);pointer-events:none}.filter-icon .ic{width:19px;height:19px}.task-filter-note{display:flex;align-items:center;gap:7px;min-height:42px;padding:0 12px;border:1px solid var(--trait);border-radius:9px;background:transparent;color:var(--ardoise);font-size:.84rem;font-weight:700}.task-filter-note .ic{width:18px;height:18px} #main:has(.material-head){max-width:1680px;margin:0;padding-left:32px;padding-right:32px} .kanban{display:grid;grid-template-columns:repeat(3,minmax(300px,1fr));gap:20px;align-items:start} .col{background:linear-gradient(145deg,#EAF0F6,#E1E8F1);border:1px solid #C9D4E3;border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:10px;min-height:260px;box-shadow:inset 1px 1px 2px rgba(255,255,255,.95),inset -2px -2px 5px rgba(111,128,153,.10),0 8px 18px rgba(29,50,82,.06)} .col.over{outline:3px dashed var(--bleu);outline-offset:-3px} .col > header{display:flex;justify-content:space-between;align-items:center;padding:2px 2px 4px}.col > header h2{font-size:1.12rem} .col > header .n{background:#E9EEF7;color:var(--encre);border-radius:99px;padding:4px 10px;font-size:.78rem;font-weight:800} .task{position:relative;background:var(--papier);border:1px solid #D5DEEA;border-radius:12px;padding:12px 12px 11px 16px;display:flex;flex-direction:column;gap:8px;cursor:grab;box-shadow:0 3px 6px rgba(22,42,73,.08),0 10px 18px rgba(22,42,73,.05);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.task:hover{transform:translateY(-3px);border-color:#B9C7D9;box-shadow:0 7px 12px rgba(22,42,73,.11),0 18px 28px rgba(22,42,73,.08)}.task:active{cursor:grabbing;transform:translateY(-1px)}.task::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;border-radius:12px 0 0 12px;background:var(--task-color)} .task-title{font-weight:800;font-size:1rem;line-height:1.3;text-align:left;background:none;border:0;padding:0;cursor:pointer;color:var(--encre)}.task-title:hover{text-decoration:underline;text-underline-offset:3px} .task-project{display:flex;align-items:center;gap:7px;align-self:flex-start;max-width:100%;border:1px solid #D8E0ED;border-radius:999px;padding:3px 8px;background:#F7F9FC;color:#31425F;font-size:.78rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.task-project .dot{width:8px;height:8px;flex:none} .task-bottom{display:flex;align-items:center;gap:7px;color:var(--ardoise);font-size:.81rem;min-width:0}.task-bottom .avatar{width:26px;height:26px;font-size:.64rem;flex:none}.task-bottom em{font-style:normal}.task-due{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.task-due.late{color:#B42323;font-weight:800}.task-complete{margin-left:auto;padding:5px 8px;min-height:30px;font-size:.76rem}.task-open{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--trait);border-radius:50%;background:var(--papier);color:var(--encre);cursor:pointer;flex:none}.task-open .ic{width:16px;height:16px}.task-menu{border:0;background:transparent;color:var(--ardoise);font-size:1.4rem;line-height:1;cursor:pointer;padding:1px 2px;flex:none} @media(max-width:760px){.task-filters .field{min-width:min(100%,260px)}.kanban{grid-template-columns:1fr}.col{min-height:150px}.task-bottom{font-size:.72rem}} .member-list{margin-top:22px}.member-filters{display:flex;align-items:center;gap:18px;margin:0 4px 28px}.member-search{display:flex;align-items:center;gap:10px;width:min(100%,485px);height:50px;padding:0 15px;border:1px solid #C9D4E3;border-radius:11px;background:var(--papier);color:var(--ardoise)}.member-search .ic{width:22px;height:22px;flex:none}.member-search input{width:100%;border:0;outline:0;background:transparent;color:var(--encre);font:inherit;font-size:.96rem}.member-role-filter{position:relative}.member-role-filter::after{content:"⌄";position:absolute;right:15px;top:12px;pointer-events:none;font-size:1.05rem}.member-role-filter select{appearance:none;min-width:200px;height:50px;padding:0 42px 0 16px;border:1px solid #C9D4E3;border-radius:11px;background:var(--papier);font:inherit;font-size:.94rem;color:var(--encre)}.member-count{margin-left:auto;color:var(--ardoise);font-size:.95rem}.member-table{overflow:hidden;border:1px solid #D2DBE8;border-radius:16px;background:var(--papier);box-shadow:0 8px 22px rgba(26,47,79,.045)}.member-table-head,.member-row{display:grid;grid-template-columns:2fr 1.1fr 1.35fr 1.75fr 1.05fr 22px;align-items:center;gap:22px}.member-table-head{min-height:60px;padding:0 40px;border-bottom:1px solid #DFE6F0;color:var(--ardoise);font-size:.75rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.member-row{width:100%;min-height:84px;padding:12px 40px;border:0;border-bottom:1px solid #E3E9F1;background:var(--papier);color:var(--encre);text-align:left;font:inherit;cursor:pointer;transition:background .18s ease}.member-row:last-child{border-bottom:0}.member-row:hover{background:#F8FAFD}.member-person{display:flex;align-items:center;gap:13px;min-width:0}.member-person .avatar{width:50px;height:50px;font-size:.98rem;box-shadow:inset 0 1px 2px rgba(255,255,255,.35)}.member-person b,.member-person small,.member-slot span,.member-slot small{display:block}.member-person b{font-size:.98rem}.member-person small,.member-slot small{margin-top:3px;color:var(--ardoise);font-size:.83rem}.member-role{justify-self:start;padding:7px 13px;border-radius:999px;background:#F0F2F6;color:#35445E;font-size:.83rem}.member-load{font-size:.93rem}.member-load em{font-style:normal;color:#B42323;font-weight:700}.member-slot{font-size:.9rem;line-height:1.25}.member-state{display:inline-flex;align-items:center;gap:10px;justify-self:start;padding:8px 14px;border-radius:999px;background:#FCF5E8;color:#473718;font-size:.84rem}.member-state i{width:9px;height:9px;border-radius:50%;background:#D99400}.member-state.late{background:#FDEBEC;color:#A51D25}.member-state.late i{background:#E11D2E}.member-chevron{color:var(--encre)}.member-chevron .ic{width:18px;height:18px}@media(max-width:900px){.member-table{overflow-x:auto}.member-table-head,.member-row{min-width:860px;padding-left:24px;padding-right:24px}.member-filters{flex-wrap:wrap;gap:10px}.member-count{margin-left:0}}@media(max-width:600px){.member-search{width:100%}.member-role-filter,.member-role-filter select{width:100%}.member-count{width:100%}} /* Fenêtres, messages */ .backdrop{position:fixed;inset:0;background:rgba(14,31,64,.6);display:flex;align-items:flex-start;justify-content:center;padding:32px 16px;overflow-y:auto;z-index:90} .modal{background:var(--papier);border-radius:14px;width:min(680px,100%);padding:24px;box-shadow:0 24px 60px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:18px} .modal.wide{width:min(860px,100%)} .modal > header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px} .modal footer{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap} .devis-start-modal{padding:0;overflow:hidden;border-top:6px solid #D99E12;width:min(980px,100%);gap:0} .devis-start-head{padding:26px 30px 24px;border-bottom:1px solid var(--trait);align-items:flex-start!important} .devis-start-title{display:flex;align-items:center;gap:16px} .devis-start-title h2{font-size:1.8rem;letter-spacing:-.025em;margin:0} .devis-start-title p{color:var(--ardoise);margin:3px 0 0;font-size:1.02rem} .devis-start-icon,.devis-summary-icon{display:grid;place-items:center;color:#C98700;background:#FFF2CF;border-radius:14px} .devis-start-icon{width:58px;height:58px}.devis-start-icon .ic{width:30px;height:30px} .devis-start-body{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(270px,.82fr);gap:32px;padding:30px} .devis-start-form{padding-right:32px;border-right:1px solid var(--trait)} .devis-start-form h3,.devis-summary h3{font-size:1.25rem;margin:0 0 24px;letter-spacing:-.015em} .devis-client-select{display:flex;align-items:center;gap:12px;border:1px solid var(--client-color,#8090AC);border-radius:10px;padding:7px 12px;background:#fff} .devis-client-select select{border:0;background:transparent;width:100%;min-height:40px;padding:0;font-weight:700;color:var(--encre);outline:0} .devis-client-avatar{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:999px;background:var(--client-tint,#E8EDF7);color:var(--client-color,var(--bleu));font-weight:800;font-size:.85rem} .devis-new-client{display:flex;align-items:center;gap:7px;margin:12px 0 34px;color:var(--bleu);font-weight:700;text-decoration:underline;text-underline-offset:3px}.devis-new-client .ic{width:18px;height:18px} .devis-object{margin-top:0}.devis-object input{min-height:56px;font-size:1rem} .devis-summary{align-self:start;border-radius:20px;padding:28px 32px;background:linear-gradient(145deg,var(--client-tint,#FFFDF8),#FFFDF8)} .devis-summary-title{display:flex;align-items:center;gap:14px}.devis-summary-title h3{margin:0}.devis-summary-icon{width:42px;height:42px;border-radius:10px;background:var(--client-tint,#FFF2CF);color:var(--client-color,#C98700)}.devis-summary-icon .ic{width:23px;height:23px} .devis-summary dl{margin:26px 0 0}.devis-summary dl div{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid #E7DDCB}.devis-summary dt{color:#42536F}.devis-summary dd{margin:0;font-weight:700;text-align:right}.badge.draft{background:#F9E7B2;color:#755315} .devis-summary p{color:#73809A;font-style:italic;line-height:1.45;margin:24px 0 4px;font-size:.92rem} .devis-start-modal footer{padding:22px 30px;border-top:1px solid var(--trait);background:#fff} @media(max-width:700px){.backdrop{padding:12px}.devis-start-head{padding:20px}.devis-start-title{gap:12px}.devis-start-icon{width:48px;height:48px}.devis-start-icon .ic{width:25px;height:25px}.devis-start-title h2{font-size:1.45rem}.devis-start-title p{font-size:.9rem}.devis-start-body{grid-template-columns:1fr;padding:20px;gap:20px}.devis-start-form{border:0;padding:0}.devis-summary{padding:22px}.devis-start-modal footer{padding:16px 20px}.devis-start-modal footer .btn{flex:1}} .quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .quick button{display:flex;gap:12px;align-items:center;text-align:left;min-height:64px;padding:12px 14px;border:1px solid var(--trait);border-radius:var(--r);background:var(--papier);cursor:pointer;font-weight:700} .quick button:hover{background:var(--bleu-clair);border-color:var(--bleu)} .quick button small{display:block;font-weight:400;color:var(--ardoise)} .results{display:flex;flex-direction:column;margin-top:4px;max-height:52vh;overflow-y:auto} .results button{display:flex;gap:12px;align-items:center;text-align:left;padding:11px 8px;min-height:48px;border:0;border-top:1px solid var(--trait);background:transparent;cursor:pointer;width:100%} .results button:hover{background:var(--bleu-clair)} .results .kind{font-size:.8rem;font-weight:700;color:var(--ardoise);width:74px;flex:none} #toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--nuit);color:#fff;padding:12px 18px;border-radius:var(--r);box-shadow:0 8px 24px rgba(0,0,0,.3);z-index:120;max-width:min(560px,92vw);opacity:0;pointer-events:none;transition:opacity .2s;font-weight:700} #toast.show{opacity:1} .bottomnav{display:none} /* ---------- Site de présentation ---------- */ .site-header{position:sticky;top:0;z-index:60;background:var(--nuit);color:#fff} .site-header .in{max-width:1180px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:22px} .site-header .brand{padding:0;color:#fff} .site-nav{display:flex;gap:6px;margin-left:12px} .site-nav button{background:none;border:0;color:#DCE5F5;font-weight:700;padding:10px 12px;min-height:44px;border-radius:8px;cursor:pointer} .site-nav button:hover{background:rgba(255,255,255,.1);color:#fff} .site-header .right{margin-left:auto;display:flex;gap:10px;align-items:center} .hero{background:var(--nuit);color:#fff;position:relative;overflow:hidden; background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:32px 32px} .hero .in{max-width:1180px;margin:0 auto;padding:72px 24px 80px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:center} .hero h1{font-size:clamp(2.2rem,4.6vw,3.7rem);font-weight:800;letter-spacing:-.025em;line-height:1.05} .hero .lead{font-size:1.18rem;color:#D3DDF0;margin-top:20px;max-width:34em} .hero .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px} .hero .fine{margin-top:14px;color:#B9C7E0;font-size:.95rem} .demo{background:var(--papier);color:var(--encre);border-radius:14px;padding:22px;box-shadow:0 30px 60px rgba(0,0,0,.35)} .demo h2{font-size:1.05rem;color:var(--ardoise);font-weight:700;margin-bottom:14px} .tape{position:relative;margin:6px 0 4px;padding-bottom:6px} .tape-band{height:46px;border-radius:4px;background-color:var(--metre); background-image:linear-gradient(90deg,var(--encre) 1.5px,transparent 1.5px),linear-gradient(90deg,var(--encre) 2px,transparent 2px); background-size:12px 14px,60px 26px;background-repeat:repeat-x;background-position:0 100%,0 100%} .tape-steps{display:grid;grid-template-columns:repeat(5,1fr);margin-top:-46px;position:relative} .tape-steps button{display:flex;flex-direction:column;align-items:center;gap:0;background:none;border:0;cursor:pointer;padding:0;min-height:44px;color:var(--encre)} .tape-steps .pin{width:26px;height:26px;border-radius:50%;background:var(--papier);border:3px solid var(--encre);margin-top:-6px;display:grid;place-items:center;font-weight:800;font-size:.8rem;font-family:var(--titre)} .tape-steps button[aria-selected="true"] .pin{background:var(--nuit);color:#fff} .tape-steps .lab{margin-top:26px;font-size:.88rem;font-weight:700;color:var(--ardoise)} .tape-steps button[aria-selected="true"] .lab{color:var(--encre)} .demo-card{margin-top:14px;border:1px solid var(--trait);border-radius:var(--r);padding:16px;background:var(--craie);min-height:158px} .demo-card b.big{font-family:var(--titre);font-size:1.15rem;display:block;margin-bottom:6px} .demo-card .after{margin-top:12px;font-size:.92rem;color:var(--ardoise);display:flex;gap:8px;align-items:flex-start} .section{padding:84px 24px} .section .in{max-width:1180px;margin:0 auto} .section.alt{background:var(--papier)} .section h2.big{font-size:clamp(1.7rem,3vw,2.4rem);font-weight:750;max-width:20em} .section .intro{color:var(--ardoise);font-size:1.1rem;max-width:40em;margin-top:12px} .feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:56px;align-items:center;padding:44px 0;border-top:1px solid var(--trait)} .feature:first-of-type{border-top:0} .feature.flip .txt{order:2} .feature h3{font-size:1.6rem;font-weight:700} .feature p{color:var(--ardoise);margin-top:12px;font-size:1.05rem;max-width:30em} .mock{background:var(--papier);border:1px solid var(--trait);border-radius:12px;padding:18px;box-shadow:0 14px 34px rgba(14,31,64,.08)} .section.alt .mock{background:var(--craie)} .mock .row-l{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--trait);font-size:.95rem} .mock .row-l:first-child{border-top:0} .trades{display:flex;flex-wrap:wrap;gap:10px 12px;margin-top:26px} .trade-chip{display:inline-flex;align-items:center;gap:8px;padding:9px 16px 9px 13px;border:1px solid var(--trait);border-radius:999px;background:var(--papier);font:inherit;font-weight:700;color:var(--encre);cursor:pointer;transition:background .15s,border-color .15s,color .15s} .trade-chip .ic{width:18px;height:18px;color:var(--bleu);flex:0 0 auto} .trade-chip:hover{border-color:var(--bleu)} .trade-chip[aria-pressed="true"]{background:var(--bleu);border-color:var(--bleu);color:#fff} .trade-chip[aria-pressed="true"] .ic{color:#fff} /* Comparatif Avant / Après */ .ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:30px} .ba-card{border:1px solid var(--trait);border-radius:16px;padding:22px 24px;background:var(--papier)} .ba-card h3{display:flex;align-items:center;gap:10px;font-size:1.2rem;margin-bottom:14px} .ba-card h3 .ic{width:22px;height:22px} .ba-card ul{list-style:none;display:flex;flex-direction:column;gap:12px} .ba-card li{position:relative;padding-left:22px;line-height:1.4} .ba-card li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%} .ba-before{background:#F1F4F9} .ba-before h3,.ba-before h3 .ic,.ba-before li{color:var(--ardoise)} .ba-before li::before{background:#B9C2D0} .ba-after{border-color:var(--bleu);box-shadow:0 10px 30px rgba(29,78,216,.08)} .ba-after h3 .ic{color:#16A34A} .ba-after li::before{background:#16A34A} @media(max-width:700px){.ba-grid{grid-template-columns:1fr}} /* Mini-simulateur de devis */ .sim-card{margin-top:30px;background:var(--papier);border:1px solid var(--trait);border-radius:18px;padding:6px 22px 22px;max-width:660px;box-shadow:0 14px 40px rgba(16,27,46,.08)} .sim-row{display:flex;align-items:center;gap:14px;padding:16px 0;border-bottom:1px solid var(--trait)} .sim-row.off{opacity:.55} .sim-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px} .sim-qty{display:inline-flex;align-items:center;border:1px solid var(--trait);border-radius:999px;overflow:hidden} .sim-qty button{width:34px;height:34px;border:0;background:var(--papier);font-size:1.2rem;font-weight:700;color:var(--bleu);cursor:pointer;line-height:1} .sim-qty button:hover{background:var(--bleu-clair)} .sim-qty span{min-width:66px;text-align:center;font-weight:700;font-size:.9rem} .sim-incl{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--trait);background:var(--papier);border-radius:999px;padding:7px 14px;font:inherit;font-weight:700;color:var(--bleu);cursor:pointer} .sim-incl .ic{width:16px;height:16px} .sim-incl.on{background:var(--bleu);border-color:var(--bleu);color:#fff} .sim-line{min-width:110px;text-align:right;font-weight:700} .sim-tot{margin-top:16px;display:flex;flex-direction:column;gap:8px;margin-bottom:18px} .sim-tot > div{display:flex;justify-content:space-between;align-items:baseline;color:var(--ardoise)} .sim-tot > div.big{font-size:1.1rem;color:var(--encre);padding-top:10px;border-top:1px solid var(--trait)} .sim-tot > div.big b{font-size:1.5rem} .sim-tot .acompte b{color:var(--bleu)} @media(max-width:560px){.sim-card{padding:4px 16px 18px}.sim-row{flex-wrap:wrap;row-gap:10px}.sim-info{flex:1 1 100%}.sim-line{min-width:0;margin-left:auto}} /* Témoignages */ .testi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:30px} .testi{position:relative;margin:0;background:var(--papier);border:1px solid var(--trait);border-radius:16px;padding:22px 24px;display:flex;flex-direction:column;gap:16px} .testi-del{position:absolute;top:10px;right:10px;width:28px;height:28px;border-radius:50%;border:1px solid var(--trait);background:var(--papier);color:var(--bad,#b91c1c);font-size:14px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0} .testi-del:hover{background:var(--bad,#b91c1c);color:#fff;border-color:var(--bad,#b91c1c)} .testi blockquote{margin:0;font-size:1.05rem;line-height:1.5} .testi figcaption{display:flex;align-items:center;gap:12px} .testi-av{width:42px;height:42px;border-radius:50%;background:var(--bleu);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;flex:0 0 auto} .testi figcaption > span{display:flex;flex-direction:column} /* Bandeau cookies (RGPD) */ #cookie-bar{position:fixed;left:16px;right:16px;bottom:16px;z-index:70;max-width:720px;margin:0 auto;display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--nuit);color:#E8EEF9;padding:14px 18px;border-radius:14px;box-shadow:0 14px 40px rgba(8,16,34,.35);font-size:.92rem} #cookie-bar span{flex:1;min-width:200px} #cookie-bar a{color:var(--metre)} #cookie-bar .cookie-actions{flex:0 0 auto;min-width:0;display:flex;gap:8px} .pilot{background:var(--nuit);color:#fff;border-radius:16px;padding:44px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:center} .pilot h2{font-size:clamp(1.6rem,2.8vw,2.2rem);font-weight:750} .pilot p{color:#D3DDF0;margin-top:12px} .pilot .field label{color:#D3DDF0} .plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:34px;align-items:stretch} .plan{border:1px solid var(--trait);border-radius:14px;padding:26px;background:var(--papier);display:flex;flex-direction:column;gap:14px} .plan.best{background:var(--nuit);color:#fff;border-color:var(--nuit)} .plan .price{font-family:var(--titre);font-size:2.4rem;font-weight:800;letter-spacing:-.02em} .plan .price small{font-size:1rem;font-weight:500;font-family:var(--texte)} .plan ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;flex:1} .plan li{display:flex;gap:10px;align-items:flex-start} .plan li .ic{color:var(--bleu);margin-top:3px} .plan.best li .ic{color:var(--metre)} .plan.best .muted{color:#C3D0E8} .faq{margin-top:30px;border-top:1px solid var(--trait)} .faq details{border-bottom:1px solid var(--trait);padding:6px 0} .faq summary{cursor:pointer;font-weight:700;font-size:1.08rem;padding:14px 4px;min-height:48px;display:flex;align-items:center} .faq details p{padding:0 4px 16px;color:var(--ardoise);max-width:46em} .site-foot{background:var(--nuit);color:#C3D0E8;padding:44px 24px} .site-foot .in{max-width:1180px;margin:0 auto;display:flex;gap:24px;justify-content:space-between;flex-wrap:wrap;align-items:center} .site-foot a,.site-foot button{color:#fff} /* Inscription */ .signup{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:100vh} .signup .side{background:var(--nuit);color:#fff;padding:48px;display:flex;flex-direction:column;gap:30px;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:32px 32px} .signup .side h1{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800} .signup .side ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px} .signup .side li{display:flex;gap:12px;align-items:flex-start;color:#D3DDF0} .signup .side li .ic{color:var(--metre);margin-top:3px} .signup .form{padding:48px;display:flex;align-items:center;justify-content:center} .signup form{width:min(520px,100%);display:flex;flex-direction:column;gap:18px} .radio{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid #8C98AE;border-radius:var(--r);cursor:pointer;background:var(--papier)} .radio:has(input:checked){border-color:var(--bleu);background:var(--bleu-clair);box-shadow:inset 0 0 0 1px var(--bleu)} .radio input{margin-top:5px;width:18px;height:18px;accent-color:var(--bleu)} /* ---------- Écrans étroits ---------- */ @media (max-width:1100px){ .grid-kpi{grid-template-columns:repeat(2,minmax(0,1fr))} .kpi:nth-child(2){border-right:0} .kpi:nth-child(-n+2){border-bottom:1px solid var(--trait)} .grid-2{grid-template-columns:minmax(0,1fr)} .editor{grid-template-columns:minmax(0,1fr)} .summary{position:static} } @media (max-width:900px){ .app{grid-template-columns:minmax(0,1fr)} .sidebar{display:none} .topbar{padding:10px 16px} .topbar .brand{display:flex;padding:0} .topbar .brand span{display:none} .search-btn{max-width:none} .search-btn kbd{display:none} .demo-pill{display:none} #main{padding:20px 16px 100px} .bottomnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;background:var(--nuit);z-index:60;padding-bottom:env(safe-area-inset-bottom)} .bottomnav a{display:flex;flex-direction:column;align-items:center;gap:2px;justify-content:center;min-height:62px;padding:6px 2px;font-size:.74rem;font-weight:700;color:#C3D0E8;text-decoration:none;position:relative} .bottomnav a[aria-current="page"]{color:#fff;box-shadow:inset 0 3px 0 var(--metre)} .bottomnav .count{position:absolute;top:5px;right:calc(50% - 24px);background:var(--metre);color:var(--encre);border-radius:99px;font-size:.68rem;padding:0 6px;font-weight:800} #toast{bottom:84px} .kanban{grid-template-columns:1fr} .line.head{display:none} .line{grid-template-columns:1fr 1fr 1fr;padding:12px;border:1px solid var(--trait);border-radius:var(--r)} .line .f-label{grid-column:1/-1} .line .tot{grid-column:1/3;text-align:left} .line .rm{justify-self:end} .line .field{gap:2px} .mlabel{display:block} .plan-wide,.planning-surface{display:none} .plan-days{display:flex;flex-direction:column;gap:12px} .planning-toolbar{align-items:flex-start;flex-direction:column;padding:16px}.planning-toolbar h2{font-size:1.12rem} .form-grid{grid-template-columns:1fr} .kv{grid-template-columns:1fr 1fr} .quick{grid-template-columns:1fr} table.resp thead{display:none} table.resp,table.resp tbody,table.resp tr,table.resp td{display:block;width:100%} table.resp tr{padding:12px 14px;border-bottom:1px solid var(--trait)} table.resp td{border:0;padding:3px 0;text-align:left !important} table.resp td[data-label]::before{content:attr(data-label) " : ";color:var(--ardoise);font-weight:700;font-size:.85rem} .site-nav{display:none} .site-header .in{padding:10px 16px} .hero .in{grid-template-columns:minmax(0,1fr);gap:36px;padding:44px 16px 52px} .section{padding:56px 16px} .feature,.feature.flip{grid-template-columns:minmax(0,1fr);gap:24px;padding:32px 0} .feature.flip .txt{order:0} .pilot{grid-template-columns:minmax(0,1fr);padding:26px;gap:26px} .plans{grid-template-columns:minmax(0,1fr)} .signup{grid-template-columns:minmax(0,1fr)} .signup .side{padding:28px 20px} .signup .form{padding:28px 16px 48px} } @media (max-width:480px){ h1{font-size:1.55rem} .kpi{padding:14px} .kpi .value{font-size:1.4rem} .demo{padding:16px} .tape-steps .lab{font-size:.74rem} } @media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}} @media print{.sidebar,.bottomnav,.topbar,#toast{display:none}} /* Compléments */ .mchip{border:1px solid var(--trait);border-left:4px solid var(--c);border-radius:6px;padding:4px 6px;font-size:.78rem;background:var(--papier);line-height:1.2;min-height:30px;display:flex;align-items:center} .mchip.empty{background:transparent;border-style:dashed;border-left-width:1px} .plan.best .btn.primary{width:100%} .plan .btn{width:100%} button.member{cursor:pointer;width:100%;text-align:left;font:inherit;color:inherit} button.member:hover{background:var(--bleu-clair);border-color:var(--bleu)} button.member > .ic{color:var(--ardoise)} /* ===== Questions fréquentes : cartes numérotées, réponse qui glisse ===== */ .faq-wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start} .faq-side{position:sticky;top:96px} .faq-side .intro{margin:14px 0 22px} .faq-wrap .faq{margin-top:0;border-top:0;display:flex;flex-direction:column;gap:12px} .faq-item{background:var(--papier);border:1px solid var(--trait);border-radius:16px;transition:border-color .25s,box-shadow .3s,transform .25s} .faq-item:hover{border-color:var(--bleu);transform:translateY(-1px)} .faq-item.open{border-color:var(--metre);box-shadow:0 12px 30px rgba(14,31,64,.11)} .faq-item h3{margin:0;font:inherit} .faq-q{width:100%;display:flex;align-items:center;gap:14px;padding:16px 18px;background:none;border:0;border-radius:16px;cursor:pointer;text-align:left;font:inherit;font-weight:700;font-size:1.04rem;line-height:1.35;color:var(--encre);min-height:60px} .faq-q:focus-visible{outline:3px solid var(--metre);outline-offset:2px} .faq-n{flex:none;min-width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--bleu-clair);color:var(--bleu);font-family:var(--titre);font-size:.9rem;transition:background .25s,color .25s} .faq-item.open .faq-n{background:var(--metre);color:var(--nuit)} .faq-t{flex:1} .faq-i{flex:none;position:relative;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--trait);transition:transform .4s cubic-bezier(.2,.8,.2,1),background .25s,border-color .25s} .faq-i::before,.faq-i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;border-radius:2px;background:var(--bleu);transform:translate(-50%,-50%);transition:transform .4s cubic-bezier(.2,.8,.2,1),background .25s} .faq-i::after{transform:translate(-50%,-50%) rotate(90deg)} .faq-item.open .faq-i{transform:rotate(180deg);background:var(--nuit);border-color:var(--nuit)} .faq-item.open .faq-i::before,.faq-item.open .faq-i::after{background:#fff} .faq-item.open .faq-i::after{transform:translate(-50%,-50%) rotate(0deg)} .faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.2,.8,.2,1)} .faq-item.open .faq-a{grid-template-rows:1fr} .faq-in{overflow:hidden;min-height:0} .faq-in p{margin:0;padding:0 20px 20px 70px;max-width:46em;color:var(--ardoise);opacity:0;transform:translateY(-8px);transition:opacity .35s .08s,transform .4s .08s} .faq-item.open .faq-in p{opacity:1;transform:none} @media (max-width:860px){.faq-wrap{grid-template-columns:1fr;gap:26px}.faq-side{position:static}.faq-in p{padding-left:20px}} @media (prefers-reduced-motion:reduce){.faq-item,.faq-a,.faq-in p,.faq-i,.faq-i::before,.faq-i::after,.faq-n{transition:none}} /* ===== Création d'espace : étapes, cartes d'offre, bloc de paiement ===== */ .su-sec{display:flex;align-items:center;gap:10px;margin:26px 0 2px;font:700 1.02rem var(--titre);color:var(--nuit)} .su-n{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--nuit);color:#fff;font-size:.8rem} .plan-pick{border:0;padding:0;margin:8px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .plan-opt{position:relative;display:block;cursor:pointer} .plan-opt input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer} .po-body{display:flex;flex-direction:column;gap:4px;height:100%;padding:14px;border:1.5px solid var(--trait);border-radius:14px;background:var(--papier);transition:border-color .2s,box-shadow .2s,transform .2s,background .2s} .plan-opt:hover .po-body{border-color:var(--bleu);transform:translateY(-2px)} .plan-opt input:checked + .po-body{border-color:var(--metre);background:#FFFBEA;box-shadow:0 0 0 3px rgba(255,194,14,.35)} .plan-opt input:focus-visible + .po-body{outline:3px solid var(--bleu);outline-offset:2px} .po-price{font:700 1.3rem var(--titre);color:var(--nuit)} .po-price small{display:block;margin-top:1px;font:600 .72rem system-ui,sans-serif;color:var(--ardoise)} .po-who{font-size:.82rem;color:var(--ardoise)} .po-plus{display:flex;align-items:center;gap:5px;color:var(--ok);font-weight:700} .po-plus svg{width:14px;height:14px} @media (max-width:640px){.plan-pick{grid-template-columns:1fr}} .pay-box{margin-top:10px;padding:18px;border:1.5px solid var(--trait);border-radius:16px;background:linear-gradient(180deg,#F5F8FD,#fff)} .pay-box header{display:flex;align-items:center;gap:12px;flex-wrap:wrap} .pay-box h3{margin:0;font:700 1.05rem var(--titre)} .pay-box p{margin:0} .pay-ico{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--nuit);color:var(--metre)} .pay-ico svg{width:20px;height:20px} .pay-badge{margin-left:auto;padding:5px 11px;border-radius:999px;font-size:.75rem;font-weight:700} .pay-badge.on{background:var(--info-bg);color:var(--info)} .pay-badge.soon{background:var(--warn-bg);color:var(--warn)} .pay-steps{counter-reset:pay;list-style:none;margin:16px 0 0;padding:0;display:grid;gap:12px} .pay-steps li{counter-increment:pay;position:relative;display:flex;flex-direction:column;gap:2px;padding-left:38px} .pay-steps li::before{content:counter(pay);position:absolute;left:0;top:1px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--bleu-clair);color:var(--bleu);font-weight:700;font-size:.82rem} .pay-steps li span{font-size:.88rem;color:var(--ardoise)} .pay-note{margin-top:14px !important;padding:10px 12px;border-radius:10px;background:var(--craie);font-size:.88rem;color:var(--ardoise)} /* ===== Sélecteur de langue des pages connexion / création d'espace : dans le coin haut droit de la zone blanche ===== */ .signup .form{position:relative} .signup .form > .lang-top{position:absolute;top:22px;right:28px;margin:0;z-index:5} .signup .form > .lang-top .lang-wrap{margin:0;gap:4px;padding:0 6px 0 10px;border-color:var(--trait);background:var(--papier);box-shadow:0 1px 3px rgba(14,31,64,.07);transition:border-color .2s,box-shadow .2s} .signup .form > .lang-top .lang-wrap:hover{border-color:var(--bleu);box-shadow:0 2px 8px rgba(14,31,64,.12)} .signup .form > .lang-top .lang-wrap svg{width:16px;height:16px;color:var(--ardoise)} .signup .form > .lang-top .lang-select{min-height:34px;font-size:.88rem;color:var(--encre)} @media (max-width:860px){.signup .form{padding-top:72px}.signup .form > .lang-top{top:16px;right:16px}} /* ===== Barre du haut sur téléphone : la recherche devient une icône, la langue garde sa place ===== */ .topbar .lang-wrap{flex:none} @media (max-width:560px){ .search-btn{flex:0 0 44px;min-width:44px;padding:0;justify-content:center} .search-btn span{display:none} .topbar{gap:8px} } /* Téléphones étroits : « Nouveau » devient un bouton « + » carré (le texte reste lu par les lecteurs d'écran), pour que la barre tienne sur la largeur sans faire glisser la page sur le côté (avec la cloche de notifications). */ @media (max-width:480px){ .topbar{gap:6px;padding:10px 12px} #btn-new{font-size:0;gap:0;flex:0 0 44px;width:44px;min-width:44px;min-height:44px;padding:0;justify-content:center} #btn-new .ic{width:22px;height:22px} } /* ===== Écrans tactiles : cibles de 44 px au moins (recommandation WCAG 2.2 / Apple / Google) ===== */ @media (pointer:coarse),(max-width:560px){ .btn.sm,.chipbtn,.icon-btn,.pw-toggle,.lang-select,.search-btn{min-height:44px} .icon-btn,.pw-toggle{min-width:44px} .link-btn,button.tt,.brand{min-height:44px;display:inline-flex;align-items:center} .site-footer a,footer a{display:inline-block;padding:13px 6px} .tabs button,[role=tab]{min-height:44px} .faq-q{min-height:56px} } .col > header h2{font-size:1.05rem} /* ===== Matériel : suivi de demandes ===== */ .material-head{margin-bottom:18px}.material-kpi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px}.material-kpi-grid article{display:flex;align-items:center;gap:14px;min-height:92px;padding:16px 19px;border:1px solid #E1E7ED;border-radius:16px;background:#fff;box-shadow:0 4px 16px rgba(24,43,67,.04)}.material-kpi-grid .material-kpi-icon{width:38px;height:38px;flex:none}.material-kpi-icon.violet{background:#F0EBFF;color:#7554D5}.material-kpi-grid small,.material-kpi-grid b,.material-kpi-grid em{display:block}.material-kpi-grid small{font-size:.76rem;font-weight:700;color:#4C5662}.material-kpi-grid b{margin:2px 0;font:700 1.38rem var(--titre);color:var(--encre)}.material-kpi-grid em{font-size:.73rem;font-style:normal;color:#75808D}.material-suppliers{display:grid;grid-template-columns:280px 1fr;align-items:center;gap:18px;margin-bottom:14px;padding:13px 16px;border:1px solid #E1E7ED;border-radius:16px;background:#fff}.material-suppliers>div{display:flex;align-items:center;gap:10px}.supplier-pin{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#E7F6ED;color:#26834E;font-size:20px}.material-suppliers b,.material-suppliers small{display:block}.material-suppliers b{font-size:.87rem}.material-suppliers small{margin-top:3px;font-size:.7rem;color:#707B88}.material-suppliers nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.material-supplier{display:flex;align-items:center;gap:10px;min-width:0;padding:9px 11px;border:1px solid #E7EAF0;border-radius:11px;text-decoration:none;color:var(--encre);transition:transform .15s,box-shadow .15s}.material-supplier:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(24,43,67,.09)}.supplier-logo{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:8px;font-size:.78rem;font-weight:900}.supplier-logo.blue{background:#E6EEFF;color:#2869CC}.supplier-logo.orange{background:#FFF0DD;color:#C87B11}.supplier-logo.navy{background:#E8EDF4;color:#20395F}.material-supplier>span:nth-child(2){min-width:0;flex:1}.material-supplier b,.material-supplier small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.supplier-go{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#F6F6F4}.supplier-go svg{width:14px;height:14px}.material-workspace{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:14px}.material-requests,.material-detail,.material-analytics article{border:1px solid #E1E7ED;border-radius:17px;background:#fff;box-shadow:0 5px 18px rgba(24,43,67,.04)}.material-requests{overflow:hidden}.material-requests>header{display:flex;align-items:center;gap:8px;padding:18px 18px 12px}.material-requests h2,.material-analytics h2{margin:0;font-size:1rem}.material-requests>header span{display:grid;place-items:center;min-width:21px;height:21px;padding:0 6px;border-radius:999px;background:#EFF0ED;color:#68717C;font-size:.7rem;font-weight:800}.material-search{display:flex;align-items:center;gap:9px;margin:0 18px;padding:0 12px;height:40px;border-radius:10px;background:#F6F6F3;color:#76808D}.material-search .ic{width:16px;height:16px}.material-search input{min-width:0;width:100%;border:0;background:transparent;outline:0;font:inherit;font-size:.78rem;color:var(--encre)}.material-filter-tabs{display:flex;gap:7px;padding:10px 18px}.material-filter-tabs button{padding:6px 10px;border:1px solid #E0E4E9;border-radius:999px;background:#fff;color:#5A6570;font-size:.71rem}.material-filter-tabs button b{display:inline-grid;place-items:center;min-width:16px;height:16px;margin-left:3px;border-radius:50%;background:#EEF0F2;font-size:.62rem}.material-filter-tabs button.active{border-color:#285843;background:#285843;color:#fff}.material-filter-tabs button.active b{background:rgba(255,255,255,.2);color:#fff}.material-rows{padding:0 10px}.material-row{display:grid;grid-template-columns:4px 37px minmax(150px,1fr) minmax(100px,.65fr) auto 23px;align-items:center;gap:10px;width:100%;min-height:65px;margin:0;border:0;border-top:1px solid #EEF0F2;border-radius:0;background:#fff;text-align:left;color:var(--encre);cursor:pointer}.material-row:hover,.material-row.selected{background:#F2F7F3}.material-row.selected{box-shadow:inset 3px 0 0 #285843}.material-row .material-accent{display:none}.material-row .material-request-icon{width:34px;height:34px;background:#EDF3FF;color:#367CE8}.material-row .material-main{display:block;min-width:0}.material-main>b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.83rem}.material-main>span{display:flex;align-items:center;gap:5px;margin-top:4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#697584;font-size:.69rem}.material-main>span i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--c);flex:none}.material-main em{font-style:normal;color:#A3ABB3}.material-person{display:flex;align-items:center;gap:6px;min-width:0;color:#64707E}.material-person .avatar{width:22px;height:22px}.material-person small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.7rem}.material-row .badge{font-size:.67rem;white-space:nowrap}.material-open svg{width:15px;height:15px}.material-requests footer{padding:12px 18px;color:#6C7580;font-size:.71rem}.material-detail{position:relative;padding:22px}.material-detail-close{position:absolute;right:14px;top:14px;display:grid;place-items:center;width:26px;height:26px;border:0;border-radius:8px;background:transparent;color:#6D7783}.material-detail-close:hover{background:#F0F2F4}.material-detail-close svg{width:17px}.detail-kicker{font-size:.62rem;letter-spacing:.08em;color:#69747E;font-weight:800}.detail-title{display:flex;gap:10px;align-items:center;margin:15px 0}.detail-title .material-request-icon{width:42px;height:42px;background:#EDF3FF;color:#367CE8}.detail-title .badge{font-size:.65rem}.detail-title h2{margin:6px 0 0;font-size:1rem}.material-detail dl{margin:0;border-top:1px solid #E7E9ED}.material-detail dl>div{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;border-bottom:1px solid #E7E9ED}.material-detail dt{display:flex;align-items:center;gap:8px;color:#6B7580;font-size:.72rem}.material-detail dt svg{width:15px;height:15px}.material-detail dd{display:flex;align-items:center;gap:6px;margin:0;text-align:right;font-size:.73rem;font-weight:700}.material-detail dd .avatar{width:22px;height:22px}.detail-note{padding:10px;border-radius:9px;background:#F7F7F5;color:#5E6875;font-size:.75rem}.material-timeline{display:grid;gap:9px;margin-top:14px;padding:12px;border-radius:10px;background:#F7F7F5}.material-timeline small{font-size:.62rem;font-weight:800;color:#6C7681;letter-spacing:.08em}.material-timeline b{font-size:.74rem;color:#347457}.detail-actions{display:flex;gap:8px;margin-top:14px}.material-detail-empty{display:grid;place-items:center;min-height:250px;text-align:center;color:#74808C;font-size:.84rem}.material-analytics{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.material-analytics article{padding:18px}.material-chart-wrap{display:flex;align-items:center;gap:22px;margin-top:14px}.material-chart{display:grid;place-items:center;flex:none;width:105px;height:105px;border-radius:50%;background:var(--chart);position:relative}.material-chart:before{content:"";position:absolute;inset:20px;border-radius:50%;background:#fff}.material-chart span{position:relative;z-index:1;text-align:center}.material-chart b,.material-chart small{display:block}.material-chart b{font:700 1.25rem var(--titre)}.material-chart small{font-size:.61rem;color:#6D7781}.material-chart-legend{flex:1;min-width:0}.material-chart-legend div{display:grid;grid-template-columns:10px minmax(0,1fr) 22px 34px;align-items:center;gap:7px;min-height:28px;border-bottom:1px solid #EEF0F2;font-size:.71rem}.material-chart-legend i{width:8px;height:8px;border-radius:50%;background:var(--c)}.material-chart-legend span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.material-chart-legend b{text-align:right}.material-chart-legend small{text-align:right;color:#75808B} @media(max-width:980px){.material-workspace{grid-template-columns:1fr}.material-detail{display:none}.material-kpi-grid{gap:10px}.material-suppliers{grid-template-columns:1fr}.material-row{grid-template-columns:4px 37px minmax(0,1fr) auto 23px}.material-person{display:none}} @media(max-width:680px){.material-kpi-grid{grid-template-columns:1fr}.material-kpi-grid article{min-height:70px}.material-suppliers nav{grid-template-columns:1fr}.material-supplier:nth-child(n+3){display:none}.material-filter-tabs{overflow:auto;padding-bottom:12px}.material-filter-tabs button{white-space:nowrap}.material-row{grid-template-columns:4px 34px minmax(0,1fr) auto;gap:8px}.material-row .badge{display:none}.material-open{display:none}.material-main>b{font-size:.8rem}.material-analytics{grid-template-columns:1fr}.material-chart-wrap{gap:15px}.material-chart{width:92px;height:92px}.material-chart:before{inset:18px}} @media (pointer:coarse),(max-width:560px){.lang-wrap{min-height:44px}.lang-wrap .lang-select,.signup .form > .lang-top .lang-select{min-height:44px}.signup .form > .lang-top .lang-wrap{min-height:44px}} /* ---- Notifications ---- */ .notif-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px} .notif-filters button{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--trait);background:var(--papier);color:var(--encre);border-radius:999px;padding:7px 14px;font:inherit;font-weight:700;cursor:pointer} .notif-filters button:hover{border-color:var(--bleu)} .notif-filters button[aria-selected="true"]{background:var(--bleu);border-color:var(--bleu);color:#fff} .notif-filters .n{background:rgba(127,140,160,.18);border-radius:99px;padding:0 8px;font-size:.8rem} /* Liste regroupée par jour */ .notif-sec{font-size:1.05rem;margin:26px 0 4px} .notif-day{margin-top:18px} .notif-day h3{margin:0 0 8px;font-size:.78rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ardoise)} .notif-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px} .notif-list li{list-style:none} .notif{position:relative;display:flex;gap:12px;align-items:center;width:100%;background:var(--papier);border:1px solid var(--trait);border-radius:12px;padding:12px 14px;text-align:left;font:inherit;color:inherit;cursor:pointer;transition:border-color .15s,box-shadow .15s} .notif:hover{border-color:var(--bleu);box-shadow:0 4px 14px rgba(16,27,46,.08)} .notif:focus-visible{outline:2px solid var(--bleu);outline-offset:2px} .notif.is-new{border-left:4px solid var(--bleu)} .notif > .ic{width:18px;height:18px;color:var(--ardoise);flex:0 0 auto} .notif-ico{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;flex:0 0 auto;background:rgba(100,116,139,.15);color:var(--ardoise)} .notif-ico .ic{width:19px;height:19px} .notif.tone-warn .notif-ico,.notif-ico.tone-warn{background:rgba(217,119,6,.16);color:#B45309} .notif.tone-info .notif-ico{background:rgba(37,99,235,.14);color:var(--bleu)} .notif.tone-ok .notif-ico{background:rgba(22,163,74,.15);color:#15803D} .notif-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px} .notif-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .notif-top b{font-size:.95rem} .notif-new{background:var(--bleu);color:#fff;border-radius:99px;padding:1px 9px;font-size:.7rem;font-weight:700} .notif-cat{border:1px solid var(--trait);color:var(--ardoise);border-radius:99px;padding:0 8px;font-size:.7rem;font-weight:700;letter-spacing:.02em} .notif.tone-bad .notif-ico,.notif-ico.tone-bad{background:rgba(220,38,38,.13);color:#B91C1C} .notif-ico.tone-ok{background:rgba(22,163,74,.15);color:#15803D} :root[data-theme="dark"] .notif.tone-bad .notif-ico,:root[data-theme="dark"] .notif-ico.tone-bad{background:rgba(248,113,113,.17);color:#FCA5A5} :root[data-theme="dark"] .notif-ico.tone-ok{background:rgba(74,222,128,.16);color:#4ADE80} .notif-text{color:var(--encre);overflow-wrap:anywhere} .notif-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--ardoise);font-size:.82rem} .notif-chip{background:rgba(127,140,160,.16);border-radius:99px;padding:1px 9px} .notif-who{display:inline-flex;align-items:center;gap:5px} .notif-who .avatar{width:20px;height:20px;font-size:.58rem} .notif-time{color:var(--ardoise);font-size:.85rem;white-space:nowrap;flex:0 0 auto} .notif-more{display:flex;margin:16px auto 0} /* Bloc « À traiter » */ .notif-todo{margin-bottom:6px} .notif-todo > header{flex-wrap:wrap} .count-pill{display:inline-block;margin-left:8px;background:#D97706;color:#fff;border-radius:99px;padding:1px 9px;font-size:.78rem;vertical-align:middle} .notif-todo-list{list-style:none;margin:0;padding:0} .notif-todo-list li{display:flex;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--trait)} .notif-todo-list li:first-child{border-top:0;padding-top:0} .notif-act{display:flex;gap:8px;flex:0 0 auto} @media (max-width:640px){ .notif-todo-list li{flex-wrap:wrap} .notif-todo-list .notif-body{flex-basis:calc(100% - 52px)} .notif-act{width:100%;padding-left:50px} .notif-act .btn{flex:1;justify-content:center} .notif-time{align-self:flex-start;margin-top:2px} } :root[data-theme="dark"] .notif:hover{box-shadow:0 4px 14px rgba(0,0,0,.35)} :root[data-theme="dark"] .notif.tone-warn .notif-ico,:root[data-theme="dark"] .notif-ico.tone-warn{background:rgba(245,158,11,.18);color:#FBBF24} :root[data-theme="dark"] .notif.tone-info .notif-ico{background:rgba(96,165,250,.18);color:#93C5FD} :root[data-theme="dark"] .notif.tone-ok .notif-ico{background:rgba(74,222,128,.16);color:#4ADE80} :root[data-theme="dark"] .notif-new{background:#2B4F9E} :root[data-theme="dark"] .notif.is-new{border-left-color:#5B8DEF} /* Boutons clair / sombre (présentation et connexion) */ .theme-btn{width:40px;height:40px;padding:0;display:inline-grid;place-items:center} .theme-btn .ic{width:18px;height:18px} .lang-top{align-items:center;gap:8px} .theme-icon{border:1px solid var(--trait);background:var(--papier);color:var(--ardoise)} .theme-icon:hover{border-color:var(--bleu)} /* ---- Rapport ---- */ .report-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px} .report-range{flex:1;min-width:200px;text-align:center;font-size:1rem} /* ---- Popup de présentation (bas à droite) ---- */ #promo-pop{position:fixed;right:20px;bottom:96px;z-index:66;width:340px;max-width:calc(100vw - 32px);display:flex;gap:12px;align-items:flex-start;background:var(--papier);color:var(--encre);border:1px solid var(--trait);border-left:4px solid var(--metre);border-radius:14px;padding:14px 16px 14px 14px;box-shadow:0 18px 44px rgba(8,16,34,.22);animation:promoIn .35s ease both} #promo-pop .pp-ico{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--bleu-clair);color:var(--bleu);display:inline-flex;align-items:center;justify-content:center} #promo-pop .pp-ico .ic{width:18px;height:18px} #promo-pop .pp-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px} #promo-pop .pp-body b{font-size:.95rem;line-height:1.3;padding-right:14px} #promo-pop .pp-body span{font-size:.85rem;color:var(--ardoise);line-height:1.4} #promo-pop .pp-act{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap} #promo-pop .pp-x{position:absolute;top:6px;right:8px;border:0;background:transparent;font-size:1.2rem;line-height:1;color:var(--ardoise);cursor:pointer;padding:4px} @keyframes promoIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} @media(max-width:560px){#promo-pop{left:16px;right:16px;width:auto;bottom:16px}} @media (prefers-reduced-motion:reduce){#promo-pop{animation:none}} /* ---- Filtre du rapport par chantier ---- */ .report-filter{display:flex;justify-content:flex-end;margin:-6px 0 14px} .report-sel{min-width:240px;border:1px solid var(--trait);border-radius:10px;background:var(--papier);color:var(--encre);padding:9px 12px;font:inherit;font-weight:600} /* ---- Notifications cliquables et mise en évidence ---- */ .flash-target{outline:3px solid var(--metre);outline-offset:4px;border-radius:12px;transition:outline-color .6s ease} /* ---- Finitions : lisibilité des tableaux et confort sur téléphone ---- */ .table td .link-btn, .table td[data-label="Date"], .table td[data-label="Montant TTC"]{white-space:nowrap} @media (max-width:560px){ #cookie-bar{left:10px;right:10px;bottom:10px;padding:10px 12px;gap:10px;border-radius:12px;font-size:.8rem} #cookie-bar span{flex:1 1 200px;min-width:0} #cookie-bar .btn{flex:0 0 auto} } @media (max-width:420px){ .overview-metric b{font-size:1.2rem} .overview-metric{padding:14px 12px} } .priority-section header a,.priority-section header button{white-space:nowrap} /* ---- Thème sombre : surfaces restées claires ---- */ :root[data-theme="dark"] input, :root[data-theme="dark"] select, :root[data-theme="dark"] textarea{background-color:var(--papier);color:var(--encre);border-color:var(--trait)} :root[data-theme="dark"] .planning-surface, :root[data-theme="dark"] .plan-table th, :root[data-theme="dark"] .plan-table th.person, :root[data-theme="dark"] .plan-table td{background-color:#141D2B;border-color:#2B3549;color:var(--encre)} :root[data-theme="dark"] .plan-table th.today{background-color:#2A2212;color:#F5C04A} :root[data-theme="dark"] .plan-table td.today{background-color:#1A1A12} :root[data-theme="dark"] .person{background-color:#141D2B} :root[data-theme="dark"] .material-list, :root[data-theme="dark"] .material-kpi-icon{background-color:#1B2638} :root[data-theme="dark"] .material-kpi-icon.warn{background-color:#3A2A12} :root[data-theme="dark"] .material-kpi-icon.info{background-color:#182A4D} :root[data-theme="dark"] .material-kpi-icon.ok{background-color:#153024} :root[data-theme="dark"] .ch-card-progress{background-color:#2B3549} :root[data-theme="dark"] .task-project{background-color:#1E2A3D;border-color:#2B3549;color:var(--encre)} :root[data-theme="dark"] .notif-filters .n{background:rgba(255,255,255,.12)} :root[data-theme="dark"] .chip{background-color:#1E2A3D;color:var(--encre)} :root[data-theme="dark"] .chip span, :root[data-theme="dark"] .chip small{color:#C5CFDE} :root[data-theme="dark"] .btn.primary, :root[data-theme="dark"] .btn.primary:hover{color:#0E1628} :root[data-theme="dark"] .plan-table .person small, :root[data-theme="dark"] .plan-table .person span{color:#C5CFDE} :root[data-theme="dark"] .project-status, :root[data-theme="dark"] .ch-card-status{color:color-mix(in srgb, var(--project-color) 45%, white)} :root[data-theme="dark"] .material-row, :root[data-theme="dark"] .material-list{background-color:#182233;color:var(--encre)} :root[data-theme="dark"] .notif-filters button[aria-selected="true"]{background:#2B4F9E;border-color:#2B4F9E;color:#fff} :root[data-theme="dark"] .notif-filters button[aria-selected="true"] .n{background:rgba(255,255,255,.2);color:#fff} :root[data-theme="dark"] .overview-attention.is-alert, :root[data-theme="dark"] .overview-attention.is-alert .ic, :root[data-theme="dark"] .overview-metric small{color:#F4A09B} :root[data-theme="dark"] .plan-table th.today small{color:#F5C04A} .plan-table th.today small{color:#7A4A00} :root[data-theme="dark"] .material-list header h2{color:var(--encre)} :root[data-theme="dark"] .material-meta{color:#A9B6CB} :root[data-theme="dark"] .material-list > header{background-color:#182233;border-color:#2B3549} /* Matériel — proportions du tableau de bord Homolux */ #main:has(.material-head){max-width:1480px;width:100%;margin:0 auto;padding-left:26px;padding-right:26px} .material-kpi-grid{gap:18px;margin-bottom:18px}.material-kpi-grid article{padding:18px 20px}.material-kpi-grid .material-kpi-icon{width:40px;height:40px} .material-suppliers{grid-template-columns:minmax(250px,.8fr) minmax(0,3fr);gap:18px;margin-bottom:18px;padding:16px 18px} .material-workspace{grid-template-columns:minmax(0,1fr) minmax(320px,380px);gap:18px}.material-analytics{gap:18px;margin-top:18px} @media(max-width:980px){#main:has(.material-head){padding-left:20px;padding-right:20px}.material-suppliers{grid-template-columns:1fr}.material-workspace{grid-template-columns:1fr}} /* Matériel : lecture un peu plus généreuse sur écran */ .material-kpi-grid article{min-height:92px}.material-kpi-grid .material-kpi-icon{width:40px;height:40px}.material-kpi-grid b{font-size:1.75rem}.material-kpi-grid small{font-size:.8125rem}.material-kpi-grid em{font-size:.75rem}.material-suppliers{padding:16px 18px}.material-suppliers b{font-size:.875rem}.material-suppliers small{font-size:.75rem}.material-supplier{min-height:64px;padding:10px 12px}.supplier-logo{width:40px;height:40px}.material-requests>header{padding:18px 18px 12px}.material-requests h2,.material-analytics h2{font-size:1rem}.material-search{height:40px;margin:0 18px}.material-search input{font-size:.8rem}.material-filter-tabs{padding:10px 18px}.material-filter-tabs button{font-size:.72rem}.material-row{min-height:64px;gap:12px}.material-row .material-request-icon{width:34px;height:34px}.material-main>b{font-size:.84rem}.material-main>span{font-size:.7rem}.material-person small{font-size:.72rem}.material-row .badge{font-size:.68rem}.material-detail{padding:22px}.detail-title h2{font-size:1rem}.material-detail dt,.material-detail dd{font-size:.75rem}.material-analytics article{padding:18px}.material-chart{width:105px;height:105px}.material-chart b{font-size:1.25rem} /* La demande garde toujours son icône à gauche, comme dans Homolux. */ #main:has(.material-head){max-width:1720px;padding-left:18px;padding-right:18px} .material-row{grid-template-areas:"accent icon main person state open"}.material-row .material-accent{display:block;grid-area:accent}.material-row .material-request-icon{grid-area:icon}.material-row .material-main{grid-area:main}.material-row .material-person{grid-area:person}.material-row .badge{grid-area:state}.material-row .material-open{grid-area:open} @media(max-width:980px){.material-row{grid-template-areas:"accent icon main state open"}.material-row .material-person{display:none}} @media(max-width:680px){.material-row{grid-template-areas:"accent icon main state"}.material-row .badge,.material-row .material-open{display:none}} /* Zoom léger du contenu Matériel */ .material-requests h2,.material-analytics h2{font-size:1.08rem}.material-search{height:43px}.material-search input{font-size:.84rem}.material-filter-tabs button{font-size:.75rem}.material-row{min-height:68px}.material-row .material-request-icon{width:37px;height:37px}.material-main>b{font-size:.9rem}.material-main>span{font-size:.74rem}.material-person .avatar{width:24px;height:24px}.material-person small{font-size:.75rem}.material-row .badge{font-size:.71rem}.material-detail dt,.material-detail dd{font-size:.79rem}.detail-title h2{font-size:1.08rem} /* Zoom supplémentaire : demande et détail restent les éléments les plus visibles. */ .material-kpi-grid article{min-height:98px}.material-kpi-grid b{font-size:1.9rem}.material-kpi-grid .material-kpi-icon{width:44px;height:44px}.material-supplier{min-height:70px}.material-suppliers b{font-size:.94rem}.material-suppliers small{font-size:.79rem}.material-requests h2,.material-analytics h2{font-size:1.16rem}.material-search{height:47px}.material-search input{font-size:.9rem}.material-filter-tabs button{padding:7px 12px;font-size:.8rem}.material-row{min-height:76px;gap:14px}.material-row .material-request-icon{width:42px;height:42px}.material-request-icon .ic{width:20px;height:20px}.material-main>b{font-size:.98rem}.material-main>span{font-size:.8rem}.material-person .avatar{width:27px;height:27px}.material-person small{font-size:.8rem}.material-row .badge{font-size:.76rem}.material-detail{padding:25px}.detail-title .material-request-icon{width:48px;height:48px}.detail-title h2{font-size:1.18rem}.material-detail dt,.material-detail dd{font-size:.85rem}.material-analytics article{padding:22px}.material-chart{width:116px;height:116px} /* Cartes de demande : plus de relief, une seule couleur de statut et une meilleure lecture. */ .material-rows{padding:6px 14px 12px}.material-row{position:relative;grid-template-columns:42px minmax(180px,1fr) minmax(120px,.55fr) auto 24px;grid-template-areas:"icon main person state open";min-height:78px;margin:8px 0;padding:12px 14px;border:1px solid #DFE6ED!important;border-left:4px solid var(--material-color)!important;border-radius:13px!important;background:#fff!important;box-shadow:0 3px 10px rgba(28,48,73,.045);overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.material-row .material-accent{display:none}.material-row:hover{transform:translateY(-2px);border-color:var(--material-color)!important;box-shadow:0 10px 20px rgba(28,48,73,.11)!important}.material-row.selected{background:linear-gradient(100deg,color-mix(in srgb,var(--material-color) 8%,#fff),#fff 55%)!important;box-shadow:0 8px 20px rgba(28,48,73,.09)!important}.material-row.selected::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:9px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--material-color) 32%,transparent)}.material-row .material-request-icon{grid-area:icon;border-radius:12px;background:#EDF3FF;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}.material-row .material-main{grid-area:main}.material-row .material-person{grid-area:person}.material-row .badge{grid-area:state;padding:6px 10px}.material-row .material-open{grid-area:open;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#F4F6F8;color:#53677F}.material-row:hover .material-open{background:var(--material-color);color:#fff}.material-main>b{letter-spacing:-.01em}.material-main>span{margin-top:5px}.material-main>span i{width:8px;height:8px}.material-person{padding-left:10px;border-left:1px solid #E8EDF2} @media(max-width:980px){.material-row{grid-template-columns:42px minmax(0,1fr) auto 24px;grid-template-areas:"icon main state open"}.material-row .material-person{display:none}} @media(max-width:680px){.material-rows{padding:5px 9px 10px}.material-row{grid-template-columns:38px minmax(0,1fr);grid-template-areas:"icon main";min-height:70px;margin:7px 0;padding:10px}.material-row .material-request-icon{width:36px;height:36px}.material-row .badge,.material-row .material-open{display:none}} /* Variante Homolux : demande compacte, douce et sans effet carte lourd. */ .material-rows{padding:0 12px 10px}.material-row{grid-template-columns:42px minmax(190px,1fr) minmax(145px,.6fr) auto 56px 26px;grid-template-areas:"icon main person state date open";min-height:64px;margin:0;padding:8px 10px;border:0!important;border-left:3px solid transparent!important;border-radius:11px!important;background:transparent!important;box-shadow:none!important;overflow:visible}.material-row+.material-row{border-top:1px solid #E9EDF1!important}.material-row.selected{border-left-color:#285843!important;background:#F1F6F2!important;box-shadow:none!important}.material-row.selected::after{display:none}.material-row:hover{transform:none;border-color:transparent!important;border-left-color:var(--material-color)!important;background:#F7F9FA!important;box-shadow:none!important}.material-row .material-request-icon{width:34px;height:34px;border-radius:10px;box-shadow:none}.material-main>b{font-size:.85rem}.material-main>span{gap:7px;margin-top:3px;font-size:.7rem}.material-main>span .material-category{display:inline-flex;width:auto;height:19px;padding:0 8px;align-items:center;border-radius:999px;background:#F1EAFF;color:#6D35C8;font-style:normal;font-size:.66rem;font-weight:700}.material-main>span em{font-size:.68rem}.material-person{padding-left:0;border:0;font-size:.74rem}.material-person .avatar{width:25px;height:25px}.material-row .badge{padding:5px 9px;font-size:.68rem}.material-date{grid-area:date;justify-self:end;color:#667482;font-size:.69rem;white-space:nowrap}.material-row .material-open{width:25px;height:25px;background:#F5F7F8}.material-row:hover .material-open{background:#EEF2F5;color:#34495F} @media(max-width:980px){.material-row{grid-template-columns:42px minmax(0,1fr) auto 54px 26px;grid-template-areas:"icon main state date open"}.material-row .material-person{display:none}} @media(max-width:680px){.material-row{grid-template-columns:38px minmax(0,1fr) auto;grid-template-areas:"icon main open";min-height:64px;margin:0;padding:8px}.material-row .material-request-icon{width:34px;height:34px}.material-row .badge,.material-date{display:none}.material-row .material-open{display:grid}} /* Ligne de demande — modèle intervention moderne */ .material-rows{padding:8px 14px 12px}.material-row{grid-template-columns:56px minmax(220px,1fr) minmax(145px,.55fr) auto 38px;grid-template-areas:"icon main person state more";min-height:92px;margin:0;border:1px solid #DCE5EE!important;border-left:1px solid #DCE5EE!important;border-radius:16px!important;background:#fff!important;box-shadow:0 7px 18px rgba(23,46,80,.04)!important;gap:16px;padding:13px 16px}.material-row+.material-row{margin-top:8px;border-top:1px solid #DCE5EE!important}.material-row.selected{border-color:#BFCFE1!important;border-left-color:#BFCFE1!important;background:#fff!important;box-shadow:0 9px 22px rgba(23,46,80,.07)!important}.material-row:hover{transform:translateY(-1px);border-color:#AFC2D8!important;border-left-color:#AFC2D8!important;background:#fff!important;box-shadow:0 10px 24px rgba(23,46,80,.09)!important}.material-row .material-request-icon{width:50px;height:50px;border:2px solid #112D54;border-radius:14px;background:#fff;color:#143863}.material-row .material-request-icon .ic{width:24px;height:24px}.material-row .material-main{align-self:center}.material-main>b{font:750 1.02rem/1.2 var(--titre);letter-spacing:-.02em}.material-main>span{margin-top:6px;color:#667A96;font-size:.82rem;font-weight:500}.material-main>span em{margin:0 8px;color:#9AA9BB}.material-row .material-person{align-self:center;justify-self:start;gap:9px;padding:6px 14px 6px 8px;border-left:1px solid #DCE5EE;border-radius:999px;background:#F4F7FA;font-size:.82rem;color:#102B50}.material-person .avatar{width:36px;height:36px}.material-person small{font-size:.84rem;font-weight:750;color:#102B50}.material-status-pill{grid-area:state;display:inline-flex;align-items:center;justify-content:center;gap:9px;align-self:center;min-height:43px;padding:0 17px;border-radius:999px;font-size:.88rem;font-weight:800;white-space:nowrap}.material-status-pill .ic{width:20px;height:20px;padding:4px;border-radius:50%;background:#123B69;color:#fff}.material-status-pill.warn{background:#FFF0D5;color:#8A5310}.material-status-pill.info{background:#E3EFFF;color:#1B58B6}.material-status-pill.ok{background:#E2F5EB;color:#157144}.material-more{grid-area:more;display:grid;place-items:center;align-self:center;width:38px;height:43px;border-radius:12px;background:#F5F7FA;color:#173554;font-size:1.55rem;font-weight:800;line-height:1}.material-row .badge,.material-row .material-date,.material-row .material-open{display:none} @media(max-width:980px){.material-row{grid-template-columns:58px minmax(0,1fr) auto 38px;grid-template-areas:"icon main state more";gap:13px}.material-row .material-person{display:none}.material-status-pill{min-height:42px;padding:0 14px;font-size:.84rem}.material-more{width:38px;height:42px}} @media(max-width:680px){.material-rows{padding:8px}.material-row{grid-template-columns:46px minmax(0,1fr) 34px;grid-template-areas:"icon main more";min-height:78px;gap:11px;padding:10px 11px;border-radius:14px!important}.material-row+.material-row{margin-top:7px}.material-row .material-request-icon{width:42px;height:42px;border-width:1.5px;border-radius:12px}.material-row .material-request-icon .ic{width:20px;height:20px}.material-main>b{font-size:.92rem}.material-main>span{margin-top:4px;font-size:.74rem}.material-status-pill{display:none}.material-more{width:32px;height:38px;background:transparent;font-size:1.35rem}} /* Graphiques Matériel : anneaux dashboard et légendes élégantes. */ .material-analytics article{position:relative;overflow:hidden;border-color:#DCE5EE;background:linear-gradient(135deg,#fff 0%,#FBFCFE 100%);box-shadow:0 10px 26px rgba(28,48,73,.055)}.material-analytics article::after{content:"";position:absolute;width:190px;height:190px;right:-92px;bottom:-108px;border-radius:50%;background:radial-gradient(circle,rgba(33,82,185,.06),transparent 68%);pointer-events:none}.material-analytics h2{position:relative;z-index:1;font-size:1.05rem}.material-chart-wrap{position:relative;z-index:1;gap:28px;margin-top:18px}.material-chart{width:132px;height:132px;box-shadow:0 10px 22px rgba(22,45,79,.09)}.material-chart::before{inset:17px;background:linear-gradient(145deg,#fff,#F7F9FC);box-shadow:inset 0 1px 2px rgba(17,43,79,.08),0 2px 7px rgba(17,43,79,.04)}.material-chart span{display:grid;gap:2px;place-items:center}.material-chart b{font-size:1.45rem;letter-spacing:-.04em}.material-chart small{font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.material-chart-legend{display:grid;gap:13px}.material-chart-legend>div{display:block;min-height:0;border:0}.material-chart-line{display:grid;grid-template-columns:10px minmax(0,1fr) 24px 38px;align-items:center;gap:8px;font-size:.77rem}.material-chart-line>i{width:9px;height:9px;border-radius:50%;background:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 12%,transparent)}.material-chart-line span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700;color:#31435C}.material-chart-line b{font-size:.78rem;text-align:right}.material-chart-line small{font-size:.68rem;text-align:right;color:#7A8796;font-weight:700}.material-chart-legend em{display:block;height:6px;margin:7px 0 0 18px;border-radius:99px;background:#EAF0F5;overflow:hidden}.material-chart-legend em i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 68%,#fff));box-shadow:0 1px 2px color-mix(in srgb,var(--c) 35%,transparent)} @media(max-width:680px){.material-chart-wrap{gap:18px}.material-chart{width:112px;height:112px}.material-chart::before{inset:15px}.material-chart b{font-size:1.25rem}.material-chart-legend{gap:10px}.material-chart-line{font-size:.72rem}} /* Couleurs plus affirmées pour les camemberts. */ .material-chart{filter:saturate(1.22) contrast(1.03);background:var(--chart),var(--chart-color);outline:5px solid color-mix(in srgb,var(--chart-color) 14%,#EEF3F8);outline-offset:3px}.material-chart::before{inset:23px;background:radial-gradient(circle at 32% 25%,color-mix(in srgb,var(--chart-color) 24%,#fff),color-mix(in srgb,var(--chart-color) 9%,#fff) 58%,#fff 100%)}.material-chart-line>i{box-shadow:0 0 0 5px color-mix(in srgb,var(--c) 16%,transparent)}.material-chart-legend em{height:7px;background:#E7EDF4}.material-chart-legend em i{background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 78%,#fff))} @media(max-width:680px){.material-chart::before{inset:19px}} /* Camemberts sobres — style tableau de bord Homolux. */ .material-analytics article{border:0;background:#fff;box-shadow:0 7px 20px rgba(28,48,73,.055)}.material-analytics article::after{display:none}.material-analytics h2{font:700 1rem var(--titre);color:#17233A}.material-chart-wrap{gap:22px;margin-top:14px}.material-chart{width:126px;height:126px;filter:none;background:var(--chart);outline:0;outline-offset:0;box-shadow:none;animation:material-donut-in .78s cubic-bezier(.2,.85,.25,1) both;transform-origin:center}.material-chart::before{inset:25px;background:#fff;box-shadow:none}.material-chart span{animation:material-donut-text .5s .35s both}.material-chart b{font-size:1.22rem;letter-spacing:-.03em}.material-chart small{font-size:.59rem;font-weight:600;text-transform:none;letter-spacing:0}.material-chart-legend{display:block;flex:1}.material-chart-line,.material-chart-total{display:grid!important;grid-template-columns:11px minmax(0,1fr) 25px 42px;align-items:center;gap:8px;min-height:31px;margin:0;border-bottom:1px solid #E7EBEF!important;font-size:.72rem;animation:material-legend-in .45s both}.material-chart-line:nth-child(1){animation-delay:.3s}.material-chart-line:nth-child(2){animation-delay:.42s}.material-chart-line:nth-child(3){animation-delay:.54s}.material-chart-line>i{width:9px;height:9px;border-radius:3px;box-shadow:none}.material-chart-line span{font-weight:500;color:#374352}.material-chart-line b{font-size:.72rem;font-weight:700}.material-chart-line small{font-size:.69rem;font-weight:500;color:#687581}.material-chart-total{grid-template-columns:11px minmax(0,1fr) 25px 42px;border:0!important;text-transform:uppercase;font-size:.62rem;font-weight:800;letter-spacing:.04em;color:#68737E;animation-delay:.64s}.material-chart-total::before{content:""}.material-chart-total b{font-size:.72rem;color:#33404E;text-align:right}.material-chart-total small{font-size:.69rem;text-align:right;color:#687581;font-weight:500}.material-chart-legend em{display:none} @keyframes material-donut-in{0%{opacity:0;transform:scale(.58) rotate(-100deg);filter:blur(2px)}70%{opacity:1;transform:scale(1.045) rotate(8deg);filter:blur(0)}100%{opacity:1;transform:scale(1) rotate(0)}}@keyframes material-donut-text{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}@keyframes material-legend-in{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}} @media(prefers-reduced-motion:reduce){.material-chart,.material-chart span,.material-chart-line,.material-chart-total{animation:none!important}} @media(max-width:680px){.material-chart{width:112px;height:112px}.material-chart::before{inset:22px}.material-chart-wrap{gap:16px}.material-chart-line,.material-chart-total{grid-template-columns:10px minmax(0,1fr) 20px 34px;font-size:.68rem}} /* Composant Donut Homolux : mêmes proportions et même légende. */ .material-chart-wrap{display:flex;align-items:center;gap:22px;margin-top:14px}.material-chart{width:150px;height:150px;border-radius:50%;flex:0 0 auto;position:relative;display:grid;place-items:center;background:var(--chart);filter:none;outline:0;box-shadow:none}.material-chart::before{content:"";position:absolute;width:92px;height:92px;inset:auto;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px #E1E7ED}.material-chart span{position:relative;z-index:1;text-align:center;display:block;animation:material-donut-text .5s .35s both}.material-chart b{display:block;font:600 26px/1 var(--titre);letter-spacing:0;color:var(--encre)}.material-chart small{font-size:10.5px;color:var(--ardoise);font-weight:600;text-transform:none;letter-spacing:0}.material-chart-legend{flex:1;display:flex;flex-direction:column;gap:9px;min-width:0}.material-chart-line,.material-chart-total{display:grid!important;grid-template-columns:14px 1fr auto auto;align-items:center;gap:10px;min-height:0;margin:0;border:0!important;font-size:13px}.material-chart-line>i{width:11px;height:11px;border-radius:4px;box-shadow:none}.material-chart-line span{color:var(--encre);font-weight:400}.material-chart-line b{font:600 13px/1 system-ui,sans-serif;letter-spacing:0}.material-chart-line small{width:42px;text-align:right;font-size:13px;color:var(--ardoise);font-weight:400}.material-chart-total{border-top:1px solid #E1E7ED!important;padding-top:9px;margin-top:2px;text-transform:none;font-size:13px;letter-spacing:0}.material-chart-total::before{content:""}.material-chart-total span{color:var(--ardoise);font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.05em}.material-chart-total b{font:600 13px/1 system-ui,sans-serif;letter-spacing:0;color:var(--encre);text-align:right}.material-chart-total small{width:42px;text-align:right;font-size:13px;color:var(--ardoise);font-weight:400}.material-chart-legend em{display:none} @media(max-width:680px){.material-chart-wrap{gap:18px}.material-chart{width:124px;height:124px}.material-chart::before{width:76px;height:76px}.material-chart b{font-size:22px}.material-chart-line,.material-chart-total{grid-template-columns:11px minmax(0,1fr) auto 36px;gap:7px;font-size:11px}.material-chart-line>i{width:9px;height:9px}.material-chart-line b,.material-chart-line small,.material-chart-total b,.material-chart-total small{font-size:11px;width:auto}} .material-more-requests{display:flex;align-items:center;justify-content:center;gap:6px;width:calc(100% - 28px);margin:4px 14px 2px;padding:10px;border:0;border-top:1px solid #E7ECF1;background:transparent;color:#234E80;font:750 .82rem system-ui,sans-serif;cursor:pointer}.material-more-requests:hover{color:#102F56;background:#F7FAFD}.material-more-requests .ic{width:16px;height:16px} /* Tableau des tâches par chantier */ #main:has(.tasks-page){max-width:1780px;padding-left:34px;padding-right:34px}.tasks-page{width:100%}.task-board-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 0 24px}.task-board-title{display:flex;align-items:center;gap:18px;min-width:0}.task-board-title h1{margin:0;font-size:2rem;letter-spacing:-.035em}.task-board-icon{display:grid;place-items:center;width:54px;height:54px;flex:none;border-radius:13px;background:#F9EDDC;color:#23334C}.task-board-icon .ic{width:29px;height:29px}.task-board-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}.task-chantier-select{position:relative;display:flex;align-items:center;gap:10px;min-width:280px;height:48px;padding:0 13px;border:1px solid #D5D7DB;border-radius:13px;background:#fff;color:#141D31}.task-chantier-select .ic{width:21px;height:21px}.task-chantier-select::after{content:'⌄';margin-left:auto;font-size:1.1rem;pointer-events:none}.task-chantier-select select{position:absolute;inset:0;width:100%;padding:0 38px 0 45px;border:0;appearance:none;background:transparent;color:transparent;cursor:pointer;outline:0}.task-chantier-select select option{color:#141D31}.tasks-page .kanban{padding:0;background:transparent;border-radius:0}.kanban{grid-template-columns:repeat(3,minmax(290px,1fr));gap:16px;align-items:stretch}.col{min-height:720px;padding:14px;border:0;border-radius:18px;background:linear-gradient(145deg,#F7F5F1,#F2F0EC);box-shadow:none;gap:10px}.col > header{min-height:48px;padding:1px 10px 8px;align-items:center}.col-heading{display:flex;align-items:center;gap:14px}.col-heading .ic{width:27px;height:27px;color:#151C2C}.col-terminé .col-heading .ic{color:#218149}.col > header h2{margin:0;font-size:1.38rem;letter-spacing:-.02em}.col > header .n{min-width:34px;padding:7px 10px;background:#E9E7E3;color:#151C2C;text-align:center;font-size:.84rem}.task{min-height:140px;padding:13px 16px 13px 26px;border:1px solid #DEDCD8;border-radius:15px;gap:8px;background:linear-gradient(135deg,#fff,#FCFBF9);box-shadow:0 3px 8px rgba(25,33,47,.06),0 10px 18px rgba(25,33,47,.035)}.task:hover{transform:translateY(-2px);border-color:#CBC8C1;box-shadow:0 8px 15px rgba(25,33,47,.09),0 16px 26px rgba(25,33,47,.06)}.task::before{top:10px;bottom:10px;width:6px;border-radius:8px}.task-title{font-size:1.06rem;line-height:1.27;letter-spacing:-.015em}.task-project{gap:6px;max-width:calc(100% - 4px);padding:4px 10px;border-color:#E0E1E3;background:#F4F4F5;color:#354054;font-size:.79rem}.task-project .ic{width:14px;height:14px;color:#657083}.task-bottom{min-height:31px;gap:8px;font-size:.82rem;color:#293448}.task-bottom .avatar{width:29px;height:29px;font-size:.66rem}.task-bottom > span:not(.task-state){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.task-bottom em{margin:0 2px}.task-due{display:flex;align-items:center;gap:6px}.task-due .ic{width:16px;height:16px}.task-state{display:inline-flex;align-items:center;gap:7px;margin-left:auto;white-space:nowrap}.task-state.progress{padding:7px 10px;border-radius:999px;background:#E2EEFF;color:#1760E4;font-size:.78rem;font-weight:800}.task-state.progress i{width:14px;height:14px;border:2px solid #1760E4;border-radius:50%}.task-state.done{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:#61AA79;color:#fff}.task-state.done .ic{width:18px;height:18px;stroke-width:2.6}.task-open{width:34px;height:34px;border-color:#D6D8DC;background:#fff}.task-open .ic{width:18px;height:18px}.task-menu{padding:0 1px;color:#27364D;font-size:1.55rem}.col-terminé .task{opacity:.76}.col-terminé .task:hover{opacity:1}.col .empty-state{margin:4px;padding:22px 8px;background:rgba(255,255,255,.48);border-radius:12px} @media(max-width:1050px){#main:has(.tasks-page){padding-left:22px;padding-right:22px}.task-board-head{align-items:flex-start;flex-direction:column}.task-board-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}.kanban{grid-template-columns:repeat(3,minmax(300px,1fr));overflow-x:auto;padding-bottom:8px!important}.col{min-height:580px}}@media(max-width:650px){#main:has(.tasks-page){padding-left:14px;padding-right:14px}.task-board-title{gap:11px}.task-board-title h1{font-size:1.45rem}.task-board-icon{width:44px;height:44px}.task-board-icon .ic{width:24px;height:24px}.task-chantier-select{min-width:0;flex:1}.task-board-actions .btn{padding:0 11px}.task-board-actions .btn.primary{width:100%}.kanban{grid-template-columns:1fr;overflow:visible}.col{min-height:180px}.task{min-height:132px}} /* Correction de l’intitulé du chantier sélectionné */ .task-chantier-select select{position:static;min-width:0;flex:1;width:100%;padding:0;border:0;appearance:none;background:transparent;color:#141D31;font:700 .94rem inherit;cursor:pointer;outline:0} /* Contraste du fond du tableau de tâches */ .company-page{max-width:1320px;margin:0 auto;padding:6px 0 34px}.company-hero{display:flex;align-items:center;gap:17px;padding:25px 28px;border:1px solid #D8E3F0;border-radius:20px;background:radial-gradient(circle at 88% 0,#E9F2FF 0,transparent 29%),linear-gradient(135deg,#fff,#F7FAFE);box-shadow:0 10px 28px rgba(25,53,91,.055)}.company-hero-mark{display:grid;place-items:center;width:58px;height:58px;flex:none;border-radius:17px;background:linear-gradient(145deg,#1D4F91,#153667);color:#fff;box-shadow:0 9px 17px rgba(24,59,110,.2)}.company-hero-mark .ic{width:29px;height:29px}.company-eyebrow{display:block;margin-bottom:5px;color:#637897;font-size:.7rem;font-weight:850;letter-spacing:.095em;text-transform:uppercase}.company-hero h1{font-size:1.7rem}.company-hero p{margin:5px 0 0;color:#586B87}.company-hero-status{display:flex;align-items:center;gap:7px;margin-left:auto;padding:9px 12px;border-radius:999px;background:#FFF1D7;color:#966116;font-size:.76rem;font-weight:800;white-space:nowrap}.company-hero-status .ic{width:17px;height:17px}.company-hero-status.ready{background:#E4F5EA;color:#187042}.company-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;margin-top:18px}.company-main{display:grid;gap:18px}.company-card{padding:22px!important;border:1px solid #DCE5F0!important;border-radius:17px!important;background:#fff!important;box-shadow:0 8px 22px rgba(25,53,91,.045)!important}.company-card header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:20px}.company-card header>div{display:flex;gap:11px;align-items:center}.company-card h2{font-size:1.1rem}.company-card p{margin:3px 0 0;color:#667792;font-size:.8rem}.company-card-icon{display:grid;place-items:center;width:37px;height:37px;flex:none;border-radius:11px}.company-card-icon .ic{width:20px;height:20px}.company-card-icon.blue{background:#E6F0FF;color:#2461B7}.company-card-icon.gold{background:#FFF2D4;color:#C78300}.company-card-icon.green{background:#E4F6EC;color:#198052}.company-card-icon.violet{background:#F0E8FF;color:#7041C7}.company-save{padding:5px 8px;border-radius:999px;background:#F0F5FB;color:#6A7E9A;font-size:.66rem;font-weight:800}.company-chip{padding:6px 9px;border-radius:999px;background:#EEF4FF;color:#285CA2;font-size:.7rem;font-weight:800}.company-fields{display:grid;gap:13px}.company-fields.two{grid-template-columns:repeat(2,minmax(0,1fr))}.company-fields.three{grid-template-columns:repeat(3,minmax(0,1fr))}.company-field{display:block;min-width:0}.company-field span{display:block;margin:0 0 6px;color:#50627D;font-size:.72rem;font-weight:800}.company-field input,.company-field select{width:100%;height:42px;padding:0 11px;border:1px solid #CDD9E8;border-radius:9px;background:#FBFCFE;color:#15243D;font:inherit;font-size:.84rem;outline:none}.company-field input:focus,.company-field select:focus{border-color:#3472C7;box-shadow:0 0 0 3px #E2EDFF}.company-legal-note{display:flex;gap:8px;align-items:flex-start;margin-top:17px;padding:11px 12px;border-radius:10px;background:#F6F8FC;color:#556884;font-size:.75rem;line-height:1.4}.company-legal-note .ic{width:17px;height:17px;flex:none;color:#41658F}.company-side{display:flex;flex-direction:column;gap:18px}.company-preview{padding:22px;border-radius:17px;background:linear-gradient(145deg,#183A70,#112B54);color:#F3F7FF;box-shadow:0 14px 28px rgba(20,48,91,.2)}.company-preview-top{display:flex;align-items:center;gap:8px;color:#C7D9F6;font-size:.77rem}.company-preview-top .ic{width:19px;height:19px}.company-preview h3{margin:24px 0 4px;font-size:1.2rem}.company-preview>p{margin:0;color:#C7D5EB;font-size:.8rem;line-height:1.45}.company-preview dl{margin:21px 0 0}.company-preview dl div{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid rgba(225,238,255,.15);font-size:.74rem}.company-preview dt{color:#ABC0E3}.company-preview dd{margin:0;text-align:right;font-weight:800}.company-electronic{padding:22px;border:1px solid #E0D6FB;border-radius:17px;background:linear-gradient(145deg,#FCFAFF,#F5F0FF)}.company-electronic .company-eyebrow{margin-top:15px;color:#7857AE}.company-electronic h2{font-size:1.12rem}.company-electronic p{margin:8px 0 15px;color:#5E5B72;font-size:.8rem;line-height:1.5}.company-electronic-steps{display:flex;flex-direction:column;gap:9px;margin-bottom:17px}.company-electronic-steps span{display:flex;align-items:center;gap:8px;color:#504B65;font-size:.75rem;font-weight:700}.company-electronic-steps .ic{width:16px;height:16px;color:#7B5BC0}.company-disabled{width:100%;opacity:.68;cursor:not-allowed!important}@media(max-width:1050px){.company-layout{grid-template-columns:1fr}.company-side{display:grid;grid-template-columns:1fr 1fr}.company-electronic{height:100%}}@media(max-width:680px){.company-hero{align-items:flex-start;padding:20px;flex-wrap:wrap}.company-hero-status{margin-left:75px}.company-fields.two,.company-fields.three,.company-side{grid-template-columns:1fr}.company-card{padding:18px!important}.company-card header{flex-direction:column}.company-save{margin-left:48px}} /* Espace ouvrier : uniquement le travail du jour, sans gestion ni montants */ .worker-page{max-width:920px;margin:0 auto;padding:4px 0 34px}.worker-head{display:flex;align-items:center;gap:13px;margin:5px 0 19px}.worker-head>.avatar{width:52px;height:52px}.worker-head h1{font-size:1.45rem}.worker-head p{margin:3px 0 0;color:#647692;font-size:.84rem;text-transform:capitalize}.worker-material{display:flex;align-items:center;gap:7px;margin-left:auto;min-height:40px;padding:0 13px;border:1px solid #D9E3EF;border-radius:11px;background:#fff;color:#264A76;font-size:.78rem;font-weight:800;cursor:pointer;box-shadow:0 4px 12px rgba(28,55,92,.05)}.worker-material .ic{width:18px;height:18px}.worker-job{padding:22px;border:1px solid #D7E3F1;border-radius:18px;background:linear-gradient(135deg,#fff,#F7FAFE);box-shadow:0 12px 26px rgba(26,53,90,.07);border-left:6px solid var(--worker-job)}.worker-job-top{display:flex;align-items:flex-start;gap:12px}.worker-job-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:13px;background:color-mix(in srgb,var(--worker-job) 13%,white);color:var(--worker-job)}.worker-job-icon .ic{width:23px;height:23px}.worker-job h2{font-size:1.23rem}.worker-job p{margin:4px 0 0;color:#61738E;font-size:.86rem}.worker-job-date{margin-left:auto;padding:7px 10px;border-radius:999px;background:color-mix(in srgb,var(--worker-job) 12%,white);color:var(--worker-job);font-size:.72rem;font-weight:850;white-space:nowrap}.worker-job-address{display:flex;align-items:center;gap:8px;margin:17px 0 14px;padding:10px 11px;border-radius:10px;background:#F5F8FC;color:#4B607F;font-size:.81rem}.worker-job-address .ic{width:17px;height:17px;color:var(--worker-job)}.worker-job-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:13px;border-top:1px solid #E2E9F2;color:#546983;font-size:.76rem}.worker-job-footer>span{display:flex;align-items:center;gap:6px}.worker-job-footer .ic{width:16px;height:16px}.worker-no-job{display:flex;align-items:center;gap:12px;padding:20px;border:1px solid #DDE6F0;border-radius:16px;background:#fff}.worker-no-job>.ic{width:27px;height:27px;color:#4C6E9B}.worker-no-job>div{flex:1}.worker-no-job b,.worker-no-job span{display:block}.worker-no-job span{margin-top:3px;color:#667792;font-size:.8rem}.worker-section{margin-top:17px;padding:20px;border:1px solid #DDE6F1;border-radius:17px;background:#fff;box-shadow:0 7px 20px rgba(28,53,87,.045)}.worker-section>header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.worker-section h2{font-size:1.1rem}.worker-count{display:grid;place-items:center;min-width:27px;height:27px;border-radius:50%;background:#E7F0FF;color:#235A9D;font-size:.77rem;font-weight:850}.worker-tasks{display:flex;flex-direction:column;gap:9px}.worker-task{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid #DCE6F1;border-radius:12px;background:#fff}.worker-task.late{border-color:#F2C8C8;background:#FFFDFD}.worker-task-main{display:flex;align-items:center;gap:10px;min-width:0;flex:1;border:0;background:transparent;color:#17263E;text-align:left;cursor:pointer}.worker-task-check{width:20px;height:20px;flex:none;border:2px solid #6D809C;border-radius:6px}.worker-task-main b,.worker-task-main small{display:block}.worker-task-main b{font-size:.89rem}.worker-task-main small{display:flex;align-items:center;gap:4px;margin-top:4px;color:#60728C;font-size:.72rem}.worker-task-main small .ic{width:14px;height:14px}.worker-task.late .worker-task-main small{color:#B13B3B}.worker-done{display:flex;align-items:center;gap:4px;min-height:32px;padding:0 10px;border:0;border-radius:9px;background:#E4F5EA;color:#187042;font-size:.72rem;font-weight:850;cursor:pointer}.worker-done .ic{width:15px;height:15px}.worker-more{display:flex;align-items:center;gap:4px;margin:14px auto 0;border:0;background:transparent;color:#245A9D;font-size:.78rem;font-weight:850;cursor:pointer}.worker-more .ic{width:16px;height:16px}.worker-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.worker-slot{display:flex;align-items:center;gap:10px;padding:11px;border:1px solid #E0E7F0;border-radius:11px;background:#FAFCFE}.worker-slot-day{display:grid;place-items:center;width:37px;height:37px;flex:none;border-radius:10px;background:#E8F0FC;color:#275B9F}.worker-slot-day b{font-size:.68rem}.worker-slot-day small{font-size:.62rem}.worker-slot b,.worker-slot small{display:block}.worker-slot b{font-size:.81rem}.worker-slot>span:last-child{min-width:0}.worker-slot small{display:flex;align-items:center;gap:4px;margin-top:3px;color:#637590;font-size:.7rem}.worker-slot small .ic{width:14px;height:14px}@media(max-width:650px){.worker-page{padding-bottom:12px}.worker-head{margin-top:0}.worker-material span{display:none}.worker-material{width:40px;padding:0;justify-content:center}.worker-job{padding:17px}.worker-job-top{gap:9px}.worker-job-date{display:none}.worker-job h2{font-size:1.08rem}.worker-job-footer{align-items:flex-start;flex-direction:column}.worker-section{padding:16px}.worker-slots{grid-template-columns:1fr}.worker-done span{display:none}.worker-done{width:33px;padding:0;justify-content:center}} .tasks-page .col{background:linear-gradient(145deg,#ECE9E3,#E4E1DA);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 8px 20px rgba(30,38,51,.035)} /* Questions rapides de l’assistant */ .assistant-choice{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px 14px 0;background:#fff}.assistant-choice button{min-height:34px;border:1px solid #D8E5F5;border-radius:10px;background:#F7FAFE;color:#385878;font-size:.75rem;font-weight:800;cursor:pointer}.assistant-choice button.active{border-color:#245A9D;background:#E6F0FF;color:#17477C;box-shadow:inset 0 0 0 1px #C7DCF9} .assistant-suggestions{display:flex!important;flex-wrap:wrap;max-height:132px;padding:4px 14px 13px!important;overflow-y:auto!important}.assistant-suggestions button{font-size:.72rem!important}.assistant-messages{min-height:178px!important;max-height:310px!important} /* Mise en forme plus lisible de l’assistant */ .assistant-panel{width:min(460px,calc(100vw - 36px))!important;border-radius:22px!important;box-shadow:0 22px 55px rgba(18,40,77,.25)!important}.assistant-panel>header{padding:16px 18px!important}.assistant-head-icon{width:39px!important;height:39px!important;border-radius:12px!important}.assistant-panel header b{font-size:1rem!important}.assistant-panel header small{font-size:.73rem!important}.assistant-messages{gap:13px!important;min-height:205px!important;max-height:330px!important;padding:16px!important;background:linear-gradient(180deg,#F5F9FF 0%,#fff 100%)!important}.assistant-msg{max-width:92%!important;padding:12px 14px!important;border-radius:15px!important;font-size:.84rem!important;line-height:1.56!important;box-shadow:0 2px 7px rgba(25,53,91,.04)}.assistant-msg.bot{border-color:#D8E5F5!important;border-top-left-radius:5px!important}.assistant-msg.user{padding:9px 13px!important;background:#E1EDFF!important;color:#17477C!important;font-weight:700!important}.assistant-suggestions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;max-height:220px!important;padding:12px 14px 15px!important;overflow-y:auto!important;border-top:1px solid #E7EEF7}.assistant-suggestions::before{content:'Questions rapides';grid-column:1/-1;margin:1px 2px 3px;color:#5C6F8B;font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.assistant-suggestions button{width:100%;min-height:33px;padding:7px 9px!important;border-color:#D8E5F5!important;background:#F8FBFF!important;color:#254C7A!important;font-size:.74rem!important;text-align:left!important}.assistant-suggestions button:hover{background:#E7F0FF!important;border-color:#BFD3F0!important}.assistant-panel .assistant-compose{padding:12px 14px 15px!important} /* Assistant local */ .app-assistant{position:fixed;z-index:90;right:22px;bottom:22px}.assistant-fab{display:flex;align-items:center;gap:9px;min-height:50px;padding:0 17px;border:0;border-radius:16px;background:linear-gradient(135deg,#183B6E,#24589B);color:#fff;box-shadow:0 12px 28px rgba(19,49,91,.26);font:800 .83rem system-ui,sans-serif;cursor:pointer;transition:transform .18s,box-shadow .18s}.assistant-fab:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(19,49,91,.32)}.assistant-fab .ic{width:22px;height:22px}.assistant-panel{width:min(380px,calc(100vw - 36px));margin-bottom:12px;border:1px solid #D7E2F0;border-radius:20px;background:#fff;box-shadow:0 20px 50px rgba(18,40,77,.22);overflow:hidden;animation:assistant-pop .22s ease-out}.assistant-panel>header{display:flex;align-items:center;gap:10px;padding:14px 16px;background:linear-gradient(135deg,#143463,#245A9D);color:#fff}.assistant-head-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:rgba(255,255,255,.15)}.assistant-head-icon .ic{width:21px;height:21px}.assistant-panel header span:nth-child(2){min-width:0;flex:1}.assistant-panel header b,.assistant-panel header small{display:block}.assistant-panel header b{font-size:.92rem}.assistant-panel header small{margin-top:2px;font-size:.69rem;color:#DCE9FC}.assistant-panel header button{display:grid;place-items:center;width:30px;height:30px;border:0;border-radius:8px;background:rgba(255,255,255,.1);color:#fff;cursor:pointer}.assistant-panel header button:hover{background:rgba(255,255,255,.2)}.assistant-panel header button .ic{width:17px}.assistant-messages{display:flex;flex-direction:column;gap:10px;max-height:300px;min-height:160px;padding:14px;overflow:auto;background:linear-gradient(180deg,#F8FAFD,#fff)}.assistant-msg{max-width:88%;padding:10px 12px;border-radius:13px;font-size:.8rem;line-height:1.45}.assistant-msg.bot{align-self:flex-start;border:1px solid #E0E8F2;background:#fff;color:#263A56;border-top-left-radius:4px}.assistant-msg.user{align-self:flex-end;background:#E3EEFF;color:#153967;border-top-right-radius:4px}.assistant-suggestions{display:flex;gap:7px;padding:0 14px 11px;overflow:auto;background:#fff}.assistant-suggestions button{flex:none;padding:6px 9px;border:1px solid #D8E2EF;border-radius:999px;background:#F8FAFD;color:#28486D;font-size:.7rem;font-weight:700;cursor:pointer}.assistant-suggestions button:hover{background:#EAF2FF}.assistant-compose{display:flex;gap:8px;padding:11px 14px 14px;border-top:1px solid #E7ECF2;background:#fff}.assistant-compose input{min-width:0;flex:1;height:40px;padding:0 11px;border:1px solid #C8D7E8;border-radius:10px;outline:0;font:inherit;font-size:.78rem}.assistant-compose input:focus{border-color:#3472C7;box-shadow:0 0 0 3px #DDEBFF}.assistant-compose .btn{min-width:42px;padding:0;justify-content:center}.assistant-compose .btn .ic{width:18px;height:18px}@keyframes assistant-pop{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:760px){.app-assistant{right:14px;left:auto;bottom:76px}.assistant-fab span{display:none}.assistant-fab{width:52px;padding:0;justify-content:center;border-radius:50%}.assistant-panel{width:min(380px,calc(100vw - 28px))}}@media(prefers-reduced-motion:reduce){.assistant-panel{animation:none}.assistant-fab{transition:none}} /* ===== Mode sombre : retouches manuelles (prioritaires sur le bloc AUTO-DARK) ===== */ /* Texte sombre sur les pastilles jaunes (le texte courant est clair en mode sombre). */ :root[data-theme="dark"] .skip, :root[data-theme="dark"] .count{color:#101B2E} :root[data-theme="dark"] .devis-client-avatar{color:color-mix(in srgb,var(--client-color,var(--bleu)) 60%,#fff)} /* Cibles tactiles : au moins 32 px de zone cliquable pour le menu « ⋮ » et le titre des cartes de tâches (le dessin ne change pas). */ .task-menu{min-width:32px;min-height:32px;display:inline-grid;place-items:center;margin:-4px -6px -4px -2px} .task-title{min-height:24px} /* Logo de l'entreprise : page « Mon entreprise » et aperçu des documents. Fond blanc dans les deux thèmes (via une variable : un logo foncé reste lisible en mode sombre). */ .company-logo{display:flex;align-items:center;gap:16px;margin-top:18px;padding-top:18px;border-top:1px solid var(--trait)} .company-logo-box{flex:none;width:120px;height:64px;display:grid;place-items:center;background:var(--logo-bg,#fff);border:1px solid var(--trait);border-radius:10px;overflow:hidden;color:#94A3B8} .company-logo-box img{max-width:100%;max-height:100%;object-fit:contain} .company-logo-body{display:flex;flex-direction:column;gap:4px;min-width:0} .company-logo-body span{font-size:.82rem;color:var(--ardoise)} .company-logo-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px} .quote-logo{width:auto;max-width:150px;max-height:48px;object-fit:contain;background:var(--logo-bg,#fff);border-radius:6px;padding:2px} @media(max-width:560px){.company-logo{flex-direction:column;align-items:flex-start}} /* On phone the sidebar is hidden, so account actions remain available here. */ .company-mobile-logout{display:none} @media(max-width:680px){ .company-mobile-logout{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;margin:14px 0 2px;padding:0 14px;border:1px solid #E7B7B7;border-radius:11px;background:#fff8f8;color:#B42318;font:800 .84rem var(--titre);cursor:pointer} .company-mobile-logout .ic{width:18px;height:18px} .company-mobile-logout:active{transform:scale(.985);background:#fff0f0} } /* ===================================================================================================== TÉLÉPHONE & TABLETTE Tout ce bloc ne s'applique qu'en dessous de 1100 px de large : l'affichage ordinateur n'est pas modifié. - 1100 px et moins : tablette en paysage (barre de gauche encore visible) - 900 px et moins : tablette en portrait et téléphone (barre du bas) - 600 px et moins : téléphone ===================================================================================================== */ /* ---- Tableau des tâches : les colonnes se font glisser du doigt (on voit le bord de la suivante), au lieu de colonnes coupées par le bord de l'écran ---- */ @media (max-width:1100px){ /* Cartes de tâches : le « ⋮ » fait la même chose que le titre et la flèche, on le retire pour laisser la place au nom et à la date (le nom se raccourcit proprement si besoin, la date jamais) */ .task-bottom .task-menu{display:none} .task-bottom > span:not(.task-due):not(.task-state){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .task-bottom .task-due{flex:none;white-space:nowrap} .tasks-page .kanban{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:max(300px,calc(50% - 30px));overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin} .tasks-page .kanban > .col{min-width:0;min-height:0;scroll-snap-align:start} /* Planning : la liste par jour, plus lisible que le tableau de la semaine qui défilait de côté */ .plan-wide,.planning-surface{display:none} .plan-days{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start} } @media (max-width:600px){ .tasks-page .kanban{grid-auto-columns:calc(100% - 24px);gap:10px} .plan-days{grid-template-columns:minmax(0,1fr)} } /* ---- Planning, liste par jour : nom et chantier sur deux lignes, créneau dans une pastille ---- */ .day-block li{min-height:56px} .day-block li > .link-btn,.day-block li > div{display:flex;align-items:center;gap:10px;min-width:0;text-align:left} .day-who{display:flex;flex-direction:column;min-width:0;flex:1} .day-who b{font-size:.95rem;line-height:1.3} .day-ch{color:var(--ardoise);font-size:.88rem;font-weight:400;line-height:1.35;overflow-wrap:anywhere} .day-half{flex:none;font-size:.78rem;font-weight:700;color:var(--ardoise);background:var(--craie);border:1px solid var(--trait);border-radius:99px;padding:2px 10px;text-transform:capitalize} :root[data-theme="dark"] .day-half{background:rgba(255,255,255,.06)} /* ---- Fenêtre « Plus d'onglets » ---- */ .more-list{display:flex;flex-direction:column;gap:8px} .more-list button{display:flex;align-items:center;gap:12px;width:100%;min-height:54px;padding:0 16px;border:1px solid var(--trait);border-radius:12px;background:var(--papier);color:var(--encre);font:inherit;font-weight:700;text-align:left;cursor:pointer} .more-list button > span:first-of-type{flex:1} .more-list button:hover{border-color:var(--bleu)} .more-list button[aria-current="page"]{border-color:var(--bleu);box-shadow:inset 0 0 0 1px var(--bleu)} .more-list .ic{width:20px;height:20px;color:var(--ardoise);flex:none} .more-list .count{background:var(--metre);color:var(--encre);border-radius:99px;padding:1px 9px;font-size:.78rem;font-weight:800} @media (max-width:900px){ /* ---- Barre du bas : 5 onglets + « Plus », libellés jamais coupés ---- */ .bottomnav{overflow:hidden} .bottomnav a,.bnav-more{min-width:0} .bottomnav a > span:not(.count),.bnav-more > span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .bottomnav .ic{width:22px;height:22px} .bnav-more{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:62px;padding:6px 2px;border:0;background:transparent;font:inherit;font-size:.74rem;font-weight:700;color:#C3D0E8;cursor:pointer;position:relative} .bnav-more[aria-current="page"]{color:#fff;box-shadow:inset 0 3px 0 var(--metre)} .bnav-more:focus-visible,.bottomnav a:focus-visible{outline:2px solid #fff;outline-offset:-4px} /* ---- Bouton de l'assistant : toujours au-dessus de la barre du bas, et la page laisse la place pour le voir ---- */ .app-assistant{bottom:calc(76px + env(safe-area-inset-bottom))!important;right:14px} .backdrop{z-index:100} /* une fenêtre ouverte passe devant le bouton de l'assistant */ #main{padding-bottom:150px} /* ---- Devis et factures : une carte compacte par document (client et montant en haut, numéro et statut dessous), au lieu de 5 lignes « Numéro : / Client : / Date : … » par document ---- */ table.resp tr{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 10px;align-items:center;padding:14px 16px} table.resp td{padding:0;width:auto} table.resp td[data-label]::before{content:none} table.resp td[data-label="Client"]{grid-column:1/3;grid-row:1} table.resp td[data-label="Montant TTC"]{grid-column:3;grid-row:1;text-align:right!important;font-size:1.02rem} table.resp td[data-label="Numéro"]{grid-column:1;grid-row:2;font-size:.88rem} table.resp td[data-label="Date"],table.resp td[data-label="Échéance"]{grid-column:2;grid-row:2;font-size:.85rem;color:var(--ardoise);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} table.resp td[data-label="Date"]::before{content:"· ";font-weight:400;font-size:inherit;color:inherit} table.resp td[data-label="Échéance"]::before{content:"· échéance ";font-weight:400;font-size:inherit;color:inherit} table.resp td[data-label="Statut"]{grid-column:3;grid-row:2;justify-self:end} table.resp td:not([data-label]){grid-column:1/-1;grid-row:4;display:flex;flex-wrap:wrap;gap:8px;text-align:left!important} table.resp td:not([data-label]):empty{display:none} table.resp td:not([data-label]) .btn{min-height:44px} /* ---- Onglets Devis / Factures / Relances : défilent sans barre visible ---- */ .tabs{scrollbar-width:none} .tabs::-webkit-scrollbar{display:none} } @media (max-width:600px){ /* ---- Accueil : la date « En retard / Aujourd'hui » passe sous le titre, le titre garde toute la largeur ---- */ .priority-task{grid-template-columns:26px minmax(0,1fr) 18px;row-gap:6px} .priority-task > .priority-check{grid-row:1/3} .priority-task > .priority-task-copy{grid-column:2;grid-row:1} .priority-task > .priority-date{grid-column:2;grid-row:2;justify-self:start} .priority-task > .ic{grid-column:3;grid-row:1/3} .priorities-card > header{flex-wrap:wrap;row-gap:8px} .priorities-card{padding:14px!important} .priority-section{padding:12px;border-radius:14px} /* ---- Matériel : compteurs lisibles (icône au-dessus du chiffre), boutons entiers sous la demande ---- */ .material-overview{grid-template-columns:minmax(0,1fr);gap:12px;padding:14px} .material-donut{display:none} .material-kpi{flex-direction:column;align-items:flex-start;gap:6px;padding:2px 10px} .material-kpi:first-child{padding-left:0} .material-kpi small{font-size:.8rem;line-height:1.25} .material-row{grid-template-columns:4px 38px minmax(0,1fr);grid-template-areas:"accent icon main" "accent . state";row-gap:10px;align-items:start} .material-row > .material-accent{grid-area:accent} .material-row > .material-request-icon{grid-area:icon} .material-row > .material-main{grid-area:main;min-width:0} .material-row > .material-state{grid-area:state;justify-content:flex-start;width:100%} .material-row .material-title{flex-wrap:wrap} .material-row .material-meta{flex-wrap:wrap;row-gap:4px} .material-actions .btn{min-height:44px;flex:1;justify-content:center} /* ---- Textes trop petits pour un téléphone (moins de 12 px) ---- */ .ch-card-status,.project-status,.ch-card-meta,.ch-card-meta em,.project-meta,.project-meta em,.company-save,.notif-cat,.notif-new,.badge{font-size:.75rem} /* ---- En-tête de la présentation : logo et boutons sur une seule ligne ---- */ .site-header .theme-btn{display:none} .site-header .in{gap:10px} .site-header .brand{white-space:nowrap;flex:none} .site-header .right{gap:6px;flex-wrap:nowrap;margin-left:auto} .site-header .right .btn{white-space:nowrap;padding:0 11px;font-size:.85rem;min-height:42px} /* ---- Fenêtres : elles montent du bas de l'écran, le pouce atteint les boutons ---- */ .backdrop{align-items:flex-end;padding:0!important} .backdrop > .modal{width:100%;max-width:100%;max-height:92vh;overflow-y:auto;border-radius:18px 18px 0 0;padding:20px 16px calc(16px + env(safe-area-inset-bottom));gap:14px} .backdrop > .modal > footer{display:flex;flex-wrap:wrap;gap:8px;position:sticky;z-index:2;bottom:calc(-16px - env(safe-area-inset-bottom));margin:0 -16px calc(-16px - env(safe-area-inset-bottom));padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--papier);border-top:1px solid var(--trait)} .backdrop > .modal > footer .btn{flex:1 1 auto;justify-content:center;min-height:46px} /* Beaucoup de boutons (« Mon espace »…) : pas de pied collé en bas, une grille de 2 colonnes dans le défilement */ .backdrop > .modal > footer:has(> :nth-child(4)){position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:12px 0 0;border-top:1px solid var(--trait)} .backdrop > .modal > footer:has(> :nth-child(4)) .btn{min-width:0;white-space:normal;text-align:center;line-height:1.2} } @media (max-width:430px){ .site-header .brand > div{display:none} /* icône seule : « Se connecter » et « Essayer » tiennent sur la ligne */ } /* ---- Écrans tactiles : boutons des cartes de tâches à 44 px au moins ---- */ @media (pointer:coarse){ .task-open{width:44px;height:44px} .task-menu{min-width:44px;min-height:44px} .sim-qty button{width:44px;height:44px} }