@import url("./visual-tokens.css");
:root { font-family:var(--interface-font);color:var(--ink);background:var(--cream) }
*{box-sizing:border-box} body{margin:0;min-width:320px} button,input,select,textarea{font:inherit}
.shell{min-height:100vh;display:grid;grid-template-columns:240px 1fr}
.sidebar{position:sticky;top:0;height:100vh;background:var(--navy);color:#fff;padding:30px 20px;display:flex;flex-direction:column;z-index:5}
.brand{color:#fff;text-decoration:none;margin:0 12px 42px}.brand span{display:block;color:var(--orange);font-family:Georgia,serif;font-size:43px;line-height:.9;letter-spacing:-4px}.brand small{display:block;margin-top:10px;text-transform:uppercase;letter-spacing:.18em;font-size:9px;color:#dce4e6}
.sidebar nav{display:grid;gap:8px}.nav-link{display:flex;align-items:center;gap:12px;color:#dbe4e7;text-decoration:none;padding:12px 14px;border-radius:9px;font-size:14px}.nav-link span{width:21px;text-align:center}.nav-link:hover,.nav-link.active{background:rgba(255,255,255,.1);color:#fff}.nav-link.active{box-shadow:inset 3px 0 var(--orange)}
.sidebar-foot{margin-top:auto;padding:16px 12px;border-top:1px solid rgba(255,255,255,.13);font-size:12px;display:grid;grid-template-columns:10px 1fr;gap:3px 8px;color:#e7eeee}.sidebar-foot small{grid-column:2;color:#9fb0b8}.live-dot{width:8px;height:8px;border-radius:50%;background:#71c296;margin-top:4px}
.topbar{height:90px;display:flex;align-items:center;gap:18px;padding:0 42px;background:rgba(246,242,234,.92);backdrop-filter:blur(14px);position:sticky;top:0;z-index:4;border-bottom:1px solid rgba(16,43,59,.08)}.topbar h1{margin:0;font-family:Georgia,serif;font-weight:500;font-size:30px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:9px;margin:0 0 4px;color:var(--orange);font-weight:800}.top-actions{margin-left:auto;display:flex;align-items:center;gap:13px}.sync-state{font-size:12px;color:var(--muted)}.menu-button{display:none}
.page{padding:32px 42px 64px;max-width:1520px;margin:auto}.hero{display:flex;gap:20px;align-items:end;justify-content:space-between;margin-bottom:24px}.hero h2{font-family:Georgia,serif;font-size:34px;font-weight:500;margin:0 0 7px}.hero p{margin:0;color:var(--muted);max-width:700px}
.button{border:0;border-radius:8px;padding:10px 15px;background:var(--navy);color:#fff;cursor:pointer;font-weight:700;font-size:13px}.button:hover{filter:brightness(1.08)}.button.orange{background:var(--orange)}.button.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}.button.danger{background:#fff0ed;color:var(--red)}.button.small{padding:7px 10px;font-size:12px}
.toolbar{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:13px;display:flex;gap:10px;margin-bottom:20px;position:sticky;top:106px;z-index:3}.toolbar input,.toolbar select{background:#fff;border:1px solid var(--line);border-radius:7px;padding:9px 11px;color:var(--ink)}.toolbar input{flex:1;min-width:160px}
.status{font-size:10px;border-radius:20px;padding:5px 8px;background:#e6f4ec;color:var(--green);font-weight:800}.status.warn{background:#fff0ed;color:var(--red)}.status.off{background:#e9e9e7;color:#697074}.empty{padding:55px;border:1px dashed var(--line);border-radius:12px;text-align:center;color:var(--muted)}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:22px;margin-bottom:18px}.panel h3{margin:0;font-family:Georgia,serif;font-size:22px;font-weight:500}.panel-head{display:flex;align-items:center;gap:13px;margin-bottom:18px}.panel-head p{margin:3px 0 0;color:var(--muted);font-size:12px}.panel-head .panel-actions{margin-left:auto}
.tier-table,.order-table{width:100%;border-collapse:collapse}.tier-table th,.tier-table td,.order-table th,.order-table td{padding:11px 9px;border-top:1px solid var(--line);text-align:left;font-size:12px}.tier-table th,.order-table th{font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}.tier-table input{width:100%;max-width:120px;border:1px solid var(--line);border-radius:6px;padding:7px}.order-table tr[data-order]{cursor:pointer}.order-table tr[data-order]:hover{background:#faf6ef}.money{text-align:right!important;font-variant-numeric:tabular-nums}.order-status{display:inline-block;border-radius:16px;background:#fff3df;color:#80531c;padding:4px 8px;font-weight:700}
.publication-layout{display:grid;grid-template-columns:minmax(260px,360px) 1fr;gap:20px}.section-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}.section-list li{border:1px solid var(--line);border-radius:8px;padding:10px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;background:#fff}.drag-buttons{display:flex;gap:4px}.drag-buttons button{border:1px solid var(--line);background:#fff;border-radius:5px;cursor:pointer}.language-tabs{display:flex;gap:6px;margin:15px 0}.language-tabs button{border:1px solid var(--line);padding:8px 12px;border-radius:20px;background:#fff;cursor:pointer}.language-tabs button.active{background:var(--navy);color:#fff}.pdf-preview{min-height:540px;background:#d8d2c8;border-radius:10px;display:grid;place-items:center;overflow:hidden}.pdf-preview iframe{width:100%;height:650px;border:0}.preview-placeholder{text-align:center;color:#66747b}.preview-placeholder strong{font-family:Georgia,serif;font-size:24px;display:block;color:var(--ink);margin-bottom:8px}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:grid;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800}.field input,.field select,.field textarea{border:1px solid var(--line);border-radius:7px;padding:10px;background:#fff}.field textarea{min-height:88px;resize:vertical}.photo-input{display:grid;grid-template-columns:90px 1fr;gap:12px;align-items:center}.photo-input img{width:90px;height:90px;object-fit:contain;background:#eee8dd;border-radius:8px}
.dialog-head{display:flex;align-items:flex-start;gap:15px;margin-bottom:20px}.dialog-head h2{font-family:Georgia,serif;margin:0;font-weight:500}.dialog-head button{margin-left:auto}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px;border-top:1px solid var(--line);padding-top:16px}.hint{font-size:11px;color:var(--muted)}.warning-box{background:#fff0ed;color:#7b3f38;border-radius:8px;padding:10px;font-size:12px;margin-top:12px}
dialog{border:0;border-radius:14px;box-shadow:var(--shadow);padding:0;max-width:720px;width:calc(100% - 34px);color:var(--ink)}dialog::backdrop{background:rgba(7,23,32,.56);backdrop-filter:blur(3px)}dialog form{padding:24px}.order-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:15px 0}.order-summary div{background:var(--cream);border-radius:8px;padding:12px}.order-summary small{display:block;color:var(--muted)}
#toast{position:fixed;right:25px;bottom:25px;background:var(--navy);color:#fff;border-radius:8px;padding:12px 16px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s;z-index:20;font-size:13px}#toast.show{opacity:1;transform:none}
.composer-hero{align-items:center}.hero-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.composer-summary{display:grid;grid-template-columns:repeat(4,minmax(110px,1fr));gap:10px;margin-bottom:14px}.composer-stat{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:flex;align-items:baseline;justify-content:space-between}.composer-stat span{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.composer-stat strong{font-family:Georgia,serif;font-size:23px;font-weight:500}.composer-stat.warn{border-color:#e7a08f;background:#fff5f1}.composer-warning{margin:0 0 14px;padding:10px 13px;border-radius:8px;background:#fff0ed;color:#7b3f38;font-size:12px}
.composer{display:grid;grid-template-columns:235px minmax(500px,1fr) 300px;gap:16px;align-items:start}.composer .panel{margin:0;padding:16px}.composer-left,.composer-inspector{position:sticky;top:106px;max-height:calc(100vh - 126px);overflow:auto}.composer-label{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:800;margin:14px 0 7px}.pages-label{margin-top:20px}.composer-sections{display:grid;gap:5px}.composer-section-row{display:grid;grid-template-columns:18px 1fr auto;align-items:center;gap:7px;font-size:11px;border-bottom:1px solid #ece7de;padding:6px 0}.composer-section-row .drag-buttons button{padding:2px 4px}.page-thumbnails{display:grid;gap:7px}.page-thumb{border:1px solid var(--line);border-radius:8px;background:#fff;padding:9px;text-align:left;display:grid;grid-template-columns:25px 1fr;gap:2px 7px;color:var(--ink);cursor:pointer}.page-thumb:hover,.page-thumb.active{border-color:var(--orange);box-shadow:inset 3px 0 var(--orange)}.page-thumb>span{grid-row:1/3;font-size:9px;color:var(--orange);font-weight:800}.page-thumb strong{font-family:Georgia,serif;font-size:12px;line-height:1.1}.page-thumb small{font-size:9px;color:var(--muted)}
.composer-stage{min-width:0}.page-canvas{background:#d8d2c8;border-radius:12px;padding:22px;box-shadow:inset 0 0 0 1px rgba(16,43,59,.08)}.canvas-foot{display:flex;justify-content:space-between;align-items:center;padding:9px 3px;color:var(--muted);font-size:10px}
.inspector-head{margin-bottom:16px}.inspector-head h3{margin:0;font-family:Georgia,serif;font-size:21px;font-weight:500}.inspector-field{margin-bottom:12px}.inspector-field textarea{min-height:78px}.inspector-field small{font-size:9px;color:var(--muted)}.text-warn{color:var(--red)!important;font-weight:800}.inspector-rule{border:0;border-top:1px solid var(--line);margin:18px 0}
.wide-dialog{max-width:950px}.media-upload{display:grid;grid-template-columns:1.4fr 1fr 1fr auto;gap:10px;align-items:end;background:var(--cream);padding:13px;border-radius:9px;margin-bottom:10px}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:11px;max-height:520px;overflow:auto;padding:4px}.media-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff;padding-bottom:10px}.media-card>img{width:100%;height:125px;object-fit:cover;background:#eee8dd}.media-card>div{padding:9px 10px 4px}.media-card strong,.media-card small{display:block}.media-card small{color:var(--muted);font-size:9px;margin:3px 0 7px}.media-card>.button{margin-left:10px}.quality{display:inline-block;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;border-radius:12px;padding:4px 6px}.quality.print{background:#e6f4ec;color:var(--green)}.quality.screen{background:#fff3df;color:#80531c}.quality.low{background:#fff0ed;color:var(--red)}.quality.unknown{background:#ececea;color:#666}
@media(max-width:1200px){.composer{grid-template-columns:210px 1fr}.composer-inspector{position:static;grid-column:1/-1;max-height:none}.composer-left{top:100px}}
@media(max-width:900px){.shell{grid-template-columns:1fr}.sidebar{position:fixed;transform:translateX(-100%);transition:.2s;width:240px}.shell.menu-open .sidebar{transform:none}.menu-button{display:block;border:0;background:transparent;font-size:21px}.topbar{padding:0 20px}.page{padding:24px 20px}.publication-layout{grid-template-columns:1fr}.top-actions .sync-state{display:none}.composer{grid-template-columns:1fr}.composer-left{position:static;max-height:none}.page-thumbnails{grid-template-columns:repeat(2,1fr)}.composer-inspector{grid-column:auto}.media-upload{grid-template-columns:1fr 1fr}.composer-summary{grid-template-columns:1fr 1fr}}
@media(max-width:580px){.toolbar{flex-wrap:wrap;top:90px}.toolbar input{flex-basis:100%}.field-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.topbar .button{display:none}.hero-actions .button{display:inline-block}.page-canvas{padding:8px}.media-upload{grid-template-columns:1fr}.page-thumbnails{grid-template-columns:1fr}.composer-summary{grid-template-columns:1fr 1fr}}

/* Compositeur PDF exact et versions vivantes */
.version-bar{display:flex;align-items:end;gap:8px;background:var(--paper);border:1px solid var(--line);border-radius:11px;padding:12px 14px;margin-bottom:12px;flex-wrap:wrap}.version-bar .field{min-width:230px;margin-right:auto}.version-bar select{min-width:230px}.version-bar .button:disabled{opacity:.45;cursor:not-allowed}
.composer-summary{grid-template-columns:repeat(3,minmax(110px,1fr))}.composer-warning,.composer-error{margin:0 0 14px;padding:10px 13px;border-radius:8px;font-size:12px}.composer-warning{background:#fff8e8;color:#795b20}.composer-error{background:#fff0ed;color:#7b3f38;border:1px solid #e7a08f}
.pdf-live-preview{aspect-ratio:16/9;background:#d8d2c8;border-radius:12px;padding:12px;box-shadow:inset 0 0 0 1px rgba(16,43,59,.08);overflow:hidden}.pdf-live-preview iframe{width:100%;height:100%;border:0;background:var(--cream);border-radius:4px}.preview-loading{height:100%;display:grid;place-content:center;text-align:center;gap:7px;color:var(--muted)}.preview-loading strong{font-family:Georgia,serif;font-size:21px;color:var(--ink);font-weight:500}.preview-loading span{font-size:11px}
.publication-products{display:grid;gap:5px;max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:8px;padding:7px;background:#fff}.publication-products>div{display:grid;grid-template-columns:18px 1fr auto;gap:6px;align-items:center;padding:5px;border-bottom:1px solid #eee9e0;font-size:10px}.publication-products>div:last-child{border-bottom:0}
.archive-list{display:grid;gap:8px}.archive-list>div{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:9px;padding:12px}.archive-list span{display:grid;gap:3px}.archive-list small{color:var(--muted)}.archive-list .button{margin-left:auto}
@media(max-width:900px){.version-bar .field{width:100%}.composer-summary{grid-template-columns:repeat(3,1fr)}}
@media(max-width:580px){.composer-summary{grid-template-columns:1fr}.pdf-live-preview{padding:6px}.version-bar .button{display:inline-block}}

/* Fiche produit et variantes */
.variant-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:24px 0 12px}.variant-head h3{margin:0;font-family:Georgia,serif;font-weight:500}.common-photo-check{grid-column:2/5;font-size:10px;color:var(--muted);align-self:center}.archived-panel{opacity:.7}.panel-head .status{margin-bottom:6px}.product-general .photo-input img[src=""]{visibility:hidden}
.archived-variants{margin-top:12px;border:1px solid var(--line);border-radius:8px;padding:10px;font-size:11px}.archived-variants>div{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--line)}.archived-variants>div .button{margin-left:auto}
@media(max-width:1000px){.common-photo-check{grid-column:2/4}}
@media(max-width:620px){.common-photo-check{grid-column:1/-1}}

/* Usable controls and responsive editing, shared by every business workflow. */
main,.field,.field-grid>*{min-width:0}
.field input,.field select,.field textarea{min-width:0;width:100%;color:var(--ink)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
.button.orange{color:var(--navy)}
.button:disabled,.drag-buttons button:disabled{opacity:.45;cursor:default;filter:none}
.eyebrow{color:#a44827}
.hero h2{font-size:30px}.hero{align-items:center}
.menu-backdrop{display:none}

.status{line-height:1.45}
.table-scroll{overflow-x:auto}
.order-link{background:none;border:0;padding:0;color:var(--ink);font-weight:750;text-align:left;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.order-list{min-width:590px}.order-lines{min-width:410px}
.order-summary strong{font-size:13px;overflow-wrap:anywhere}
.order-addresses{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}
.order-addresses>div{border:1px solid var(--line);border-radius:8px;padding:13px}
.order-addresses small{font-weight:750;color:var(--muted);text-transform:uppercase;font-size:10px;letter-spacing:.06em}
.order-addresses p{line-height:1.55;font-size:13px;margin:7px 0 0;overflow-wrap:anywhere}
.order-reference{font-size:13px}
.order-totals{margin:18px 0 22px auto;max-width:340px;font-size:13px}
.order-totals>div{display:flex;justify-content:space-between;gap:16px;padding:6px 0}
.order-totals dd{margin:0;font-variant-numeric:tabular-nums}.order-totals .total{border-top:1px solid var(--line);padding-top:10px;font-weight:750}
dialog{max-height:90dvh}#editor-dialog{max-width:1040px}#order-dialog{max-width:860px}
.dialog-actions{position:sticky;bottom:0;background:var(--paper);padding:16px 0;z-index:2;flex-wrap:wrap}
.dialog-actions .danger{margin-right:auto}
.product-tabs{display:flex;gap:6px;margin-bottom:22px;border-bottom:1px solid var(--line)}.product-tabs button{display:flex;align-items:center;gap:8px;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--muted);padding:12px 16px;cursor:pointer;font-weight:650;font-size:14px}.product-tabs button[aria-selected=true]{color:var(--navy);border-bottom-color:var(--orange)}.product-tabs button:focus-visible{outline:2px solid var(--navy);outline-offset:-2px}.product-editor-panel{border:0;padding:0;margin:0;min-width:0}.product-editor-panel[hidden]{display:none}.product-tabs .control-icon{width:18px;height:18px}
.form-message{flex:1 0 100%;margin:0 0 6px;padding:10px 12px;border-radius:6px;background:#fff0ed;color:#78392f;font-size:13px;line-height:1.5}
.action-dialog{max-width:480px}.action-message{font-size:14px;line-height:1.6}
.form-message.success{background:#e6f4ec;color:var(--green)}
.composer{grid-template-columns:210px minmax(0,1fr) 280px}
.composer-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
.composer-stat{gap:10px}.composer-stat strong{flex-shrink:0}
.section-name{border:0;background:none;padding:3px 0;text-align:left;font-size:inherit;color:var(--ink);cursor:pointer}
.section-name:hover{text-decoration:underline;text-underline-offset:3px}
.composer-section-row .drag-buttons button,.publication-products .drag-buttons button{min-width:26px;min-height:28px}
.language-tabs button{flex:1}.pdf-live-preview{min-height:0;width:100%}.preview-loading{overflow-wrap:anywhere;padding:12px}
.unassigned-products{display:grid;gap:12px}.unassigned-products .field{grid-template-columns:minmax(120px,1fr) minmax(180px,1fr);align-items:center}.unassigned-products h3{font-size:21px}
.archived-media{margin-top:18px}.archived-media summary{cursor:pointer;font-size:13px;font-weight:700;padding:10px 0}
@media(max-width:1450px){.composer{grid-template-columns:210px minmax(0,1fr)}.composer-inspector{grid-column:2;position:static;max-height:none}.composer-hero{align-items:flex-start;flex-direction:column}.hero-actions{justify-content:flex-start}}
@media(max-width:900px){.sidebar{visibility:hidden;z-index:8}.shell.menu-open .sidebar{visibility:visible}.shell.menu-open .menu-backdrop{display:block;position:fixed;inset:0;background:rgba(7,23,32,.45);border:0;z-index:7}.composer{grid-template-columns:minmax(0,1fr)}.composer-left{position:static;max-height:280px}.composer-inspector{grid-column:1}.hero{align-items:flex-start;flex-wrap:wrap}}
@media(max-width:580px){.topbar{gap:10px;padding:0 14px}.topbar h1{font-size:25px}.topbar .button{display:block;font-size:10px;padding:8px;max-width:112px}.page{padding:22px 14px}.hero h2{font-size:28px}.toolbar select{min-width:0;flex:1}.catalog-grid{grid-template-columns:minmax(0,1fr)}.order-list{min-width:480px}.order-summary,.order-addresses{grid-template-columns:1fr}.order-summary{gap:6px}.order-summary div{padding:10px}.order-totals{max-width:none}.dialog-actions{bottom:0}.dialog-actions .button{flex:1}.dialog-actions .danger{flex-basis:100%}dialog form{padding:16px}.composer-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.composer-stat{padding:10px;display:block}.composer-stat strong{display:block;font-size:21px}.version-bar select,.version-bar .field{min-width:0;width:100%}.photo-input{grid-template-columns:70px minmax(0,1fr)}.photo-input img{width:70px;height:70px}.media-upload input{min-width:0;width:100%}.unassigned-products .field{grid-template-columns:1fr}.page-thumbnails{grid-template-columns:1fr 1fr}.canvas-foot{gap:10px;align-items:flex-start}.canvas-foot span{flex:1}}
