/* TELEGRAM-MS v0.4.0 — complete administration design-system migration.
   Donor: MINASOFT V67754 (user-supplied), translated into TELEGRAM-MS
   templates. This stylesheet targets *presentation*, never media deduplication.
   Strict corporate identity: MINA artwork unchanged; #F19228 / #111827 / #fff.
   Intentionally avoids the reference's teal brand tokens and overrides.
*/
:root {
  --ref-orange:#F19228; --ref-ink:#111827; --ref-white:#FFFFFF;
  --ref-page:#F5F7FA; --ref-paper:#FFFFFF; --ref-text:#243348;
  --ref-muted:#6E7E91; --ref-hairline:#E5EAF0;
  --ref-radius:14px; --ref-radius-lg:18px;
  --ref-shadow:0 4px 22px rgba(22,38,63,.045);
  --ref-focus:0 0 0 3px rgba(241,146,40,.24);
}
/* 01 / App shell: fixed brand/footer, independently scrollable navigation.
   The page itself scrolls independently; no clipping of short viewports. */
html {scroll-behavior:smooth}
body {background:var(--ref-page)}
.shell:not(.shell-auth) {background:var(--ref-page)}
.shell:not(.shell-auth) .sidebar {padding:0; background:#fff; width:268px;flex-basis:268px;border-left:1px solid var(--ref-hairline); box-shadow:none;}
.shell:not(.shell-auth) .sidebar>.brand {margin:0;padding:22px 18px 18px;border-bottom:1px solid #EFF1F4;flex:none}
.shell:not(.shell-auth) .brand-logo {border:1px solid #F3DAB8;background:#FFF8EE;box-shadow:none;border-radius:13px}
.shell:not(.shell-auth) .workspace-switcher {margin:17px 16px 6px;padding:12px;background:#F7F9FB;border-color:#E8ECF1;flex:none}
.shell:not(.shell-auth) .side-nav {flex:1 1 auto;min-height:0;padding:8px 12px 20px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#CDD5DF transparent;overscroll-behavior-y:contain;}
.ref-nav-section {padding-bottom:7px}
.ref-nav-section+.ref-nav-section {border-top:1px solid #EFF1F4;margin-top:2px;padding-top:7px}
.ref-nav-section .nav-group-title {border:0!important;margin:0!important;padding:9px 12px 7px!important;font-size:10px;letter-spacing:.02em;color:#929AA7;font-weight:800}
.ref-nav .nav-link {border:1px solid transparent;border-radius:10px;padding:10px 11px;margin:2px 0;font-size:12px;color:#5C6C7D;line-height:1.5;min-height:43px}
.ref-nav .nav-link .ui-icon {flex:none;width:19px;height:19px;color:#8995A5}
.ref-nav .nav-link:hover {background:#F6F8FA;border-color:#EDF0F4;color:#25364B}
.ref-nav .nav-link.active {background:#FFF2E2;border-color:#F7DFC0;color:#8C5012;box-shadow:none;font-weight:850}
.ref-nav .nav-link.active .ui-icon {color:#C87C1A}
.shell:not(.shell-auth) .sidebar-bottom {flex:none;padding:12px 17px 18px;border-top:1px solid #EDF1F5;background:#fff}
.shell:not(.shell-auth) .sidebar-help {margin:0 0 8px;padding:11px 12px;background:#F8FAFC;border:1px solid #E9EEF3;border-radius:12px;font-size:11px}
.shell:not(.shell-auth) .sidebar-logout {border-radius:10px;min-height:39px}
.shell:not(.shell-auth) .main {background:var(--ref-page);min-width:0;}
.shell:not(.shell-auth) .topbar {height:76px;padding:0 clamp(16px,2.7vw,40px);border-bottom:1px solid var(--ref-hairline);background:#fff;box-shadow:none;}
.ref-topbar-version {font-family:ui-monospace,Consolas,monospace;border:1px solid #E9EDF1;background:#F8FAFB;border-radius:8px;padding:6px 9px;color:#8794A5;font-size:11px}
.shell:not(.shell-auth) .topbar-context>span {color:#8B99A8;font-size:10px}
.shell:not(.shell-auth) .topbar-context>strong {font-weight:800;color:#24344A;font-size:14px}
.shell:not(.shell-auth) .page-content {max-width:1560px;margin-inline:auto;padding:30px clamp(15px,3vw,43px) 60px}
.shell:not(.shell-auth) .main-footer {background:transparent;border-color:#E9EDF2}
/* 02 / Shared MINASOFT-inspired content framework. */
.ref-heading {position:relative;background:#fff;border:1px solid var(--ref-hairline);border-radius:var(--ref-radius-lg);padding:24px 28px;margin-bottom:18px;box-shadow:var(--ref-shadow);display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;min-width:0}
.ref-heading .eyebrow{margin:0 0 6px;font-size:10px;color:#B87727;letter-spacing:.04em;font-weight:850}
.ref-heading h1 {font-size:clamp(21px,2.3vw,31px);margin:0 0 8px;color:#1E2E42;line-height:1.35;font-weight:850}
.ref-heading h1 span,.ref-heading h1 em {color:#B97520;font-style:normal}
.ref-heading .muted,.ref-heading p:not(.eyebrow){line-height:1.85;color:#758397;margin:0;max-width:740px;font-size:13px}
.ref-heading-actions {display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ref-heading .primary,.ref-heading .subtle-button,.ref-heading-actions>a {white-space:nowrap}
.ref-heading:before,.ref-heading:after{display:none!important}
.ref-panel,.shell:not(.shell-auth) .card {background:var(--ref-paper);border:1px solid var(--ref-hairline);border-radius:15px;box-shadow:var(--ref-shadow);margin-bottom:19px}
.ref-panel {min-width:0}
.ref-panel-head,.card-head {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid #ECF0F3}
.ref-panel-head h2,.card-head h2{font-size:17px;color:#243449;margin:0}
.ref-panel-head p {color:#8090A1;font-size:12px;margin:5px 0 0}
.ref-split {align-items:start;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.ref-settings-layout{align-items:start;gap:18px}
.ref-panel h2 {font-weight:800}
.ref-panel label,.ref-panel fieldset,.ref-panel .form-stack {min-width:0}
.ref-panel input:not([type=checkbox]):not([type=radio]):not([type=file]),.ref-panel select,.ref-panel textarea {min-height:42px;border-color:#DEE5EC;border-radius:9px;box-shadow:none}
.ref-panel input:focus-visible,.ref-panel select:focus-visible,.ref-panel textarea:focus-visible {outline:2px solid #E39B46;outline-offset:1px;box-shadow:var(--ref-focus)}
button,a { -webkit-tap-highlight-color:transparent }
.ref-panel .primary,.ref-heading .primary{background:var(--ref-orange);border-color:#D9801B;border-radius:9px;color:#1D232F;box-shadow:none;font-weight:850}
.ref-panel .primary:hover,.ref-heading .primary:hover {background:#E58A21;transform:none;box-shadow:0 5px 16px rgba(241,146,40,.18)}
.ref-panel .subtle-button,.ref-heading .subtle-button {border-radius:9px;background:#F8FAFC;border-color:#E4E9EE;color:#465870;box-shadow:none}
.ref-panel .subtle-button:hover,.ref-heading .subtle-button:hover {background:#FFF5E8;border-color:#EECFA7;color:#9A5C14}
.ref-panel table {background:#fff}
.ref-panel thead th {background:#F8FAFB;color:#697A8B;font-size:12px;border-bottom:1px solid #E8ECF0}
.ref-panel tbody td {border-color:#EDF0F3}
.ref-panel tbody tr:hover{background:#FCFDFE}
.ref-panel .table-wrap{border:1px solid #E9EEF2;border-radius:11px;overflow-x:auto}
.ref-panel .empty{line-height:2}
/* 03 / Dashboard: true reference-style KPI grid, workflow console, activity. */
.ref-heading-dashboard{padding:28px 30px;min-height:128px}
.ref-heading-dashboard .ref-heading-copy{min-width:0;flex:1}
.ref-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 18px}
.ref-kpi{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto auto;align-items:center;gap:7px;padding:17px 19px;min-height:142px;border:1px solid #E6EBF0;background:#fff;border-radius:15px;box-shadow:var(--ref-shadow);text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s,transform .15s}
.ref-kpi:hover{border-color:#EBD1AC;box-shadow:0 10px 28px rgba(28,43,60,.07);transform:translateY(-2px)}
.ref-kpi-label{grid-column:1;grid-row:1;color:#718095;font-size:12px;font-weight:750}
.ref-kpi-icon{grid-column:2;grid-row:1/span 2;display:grid;place-items:center;width:39px;height:39px;border-radius:12px;background:#FFF3E4;color:#B86F1F;align-self:start}
.ref-kpi-icon .ui-icon{width:19px;height:19px}
.ref-kpi strong{grid-column:1;grid-row:2;font-size:clamp(24px,2.7vw,33px);font-weight:900;color:#1B2D41;line-height:1.3;direction:ltr;text-align:right;font-variant-numeric:tabular-nums}
.ref-kpi-link{grid-column:1/-1;grid-row:3;font-size:10px;font-weight:800;color:#B27A39;margin-top:3px}
.ref-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:17px;margin-bottom:18px}
.ref-dashboard-grid>.ref-panel{margin:0;padding:21px}
.ref-workflow-cards{display:grid;gap:9px}
.ref-workflow-card{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:13px;text-decoration:none;color:#2B3C50;border:1px solid #E9EDF1;border-radius:11px;background:#FAFBFC;padding:13px;transition:border-color .15s,background .15s}
.ref-workflow-card:hover{background:#FFF9F1;border-color:#F2D6AD}
.ref-workflow-card>span{display:grid;place-items:center;width:35px;height:35px;border-radius:9px;background:#FFF0DD;color:#B56C15;font-size:12px;font-weight:850}
.ref-workflow-card strong{display:block;font-size:13px}
.ref-workflow-card small{display:block;color:#7F8C9D;font-size:11px;margin-top:4px;line-height:1.65}
.ref-workflow-card>.ui-icon{color:#9EACBA;width:17px;height:17px}
.ref-reference-card>p{font-size:12px;line-height:1.9;color:#718094}
.ref-code-examples{display:grid;gap:8px;margin:16px 0}
.ref-code-examples>div{border:1px solid #E9EDF1;border-radius:9px;padding:12px;background:#F9FAFC;display:flex;align-items:center;justify-content:space-between;gap:12px}
.ref-code-examples code{color:#9D5D17;font-size:12px;font-weight:800}
.ref-code-examples span{color:#69798C;font-size:11px}
.ref-recent-panel{padding:20px}
.ref-empty{display:grid;gap:6px;justify-items:center;padding:24px 12px;color:#56687D}
.ref-empty small{font-size:12px;color:#8C98A6}
/* 04 / Complete upload workflow: same compact drop panel + review library as donor. */
.shell:not(.shell-auth) .catalog-hero{background:#fff;padding:23px 27px;border:1px solid var(--ref-hairline);border-radius:16px;box-shadow:var(--ref-shadow);min-height:unset}
.shell:not(.shell-auth) .catalog-hero:before,.shell:not(.shell-auth) .catalog-hero:after,.shell:not(.shell-auth) .hero-decoration{display:none!important}
.shell:not(.shell-auth) .catalog-hero h1{font-size:clamp(23px,2.5vw,30px);line-height:1.32;color:#223349;margin:6px 0}
.shell:not(.shell-auth) .catalog-hero h1 br{display:none}
.shell:not(.shell-auth) .catalog-hero h1 em{color:#B56F1B}
.shell:not(.shell-auth) .catalog-hero-copy>p:not(.catalog-hero-kicker){font-size:12px;color:#748499;max-width:850px}
.shell:not(.shell-auth) .hero-metrics{display:flex;gap:10px;align-items:stretch}
.shell:not(.shell-auth) .hero-metric{border:1px solid #E9EDF1;border-radius:12px;background:#F9FAFB;min-width:120px;padding:12px}
.shell:not(.shell-auth) .hero-metric strong{font-size:25px;color:#25364A}
.shell:not(.shell-auth) .hero-metric small,.shell:not(.shell-auth) .hero-metric span{color:#8190A0}
.shell:not(.shell-auth) .hero-actions{margin-top:14px}
.ref-workflow-steps{display:flex;justify-content:flex-start;max-width:none;gap:9px;align-items:center;margin:0 0 17px!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
.ref-workflow-steps .workflow-step{background:#fff;border:1px solid #E8EDF1;border-radius:11px;padding:10px 12px;flex:1;min-width:0}
.ref-workflow-steps .workflow-step-index{background:#FFF0DD;color:#B8782C;border-radius:9px}
.ref-workflow-steps .workflow-step-line{opacity:.4;min-width:14px}
.ref-upload-workbench{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(250px,.85fr);gap:16px;align-items:stretch;margin:0 0 17px}
.ref-upload-workbench .ref-upload-panel{padding:23px;margin:0}
.ref-upload-workbench>.card{margin:0;min-width:0}
.ref-filename-notice{display:block;padding-top:6px;color:#9E641F;font-size:11px;font-weight:750}
.ref-upload-workbench .dropzone{min-height:170px;background:#FBFCFD;border:1.5px dashed #D4DBE4;border-radius:12px;gap:10px;padding:24px}
.ref-upload-workbench .dropzone:hover,.ref-upload-workbench .dropzone.is-drag-over{background:#FFF7EC;border-color:#E3A352}
.ref-upload-workbench .quick-upload-actions,.ref-upload-workbench .upload-actions{display:flex;gap:11px;align-items:center;flex-wrap:wrap;margin-top:12px}
.shell:not(.shell-auth) .library-panel,.shell:not(.shell-auth) .premium-product-library{padding:23px}
.ref-bulk-bar{background:#F9FAFB;border:1px solid #E7ECF0;border-radius:11px;padding:13px}
.ref-products-results .catalog-tile {border:1px solid #E8EDF2;border-radius:13px;box-shadow:0 3px 12px rgba(29,44,62,.04)}
.ref-products-results .catalog-tile:hover{transform:translateY(-2px);box-shadow:0 9px 23px rgba(29,44,62,.09)}
.ref-products-results .tile-picture{background:#F2F4F7}
.ref-products-results .tile-details {padding:15px}
.ref-products-results .tile-top{gap:9px}
/* 05 / Full cross-module form and workflow conventions from the donor. */
.ref-panel .item{padding:14px 0}
.ref-panel .item strong{color:#293A50}
.ref-panel .footnote{background:#F8FAFC;border:1px solid #EBEFF3;padding:11px 13px;border-radius:9px;color:#65798C}
.ref-panel fieldset{border:1px solid #E8EDF1;background:#FBFCFD;border-radius:12px;padding:15px}
.ref-panel fieldset legend{color:#4D647A}
.ref-panel details>summary{cursor:pointer;color:#36485D;font-weight:800}
.ref-panel details[open]>summary{margin-bottom:10px}
.ref-panel .settings-block{background:#fff;border-color:#ECF0F4;border-radius:13px}
.ref-panel .settings-block-head b{background:#FFF0DE;color:#9B641D;border-radius:9px}
.ref-panel .settings-sticky-actions{background:#fff;border-top:1px solid #EDF0F4;box-shadow:0 -6px 15px #1E2E4109}
.ref-panel .selection-count{background:#FFF1DC;color:#A76717}
.ref-panel .filter-actions{border-top:1px solid #F0F2F5;padding-top:15px}
.ref-panel .bulk-toolbar-clean.has-selection{border-color:#E8B979;background:#FFF9F1}
.ref-panel .catalog-tile.is-selected{box-shadow:0 0 0 2px rgba(241,146,40,.22)}
.ref-panel .display-switch{border:1px solid #E7ECF2;background:#F7F9FB;border-radius:10px;padding:3px;gap:3px}
.ref-panel .display-option{border-radius:8px}
.ref-panel .display-option.is-active{background:#fff;color:#9C5D16;box-shadow:0 1px 5px #18283813}
.ref-panel .quick-filter-form{gap:11px}
.ref-panel .advanced-filter-details{border-top:1px solid #EEF1F5;margin-top:12px;padding-top:12px}
.ref-panel .advanced-filter-details>summary{color:#52677F}
.ref-panel .advanced-filter-details[open]>summary{color:#A3681D}
/* Table and button loading/accessible enhancements */
[data-upload-submit][aria-busy="true"]{opacity:.78;cursor:progress}
button[disabled],select[disabled]{cursor:not-allowed;opacity:.6}
:where(a,button,summary,input,select,textarea):focus-visible{outline:2px solid #D88B2F;outline-offset:3px}
.ref-panel .status{border-radius:99px;padding:5px 9px}
.ref-panel .status-sent{background:#E8F6EF;color:#267454}
.ref-panel .status-failed{background:#FFF0F0;color:#B64A4A}
.ref-panel .status-pending{background:#FFF4E4;color:#9B671F}
.ref-subdued{color:#738397;font-size:12px}
.mobile-menu-caption{margin:14px 10px 6px;color:#8995A5;font-size:10px;font-weight:850}
/* 06 / Keep corporate brand even if catalog owner picks their *shop* color.
   The private administration is not skinned by per-customer palette. */
.shell:not(.shell-auth) [data-brand-primary]{color:#B8701F}
.shell:not(.shell-auth) input[type=checkbox]{accent-color:var(--ref-orange)}
/* 07 / Precise responsive behavior. Sidebar scroll & content scroll independent. */
@media(max-width:1180px){.ref-dashboard-grid{grid-template-columns:minmax(0,1fr)}.ref-upload-workbench{grid-template-columns:minmax(0,1fr)}.ref-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:980px){.ref-heading{padding:22px}.ref-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.ref-split{grid-template-columns:1fr}}
@media(max-width:620px){
 .shell:not(.shell-auth) .topbar{height:64px;padding:0 14px}
 .shell:not(.shell-auth) .page-content{padding:15px 12px 38px}
 .ref-topbar-version,.shell:not(.shell-auth) .topbar-quick span{display:none}
 .ref-heading{padding:18px 16px;gap:11px}
 .ref-heading h1{font-size:23px}
 .ref-heading-actions{width:100%}.ref-heading-actions>a{flex:1;text-align:center;justify-content:center}
 .ref-kpis{gap:9px}.ref-kpi{padding:13px 12px;min-height:117px;gap:5px}.ref-kpi strong{font-size:23px}.ref-kpi-icon{width:30px;height:30px;border-radius:8px}.ref-kpi-icon .ui-icon{width:16px;height:16px}.ref-kpi-label{font-size:10px}.ref-kpi-link{font-size:9px}
 .ref-dashboard-grid>.ref-panel,.ref-recent-panel{padding:14px}
 .ref-workflow-card{padding:10px;gap:8px}
 .shell:not(.shell-auth) .catalog-hero{padding:18px 16px}
 .shell:not(.shell-auth) .catalog-hero h1{font-size:23px}
 .shell:not(.shell-auth) .hero-metrics{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .shell:not(.shell-auth) .hero-metric{min-width:0}
 .ref-workflow-steps{gap:5px}.ref-workflow-steps .workflow-step{padding:9px 8px;gap:6px}.ref-workflow-steps .workflow-step-index{font-size:9px}.ref-workflow-steps .workflow-step strong{font-size:10px}.ref-workflow-steps .workflow-step small{display:none}.ref-workflow-steps .workflow-step-line{display:none}
 .ref-upload-workbench .ref-upload-panel,.shell:not(.shell-auth) .library-panel,.shell:not(.shell-auth) .premium-product-library{padding:16px}
 .ref-upload-workbench .dropzone{min-height:150px}
 .ref-panel .bulk-toolbar-clean{align-items:stretch}
 .ref-panel .bulk-actions{width:100%}.ref-panel .bulk-actions .primary{flex:1}
 .ref-panel .form-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.ref-kpi,.ref-workflow-card,.ref-panel a,.ref-panel button{transition:none!important;transform:none!important}}

/* Reference uploaded-images date separators. No extra query or grouping by
   image fingerprints; this groups only the already-authorized page rows. */
.ref-uploaded-list .ref-date-group{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:#F7F9FC;border:1px solid #E7ECF2;border-radius:10px;color:#3B5068;padding:10px 15px;font-size:12px;font-weight:750}
.ref-date-group b{font-variant-numeric:tabular-nums;color:#A8671D}
.ref-date-group small{font-size:10px;font-weight:600;color:#8391A2}
@media(max-width:620px){.ref-uploaded-list .ref-date-group{padding:9px 11px}.ref-date-group small{display:none}}
