/* MOZAS · Admin materials library · V11 preview. Scoped to materials components. */
.materials-panel{overflow:hidden}
.materials-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:14px}
.materials-heading h2{margin:5px 0 4px;font-family:Georgia,serif;font-size:clamp(23px,2.2vw,30px);font-weight:500}
.materials-heading .materials-intro{max-width:660px;margin:0}
.material-banner{font-size:12px;line-height:1.6;color:#7b6038;background:#faf3e6;border:1px solid #eadcc7;padding:10px 13px;border-radius:9px;margin:12px 0 18px}
.material-summary{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 17px}
.material-summary .material-stat{padding:9px 13px;background:#f6f8f4;border:1px solid #ecf0e9;border-radius:9px;font-size:12px;color:#657268}
.material-summary strong{color:#2e4938;font-size:17px;margin-right:5px;font-variant-numeric:tabular-nums}
.material-controls{display:grid;grid-template-columns:minmax(190px,2fr) repeat(3,minmax(130px,1fr)) auto;gap:10px;align-items:end}
.material-control{display:flex;flex-direction:column;gap:5px;min-width:0;font-size:12px;font-weight:600;color:#56675a}
.material-control span b{color:#ab5f36}
.material-control input,.material-control select,.material-control textarea{width:100%;border:1px solid #dce3d9;border-radius:8px;padding:10px 11px;background:#fff;color:#24382b;font-size:13px;font-weight:400;min-width:0;min-height:39px}
.material-control input:focus,.material-control select:focus,.material-control textarea:focus{outline:2px solid #98b59d;outline-offset:0;border-color:#749477}
.material-control small{font-size:11px;line-height:1.45;color:#78857b;font-weight:400}
.material-filters-toggle{white-space:nowrap;min-height:39px;padding:10px 11px}
.material-advanced{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:12px 0 0;padding:14px;border:1px solid #e8ede5;border-radius:10px;background:#f9fbf7}
.material-table-heading{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin:20px 0 8px}
.material-table-heading p{font-size:12px;color:#66766a;margin:0}
.material-actions-secondary{display:flex;flex-wrap:wrap;gap:7px}
.material-actions-secondary .btn{padding:8px 11px;font-size:12px}
.material-import{position:relative;cursor:pointer}
.material-import input{display:none}
.material-table{min-width:810px}
.material-table th,.material-table td{padding:12px 9px;vertical-align:middle}
.material-table td:first-child{font-weight:400}
.material-table .material-name-cell{display:flex;align-items:center;gap:8px;min-width:145px}
.material-thumb{width:40px;height:40px;flex-shrink:0;background:#eaece7;border:1px solid #e0e6dc;border-radius:8px;display:grid;place-items:center;color:#8b9a8c;font-weight:600;font-size:11px;overflow:hidden}
.material-thumb img{width:100%;height:100%;object-fit:cover}
.material-table strong{display:block;color:#273d30;font-size:13px;font-weight:650}
.material-table small,.material-table .material-sub{display:block;color:#7b897e;font-size:11px;margin-top:4px;line-height:1.4}
.material-table .material-formats-mini{max-width:170px;color:#566459;font-size:12px;line-height:1.5}
.material-table .material-formats-mini small{margin:1px 0;color:#89938a}
.material-table .material-money{font-size:12px;font-variant-numeric:tabular-nums;color:#273d30;white-space:nowrap}
.material-table .material-money small{white-space:normal}
.material-table .material-action{white-space:nowrap;border:1px solid #d5e0d7;background:#fff;padding:7px 10px;border-radius:7px;color:#284636;font-size:12px;font-weight:600}
.material-table .material-action + .material-action{margin-left:5px}
.material-table .material-action:hover{background:#eff5ee}
.material-table .material-action:focus-visible{outline:2px solid #527657}
.material-status-on,.material-status-off{display:inline-block;padding:5px 8px;font-size:11px;border-radius:100px;white-space:nowrap}
.material-status-on{background:#e5f0e7;color:#376845}.material-status-off{background:#f0f0ed;color:#7b827a}
.material-empty{text-align:center;padding:34px 10px;color:#677469}
.material-empty strong{display:block;color:#2e4637;margin-bottom:6px}
.materials-footnote{margin:16px 0 0;color:#818d81;font-size:11px;line-height:1.6}
/* Native dialog keeps editor hidden when closed. */
.material-dialog{border:1px solid #dde5db;background:#fff;box-shadow:0 26px 90px #172b1d44;border-radius:15px;padding:0;width:min(880px,calc(100% - 32px));max-height:min(92vh,1100px);color:#26362a;overflow:hidden}
.material-dialog::backdrop{background:#14231ab0;backdrop-filter:blur(3px)}
.material-dialog form{display:flex;flex-direction:column;max-height:min(92vh,1100px)}
.material-dialog-head{padding:20px 25px 15px;border-bottom:1px solid #edf0ea;display:flex;justify-content:space-between;gap:16px;align-items:start}
.material-dialog-head h2{font:500 25px Georgia,serif;margin:4px 0}
.material-dialog-head .eyebrow{margin:0}
.material-icon-button{border:0;background:#f0f3ed;width:34px;height:34px;border-radius:50%;font-size:23px;line-height:1;color:#36503c;flex-shrink:0}
.material-dialog-body{padding:22px 25px;overflow-y:auto;overscroll-behavior:contain}
.material-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 16px;align-items:start}
.material-wide{grid-column:span 2}
.material-form-feedback{border:1px solid #f4c1b0;background:#fff2ec;border-radius:8px;padding:11px 14px;color:#a0482b;font-size:13px;line-height:1.55;margin:0 0 15px}
.material-divider{height:1px;background:#eaeee9;margin:21px 0}
.material-formats-header{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.material-formats-header h3{margin:0;font-size:16px;color:#2e4635}
.material-formats-header p{font-size:12px;max-width:590px;margin:5px 0 0}
.material-formats-header button{padding:8px 12px;white-space:nowrap}
.material-formats{display:grid;gap:12px}
.material-format-card{background:#fafbf8;border:1px solid #e1e9df;border-radius:11px;padding:14px}
.material-format-title{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:11px}
.material-format-title strong{font-size:13px;color:#2e4435}
.material-format-title button,.material-option-head button{border:0;background:transparent;color:#87624b;font-size:12px;padding:5px 2px;text-decoration:underline}
.material-format-dimensions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-bottom:10px}
.material-format-dimensions .material-control input{background:#fff}
.material-format-options{display:grid;gap:9px;margin:10px 0}
.material-option-card{border:1px solid #e2e8de;border-radius:8px;background:#fff;padding:10px}
.material-option-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;font-size:12px;color:#536859;font-weight:650}
.material-option-fields{display:grid;grid-template-columns:1.3fr 1fr .8fr .8fr;gap:9px}
.material-option-extra{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:8px}
.material-option-extra .material-control input{font-size:12px}
.material-mini-button{background:#fff;color:#305340;border:1px solid #cfded0;padding:8px 12px;border-radius:7px;font-size:12px;font-weight:650}
.material-image-box{display:flex;align-items:center;gap:10px;min-height:64px}
.material-image-box img{width:64px;height:64px;object-fit:cover;border-radius:9px;border:1px solid #e0e7dd}
.material-image-box button{font-size:12px;padding:8px}
.material-checked{display:flex;align-items:center;gap:8px;font-size:12px;color:#435b49;cursor:pointer}
.material-checked input{width:16px;height:16px;accent-color:#416249}
.material-dialog-actions{display:flex;justify-content:flex-end;align-items:center;gap:9px;padding:15px 25px;border-top:1px solid #e8eee7;background:#fff}
.material-dialog-actions .material-save-hint{margin-right:auto;color:#849184;font-size:11px}
@media(max-width:1100px){.material-controls{grid-template-columns:repeat(3,minmax(0,1fr))}.material-search{grid-column:span 2}.material-advanced{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:660px){.material-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.material-search{grid-column:span 2}.material-advanced{grid-template-columns:repeat(2,minmax(0,1fr))}.materials-heading .btn{width:100%}.material-dialog-head,.material-dialog-body,.material-dialog-actions{padding-left:15px;padding-right:15px}.material-form-grid{grid-template-columns:1fr}.material-wide{grid-column:span 1}.material-option-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.material-option-extra{grid-template-columns:repeat(2,minmax(0,1fr))}.material-dialog-actions .material-save-hint{display:none}.material-dialog-actions button{flex:1}.material-table-heading{align-items:flex-start}}

.material-table td:last-child{min-width:98px}
.material-table td:last-child .material-action{display:block;margin:5px 0 0;width:100%;max-width:100px}
.material-table td:last-child .material-action + .material-action{margin-left:0}
/* Prevent wide catalog columns from stretching the entire mobile Admin page. */
.columns > div{min-width:0}
#admin-materials,.materials-panel,.materials-panel .tablewrap{min-width:0;max-width:100%}
.materials-panel .tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

.material-color-picker{display:flex;align-items:center;gap:12px;padding:6px 9px;border:1px solid #dce1d9;border-radius:8px;max-width:260px}
.material-color-picker input[type=color]{width:66px;height:40px;padding:2px;border:0;background:transparent;cursor:pointer}
.material-color-picker output{font-family:ui-monospace,monospace;font-size:13px;color:#46554a}
