
.dz-brands-page{padding:22px 26px;max-width:1500px;margin:0 auto;color:#20202a}
.dz-brand-kicker{font-size:9px;letter-spacing:1.5px;font-weight:800;color:#7440e8}
.dz-brand-hero h1{margin:6px 0 8px;font-size:28px}
.dz-brand-hero p{margin:0;color:#777;font-size:12px;max-width:650px}
.dz-brand-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:12px 0 14px}
.dz-brand-toolbar-left{display:flex;align-items:center;gap:8px;flex:1;min-width:0}
.dz-brand-search{flex:1 1 420px;height:42px;display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #dddde6;border-radius:10px;padding:0 10px;box-sizing:border-box}
.dz-brand-search span{font-size:19px;color:#777}
.dz-brand-search input{border:0;outline:0;flex:1;min-width:0;background:transparent;color:#222;font-size:11px}
.dz-brand-search button{border:0;background:transparent;color:#888;font-size:18px;cursor:pointer}
.dz-brand-filter,.dz-brand-refresh{border:1px solid #ddd;background:#fff;color:#222;border-radius:9px;padding:10px 13px;cursor:pointer;font-size:10px;white-space:nowrap}
.dz-brand-filter:hover,.dz-brand-refresh:hover{border-color:#7440e8;color:#7440e8}
.dz-brand-table-head{margin:8px 0 11px}
.dz-brand-table-head h2{margin:5px 0 2px;font-size:17px}
.dz-brand-table-head small{font-size:9px;color:#888}
.dz-brand-table-shell{width:100%;overflow:auto;border:1px solid #e6e6ed;border-radius:14px;background:#fff}
.dz-brand-table{width:100%;min-width:780px;border-collapse:collapse;font-size:10px}
.dz-brand-table th{background:#fafafd;color:#777;text-align:left;padding:14px;border-bottom:1px solid #e7e7ee;font-weight:800}
.dz-brand-table td{padding:14px;border-bottom:1px solid #eeeef2;white-space:nowrap}
.dz-brand-name{display:flex;align-items:flex-start;gap:8px}
.dz-brand-name>div{min-width:0;display:grid;gap:2px}
.dz-brand-name small{display:block;font-size:9px;color:#888;font-weight:500;white-space:normal;max-width:420px}
.dz-brand-slug{font-family:ui-monospace,monospace}
.dz-brand-logo{width:34px;height:34px;border-radius:8px;background:#eee9ff;color:#7440e8;display:grid;place-items:center;font-weight:700;font-size:12px;overflow:hidden;flex:0 0 34px}
.dz-brand-logo img{width:100%;height:100%;object-fit:cover}
.dz-brand-status{display:inline-block;padding:5px 9px;border-radius:999px;font-size:8px;font-weight:800}
.dz-brand-status.active{background:#e6f7ec;color:#267445}
.dz-brand-status.inactive{background:#eeeef2;color:#777}
.dz-brand-featured{display:inline-block;margin-left:8px;background:#eee9ff;color:#7440e8;font-size:8px;font-weight:800;padding:3px 7px;border-radius:999px;vertical-align:middle}
.dz-brand-actions{display:flex;gap:6px}
.dz-brand-actions button{border:1px solid #ddd;background:#fff;color:#333;border-radius:7px;padding:6px 9px;font-size:9px;cursor:pointer}
.dz-brand-actions button:hover{border-color:#7440e8;color:#7440e8}
.dz-brand-actions .delete:hover{border-color:#d33;color:#d33}
.dz-brand-empty{text-align:center;padding:28px 16px;color:#888;font-size:11px}
.dz-brand-add-wrap{display:flex;justify-content:flex-end;margin-top:14px}
.dz-brand-add{border:1px dashed #b8a8e8;background:#faf8ff;color:#7440e8;border-radius:11px;padding:12px 16px;display:inline-flex;align-items:center;gap:9px;cursor:pointer}
.dz-brand-add span{font-size:20px}
.dz-brand-add b{font-size:10px}
.dz-brand-add small{font-size:8px;color:#888}

.dz-brand-modal{position:fixed;inset:0;z-index:100000;display:grid;place-items:center}
.dz-brand-modal-stack{z-index:100010}
.dz-brand-backdrop{position:absolute;inset:0;background:#08080d99;backdrop-filter:blur(4px)}
.dz-brand-modal-panel{position:relative;width:min(520px,calc(100vw - 28px));max-height:88vh;overflow:auto;background:#fff;color:#222;border-radius:16px;box-shadow:0 25px 70px #0005}
.dz-brand-modal-head{padding:18px 20px;border-bottom:1px solid #e7e7ee;display:flex;justify-content:space-between}
.dz-brand-modal-head span{font-size:8px;letter-spacing:1.4px;color:#7440e8;font-weight:800}
.dz-brand-modal-head h2{margin:5px 0 0;font-size:17px}
.dz-brand-close{border:0;background:#f1f1f5;color:#222;width:32px;height:32px;border-radius:8px;font-size:21px;cursor:pointer}
.dz-brand-modal-body{padding:20px}
.dz-brand-modal-foot{padding:13px 20px;border-top:1px solid #e7e7ee;display:flex;justify-content:flex-end;gap:8px}
.dz-brand-btn{border:1px solid #ddd;background:#fff;color:#222;border-radius:8px;padding:9px 13px;cursor:pointer}
.dz-brand-btn.primary{background:#7440e8;color:#fff;border-color:#7440e8}
.dz-brand-btn.danger{background:#d63b3b;color:#fff;border-color:#d63b3b}
.dz-brand-form label{display:grid;gap:5px;margin-bottom:11px;font-size:9px;font-weight:600}
.dz-brand-form input,.dz-brand-form select,.dz-brand-form textarea{display:block;width:100%;box-sizing:border-box;height:35px;border:1px solid #dddde5;border-radius:8px;padding:0 9px;background:#fff;color:#222;font:inherit}
.dz-brand-form textarea{height:auto;min-height:84px;padding:10px;resize:vertical}
.dz-brand-checkbox-label{display:flex!important;align-items:center;gap:8px;cursor:pointer}
.dz-brand-checkbox-label input{width:16px!important;height:16px!important;margin:0!important}
.dz-brand-status-msg{display:block;margin-top:6px;font-size:9px;color:#7440e8}
.dz-brand-image-editor{display:grid;grid-template-columns:110px 1fr;gap:14px;align-items:start;padding:12px;border:1px solid #e5e5ec;border-radius:11px;background:#fafafd;margin-bottom:12px}
.dz-brand-image-preview{width:110px;height:82px;border-radius:9px;overflow:hidden;background:#ececf2;display:grid;place-items:center;color:#888;font-size:9px;text-align:center}
.dz-brand-image-preview img{width:100%;height:100%;object-fit:contain;background:#fff}
.dz-brand-image-controls b{font-size:10px}
.dz-brand-image-controls p{font-size:9px;color:#888;line-height:1.45;margin:5px 0 10px}
.dz-brand-image-buttons{display:flex;flex-wrap:wrap;gap:7px}
.dz-brand-image-buttons .dz-brand-btn{font-size:8px;padding:8px 9px}
.dz-existing-brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dz-existing-brand-item{border:1px solid #ddd;background:#fff;border-radius:9px;padding:6px;cursor:pointer;color:#333}
.dz-existing-brand-item img{width:100%;height:70px;object-fit:cover;border-radius:6px;display:block}
.dz-existing-brand-item span{display:block;font-size:8px;margin-top:5px;text-align:left}
.dz-brand-empty-image{font-size:10px;color:#888}
.dz-brand-detail{display:grid;gap:9px}
.dz-brand-detail div{background:#f6f6f9;border-radius:9px;padding:13px}
.dz-brand-detail small{display:block;color:#888;font-size:8px}
.dz-brand-detail b{display:block;margin-top:4px;font-size:11px;word-break:break-word}
.dz-brand-detail-image{border-radius:10px;overflow:hidden;background:#f4f4f8;height:160px}
.dz-brand-detail-image img{width:100%;height:100%;object-fit:contain;display:block;background:#fff}
.dz-brand-warning{padding:15px;border-radius:10px;background:#fff2f2;color:#8d2424}
.dz-brand-warning p{font-size:10px;margin-bottom:0}

.dark .dz-brands-page{color:#f4f4f6}
.dark .dz-brand-hero p,.dark .dz-brand-table-head small,.dark .dz-brand-empty,.dark .dz-brand-name small{color:#aaa}
.dark .dz-brand-search,.dark .dz-brand-filter,.dark .dz-brand-refresh,.dark .dz-brand-table-shell{background:#191920;border-color:#373743;color:#eee}
.dark .dz-brand-search input{color:#fff}
.dark .dz-brand-table th{background:#20202a;color:#aaa;border-color:#34343f}
.dark .dz-brand-table td{border-color:#2d2d36}
.dark .dz-brand-actions button{background:#20202a;color:#eee;border-color:#3a3a46}
.dark .dz-brand-add{background:#221e30;border-color:#6855a1}
.dark .dz-brand-modal-panel{background:#15151c;color:#f5f5f7}
.dark .dz-brand-modal-head,.dark .dz-brand-modal-foot{border-color:#343440}
.dark .dz-brand-close{background:#292933;color:#fff}
.dark .dz-brand-btn{background:#1c1c24;color:#fff;border-color:#3b3b47}
.dark .dz-brand-btn.primary{background:#7440e8;border-color:#7440e8}
.dark .dz-brand-form input,.dark .dz-brand-form select,.dark .dz-brand-form textarea{background:#20202a;color:#fff;border-color:#3b3b47}
.dark .dz-brand-detail div{background:#23232c}
.dark .dz-brand-warning{background:#351d20;color:#ffb0b0}
.dark .dz-brand-image-editor{background:#20202a;border-color:#3b3b47}
.dark .dz-brand-image-preview{background:#2b2b35}
.dark .dz-existing-brand-item{background:#20202a;color:#fff;border-color:#3b3b47}

@media(max-width:650px){
  .dz-brands-page{padding:14px}
  .dz-brand-search{min-width:100px}
  .dz-brand-image-editor{grid-template-columns:1fr}
  .dz-brand-image-preview{width:100%;height:130px}
  .dz-existing-brand-grid{grid-template-columns:repeat(2,1fr)}
}
