/* v7 — Section design page (admin). The header rules that used to live here moved to v8.css. */
/* =====================================================================
   v7 — Section design page: Copy / Apply / Templates panel (admin only)
   Logical properties only, so it is correct in LTR (English) and RTL (Pashto, Dari).
   ===================================================================== */
.dz-tools{margin-top:22px}
.dz-tools>summary{cursor:pointer;font-weight:800;font-size:16px;color:var(--secondary);list-style:none;display:flex;align-items:center;gap:8px}
.dz-tools>summary::-webkit-details-marker{display:none}
.dz-tools>summary::before{content:"▸";display:inline-block;transition:transform .2s}
.dz-tools[open]>summary::before{transform:rotate(90deg)}
html[dir="rtl"] .dz-tools>summary::before{content:"◂"}
html[dir="rtl"] .dz-tools[open]>summary::before{transform:rotate(-90deg)}
.dz-tools h3{font-size:15px;margin:18px 0 10px;color:var(--secondary)}
.dz-tools .dzp-hint{display:block;margin-top:4px;color:var(--muted)}
.dzp-apply{display:grid;gap:12px}
.dzp-mode{border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin:0;display:grid;gap:10px;min-width:0}
.dzp-mode>legend{font-weight:800;font-size:13px;padding-inline:6px}
.dzp-mode .dz-check{display:flex;align-items:center;gap:8px;font-weight:700}
.dzp-mode select{width:100%}
.dzp-multi-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:8px}
.dzp-checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.dzp-checks .dz-check{background:#f5f8fa;border-radius:10px;padding:8px 10px}
.dzp-checks .dz-check.is-off{opacity:.45}
.dzp-status{min-height:1.4em;margin:0;font-size:13px;color:var(--muted)}
.dzp-status.is-err{color:#b42318;font-weight:700}
.dzp-prev-wrap{margin-top:12px;border:1px dashed var(--line-strong,#cfd9df);border-radius:14px;padding:12px;overflow:hidden}
.dzp-prev-title{margin:0 0 6px;font-size:13px}
.dzp-prev-title small{display:block;color:var(--muted)}
.dzp-notes{margin:0 0 10px;padding-inline-start:18px;font-size:12px;color:#8a5a00}
.dzp-notes:empty{display:none}
#dzApplyPrev{border-radius:12px;--dz-pad:28px}
#dzApplyPrev .card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.dzp-undo{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;background:#fff8e6;border:1px solid #f1d98f;border-radius:12px;padding:10px 14px;margin-bottom:14px;font-size:13px}
.dzp-tpl-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.dzp-tpl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:#fff}
.dzp-sw{width:38px;height:38px;border-radius:10px;border:3px solid;flex:none}
.dzp-tpl-main{min-width:0}
.dzp-tpl-main strong{display:block;overflow-wrap:anywhere}
.dzp-tpl-main small{color:var(--muted)}
.dzp-tpl-actions,.dzp-tpl-manage{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.dzp-rename{display:flex;gap:6px;flex:1 1 220px;min-width:0}
.dzp-rename input{flex:1;min-width:0}
.dzp-empty{color:var(--muted);font-size:13px}
.dzp-dialog{border:0;border-radius:18px;padding:22px;max-width:min(480px,calc(100vw - 32px));width:100%;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.dzp-dialog::backdrop{background:rgba(10,25,35,.55)}
.dzp-dialog h3{margin:0 0 10px}
.dzp-dialog ul{margin:0 0 10px;padding-inline-start:20px}
.dzp-dialog input[type=text]{width:100%;padding:11px 12px;border:1px solid #dce3e8;border-radius:9px}
.dzp-warn{background:#fff4f2;border:1px solid #f6d0cc;color:#8f2a22;border-radius:10px;padding:9px 12px;font-size:13px}
.dzp-dialog .dz-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;margin-top:14px}
.dzp-toast{position:fixed;inset-inline:16px;bottom:18px;max-width:420px;margin-inline:auto;background:#12384a;color:#fff;border-radius:12px;padding:12px 16px;box-shadow:0 14px 40px rgba(0,0,0,.3);z-index:300;font-size:14px}
.dzp-toast.is-err{background:#8f2a22}
@media(max-width:760px){.dzp-tpl-actions .btn,.dzp-multi-bar .btn{flex:1 1 auto}.dzp-checks{grid-template-columns:1fr 1fr}}