*{box-sizing:border-box}body{margin:0;font-family:Arial;background:#f5f6f4;color:#1c2822}header{padding:16px 5%;background:#0b392b;color:#fff;display:flex;gap:18px}header b{color:#e8c56f}header a{margin-left:auto;color:#fff}main{width:min(1100px,94%);margin:25px auto}#login,form,.row{background:#fff;border:1px solid #ddd;border-radius:14px;padding:16px;margin:12px 0}#login{max-width:500px;margin:60px auto}input,select,textarea{width:100%;padding:11px;margin-top:5px;border:1px solid #ccd2ce;border-radius:8px}label{display:block;font-weight:700;margin:11px 0}.check{display:flex;gap:8px;align-items:center}.check input{width:auto}.tabs{display:flex;gap:8px;flex-wrap:wrap}.tabs button,.panel>button,form button,.row button,#login button{padding:10px 13px;border:0;border-radius:8px;font-weight:800}.tabs .on,.panel>button,form button,#login button{background:#0b392b;color:#fff}.panel{margin-top:22px}.row{display:flex;align-items:center;gap:10px}.row .grow{flex:1}.children{margin-left:25px;border-left:2px solid #ddd;padding-left:12px}.muted{color:#6c756f;font-size:13px}@media(max-width:600px){.row{align-items:flex-start;flex-wrap:wrap}.row .grow{flex-basis:100%}.children{margin-left:8px}}
.help{display:block;color:#6c756f;font-size:12px;font-weight:400;margin-top:5px}
.variant-box{border:1px solid #d9dfdb;border-radius:12px;padding:14px;margin:12px 0;background:#fafbf9}
.variant-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.variant-head button{background:#e8eee9;color:#163629}
.color-row{display:grid;grid-template-columns:1fr 90px 2fr auto;gap:8px;align-items:end;padding:10px 0;border-top:1px solid #e3e7e4}
.color-row label{margin:0}
.color-row input[type="color"]{height:42px;padding:3px}
.color-row .remove-color{background:#fff0ef;color:#a52c26;border:1px solid #edc7c4}
@media(max-width:700px){
  .color-row{grid-template-columns:1fr 90px}
  .color-row .image-field{grid-column:1/-1}
  .color-row .remove-color{grid-column:1/-1}
}

.cat-products{margin:8px 0 0 18px;padding-left:12px;border-left:2px dashed #d7ddd9}
.cat-product-row{display:flex;align-items:center;gap:10px;background:#f8faf8;border:1px solid #e1e5e2;border-radius:10px;padding:10px;margin:7px 0}
.cat-product-row .grow{flex:1}
.cat-product-row .prod-thumb{width:44px;height:54px;object-fit:contain;background:white;border:1px solid #e2e6e3;border-radius:8px}
.cat-product-row button{padding:8px 10px}
.cat-empty{margin:8px 0 0 18px;color:#8a928d;font-size:12px}
.cat-tools{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
@media(max-width:600px){
  .cat-product-row{flex-wrap:wrap}
  .cat-product-row .grow{flex-basis:calc(100% - 64px)}
  .cat-product-row button{flex:1}
}

.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.editor-actions{display:flex;gap:10px;margin-top:18px}
.editor-actions button:first-child{background:#0b392b;color:#fff}
.editor-actions button:last-child{background:#e8ece9;color:#24352d}
#editorForm{max-width:850px;margin:25px auto}
@media(max-width:650px){.two-fields{grid-template-columns:1fr}}

.tree-node{margin:8px 0}
.tree-category{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #dfe4e0;border-radius:12px;padding:12px}
.tree-symbol{width:28px;text-align:center;font-weight:900;color:#0b392b}
.tree-actions{display:flex;gap:6px;flex-wrap:wrap}
.tree-children{margin-left:30px;padding-left:18px;border-left:2px solid #d8dfda}
.tree-products{margin:6px 0 8px 45px;display:grid;gap:6px}
.tree-product{display:flex;align-items:center;gap:9px;background:#f7faf7;border:1px dashed #d5ddd8;border-radius:10px;padding:8px}
.tree-product img,.tree-thumb{width:38px;height:48px;object-fit:contain;background:#fff;border-radius:7px;border:1px solid #e2e6e3}
.tree-branch{font-weight:900;color:#718078}
#categoryEditorForm{max-width:850px;margin:25px auto}
@media(max-width:700px){
  .tree-category,.tree-product{flex-wrap:wrap}
  .tree-actions{width:100%}
  .tree-actions button{flex:1}
  .tree-children{margin-left:12px;padding-left:10px}
  .tree-products{margin-left:18px}
}

/* V8 catalogue simple */
.simple-node{margin:8px 0}
.simple-folder{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #dde3df;border-radius:12px;padding:8px 10px}
.simple-folder.opened{border-color:#b8c8c0}
.folder-main{display:flex;align-items:center;gap:8px;flex:1;text-align:left;background:transparent;color:#10251d;padding:6px;border:0}
.folder-main:hover{background:#f3f7f4}
.folder-main small{display:block;color:#748078;font-weight:400;margin-top:2px}
.chevron{width:18px;color:#52645b}.folder-icon{font-size:22px}
.simple-actions{display:flex;gap:6px}
.simple-content{margin-left:31px;padding-left:18px;border-left:2px solid #e0e6e2}
.simple-product{display:flex;align-items:center;gap:10px;margin:7px 0;background:#f8faf8;border:1px solid #e1e6e2;border-radius:10px;padding:9px}
.simple-product img,.simple-thumb{width:42px;height:50px;object-fit:contain;background:#fff;border:1px solid #e3e7e4;border-radius:8px;display:grid;place-items:center}
.simple-empty{padding:12px;color:#7d8781;font-size:13px}
@media(max-width:700px){
 .simple-folder,.simple-product{flex-wrap:wrap}
 .simple-actions{width:100%}
 .simple-actions button{flex:1}
 .simple-content{margin-left:12px;padding-left:9px}
}

.direct-category{background:#fff;border:1px solid #dce3de;border-radius:14px;margin:14px 0;overflow:hidden}
.direct-category-head{display:flex;align-items:center;gap:8px;padding:14px;background:#f7faf8;border-bottom:1px solid #e3e8e4}
.direct-category-head h2{margin:0 0 3px;font-size:20px}.direct-products{padding:8px 14px 14px}
.direct-product{display:flex;align-items:center;gap:10px;border-bottom:1px solid #edf0ee;padding:10px 0}
.direct-product img,.direct-thumb{width:48px;height:58px;object-fit:contain;background:#fff;border:1px solid #e0e5e1;border-radius:8px;display:grid;place-items:center}
.direct-empty{padding:16px 4px;color:#7d8781}.primary-small{background:#0b392b!important;color:#fff!important}
@media(max-width:700px){.direct-category-head,.direct-product{flex-wrap:wrap}.direct-category-head .grow,.direct-product .grow{flex-basis:100%}.direct-category-head button,.direct-product button{flex:1}}

/* V13 - Site & Livraison simplifié */
.site-admin-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}
.site-admin-head h1{margin:5px 0 5px;font-size:34px}
.section-kicker{font-size:11px;letter-spacing:.18em;font-weight:900;color:#b48621}
.settings-card{background:#fff;border:1px solid #dfe4e0;border-radius:16px;margin:16px 0;overflow:hidden}
.settings-title{padding:18px 20px;border-bottom:1px solid #e8ece9;background:#fafbf9}
.settings-title h2{margin:0 0 5px;font-size:20px}
.settings-title p{margin:0;color:#717c75;font-size:13px}
.settings-list{display:grid}
.setting-row{display:flex;align-items:center;gap:13px;padding:16px 20px;border-bottom:1px solid #edf0ee}
.setting-row:last-child{border-bottom:0}
.setting-icon{width:42px;height:42px;border-radius:10px;background:#eef4f0;color:#0b392b;display:grid;place-items:center;font-size:18px;font-weight:900;flex:0 0 auto}
.setting-copy strong{display:block;font-size:15px}
.setting-copy p{margin:4px 0 0;color:#737e77;font-size:12px;line-height:1.4}
.static-setting{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 20px}
.static-setting strong{font-size:15px}
.static-setting p{margin:4px 0 0;color:#737e77;font-size:12px}
.status-pill{padding:7px 11px;border-radius:999px;font-size:12px;font-weight:900}
.status-pill.active{background:#e7f5ec;color:#177a3d}

/* interrupteur */
.switch{position:relative;width:52px;height:30px;flex:0 0 auto}
.switch input{opacity:0;width:0;height:0}
.slider{position:absolute;inset:0;background:#d9dfdb;border-radius:999px;transition:.2s;cursor:pointer}
.slider:before{content:"";position:absolute;width:24px;height:24px;left:3px;top:3px;background:#fff;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.18);transition:.2s}
.switch input:checked + .slider{background:#0b392b}
.switch input:checked + .slider:before{transform:translateX(22px)}

@media(max-width:650px){
  .site-admin-head h1{font-size:28px}
  .setting-row{padding:14px}
  .setting-icon{width:38px;height:38px}
  .settings-title{padding:15px}
}

.login-msg{min-height:20px;margin-top:10px;color:#a12f28;font-weight:700}

.main-photo-preview{margin:10px 0}
.main-photo-preview img{display:block;max-width:220px;max-height:260px;object-fit:contain;border:1px solid #dde3df;border-radius:12px;background:#fff;padding:8px}

.editor-section{border:1px solid #dfe5e1;border-radius:12px;background:#fbfcfb;padding:14px;margin:14px 0}
.cv-preview{display:grid;place-items:center}
.cv-preview img{width:78px;height:78px;object-fit:contain;background:#fff;border:1px solid #dfe4e0;border-radius:9px}
.color-row{grid-template-columns:1fr 90px 2fr 86px auto}
@media(max-width:700px){
  .color-row{grid-template-columns:1fr 90px}
  .color-row .image-field,.cv-preview,.color-row .remove-color{grid-column:1/-1}
}

.storage-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:end;padding:10px 0;border-top:1px solid #e3e7e4}
.storage-row label{margin:0}
.storage-available{align-self:center}
.remove-storage{background:#fff0ef!important;color:#a52c26!important;border:1px solid #edc7c4!important}
@media(max-width:650px){.storage-row{grid-template-columns:1fr}.storage-available,.remove-storage{grid-column:1/-1}}

.storage-actions{display:flex;gap:7px;flex-wrap:wrap}
.storage-preset{background:#eef5f1!important;color:#0b3f30!important;border:1px solid #d7e4dc!important}

.universal-note{
  margin-bottom:16px;padding:12px 14px;border-radius:11px;
  background:#eef5f1;border:1px solid #d8e5dd;color:#0b3f30;
  font-size:12px;line-height:1.5;font-weight:700;
}

#characteristicsButtonText{font-weight:700}

button.danger{background:#fff0ef!important;color:#a52c26!important;border:1px solid #edc7c4!important}
button.danger:hover{background:#ffe1de!important}
#productCapacity{font-weight:700}

/* V36 - Double authentification */
#mfaChallenge,#mfaSettings{max-width:560px;margin:24px auto;background:#fff;border:1px solid #dfe5e1;border-radius:16px;padding:22px}
#mfaChallenge input,#mfaSettings input{width:100%;box-sizing:border-box;margin:8px 0 12px}
.mfa-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.mfa-status{padding:10px 12px;border-radius:10px;background:#eef5f1;color:#0b3f30;font-weight:700;margin:10px 0}
.mfa-status.warn{background:#fff7e8;color:#76510b}
#mfaQr img{display:block;max-width:220px;width:100%;margin:14px auto;background:#fff;padding:10px;border:1px solid #dfe5e1;border-radius:12px}
#mfaSecret{word-break:break-all;font-family:monospace;font-size:12px;background:#f5f7f6;padding:10px;border-radius:8px}