
/* ===== redesign-v26.css ===== */

/* ===== redesign-v25.css ===== */

/* ===== redesign-v24.css ===== */

/* ===== redesign-v23.css ===== */

/* ===== redesign-v1.css ===== */

/* =========================================================
   ePopis Redesign V1 — test.epopis.rs
   Global shell + dashboard visual system
   ========================================================= */

:root{
  --ep-blue:#2563eb;
  --ep-blue-2:#1d4ed8;
  --ep-ink:#0f172a;
  --ep-muted:#64748b;
  --ep-line:#e2e8f0;
  --ep-surface:#ffffff;
  --ep-canvas:#f5f7fb;
  --ep-sidebar:#0b1220;
}

html,body,#root{min-height:100%}
body{
  background:var(--ep-canvas);
  color:var(--ep-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}

.neo-app{
  background:
    radial-gradient(circle at 74% -10%,rgba(37,99,235,.055),transparent 28rem),
    #f5f7fb !important;
}

/* Sidebar — calmer, denser, enterprise */
.neo-sidebar{
  width:252px !important;
  background:#0b1220 !important;
  border-right:1px solid rgba(255,255,255,.075) !important;
  box-shadow:12px 0 36px rgba(15,23,42,.08) !important;
}
.neo-sidebar > div:first-child{
  height:82px !important;
  padding-left:20px !important;
  padding-right:18px !important;
  border-color:rgba(255,255,255,.08) !important;
}
.neo-sidebar > div:first-child img{
  width:42px !important;
  height:42px !important;
}
.neo-sidebar > div:first-child strong{
  font-size:18px !important;
  letter-spacing:-.02em;
}
.neo-sidebar > div:first-child small{
  font-size:11px !important;
  color:#94a3b8 !important;
}
.neo-sidebar nav{
  padding:18px 12px !important;
}
.neo-sidebar nav > div{
  margin-bottom:20px !important;
}
.neo-sidebar nav > div > div:first-child{
  margin-bottom:7px !important;
  padding-left:11px !important;
  font-size:9px !important;
  letter-spacing:.18em !important;
  color:#64748b !important;
}
.neo-nav-item{
  min-height:42px;
  gap:11px !important;
  border-radius:10px !important;
  padding:10px 12px !important;
  color:#aebbd0 !important;
  font-size:13px !important;
  font-weight:650 !important;
  transition:background-color .16s ease,color .16s ease,box-shadow .16s ease !important;
}
.neo-nav-item:hover{
  color:#fff !important;
  background:rgba(255,255,255,.065) !important;
  transform:none !important;
}
.neo-nav-item.is-active{
  color:#fff !important;
  background:#1e4fd7 !important;
  box-shadow:0 7px 18px rgba(30,79,215,.22) !important;
}
.neo-nav-item.is-active:before{display:none !important}
.neo-sidebar > div:last-child{
  padding:12px !important;
  border-color:rgba(255,255,255,.08) !important;
}
.neo-sidebar > div:last-child a{
  border-radius:10px !important;
}

/* Main workspace */
@media (min-width:1024px){
  .neo-app main{padding-left:252px !important}
}
.neo-app main{
  background:transparent;
}

/* Header — full-width command bar instead of floating glass pill */
.neo-command{
  min-height:82px !important;
  margin:0 !important;
  padding:14px 28px !important;
  border:0 !important;
  border-bottom:1px solid var(--ep-line) !important;
  border-radius:0 !important;
  background:rgba(255,255,255,.94) !important;
  box-shadow:none !important;
  backdrop-filter:blur(14px) !important;
}
.neo-command h2{
  font-size:25px !important;
  line-height:1.15 !important;
  font-weight:750 !important;
  letter-spacing:-.035em !important;
}
.neo-command h2 + *{margin-top:0}
.neo-command .text-\[11px\]{
  font-size:10px !important;
  letter-spacing:.18em !important;
  color:#64748b !important;
}
.neo-command a[href="/app/assets/new"]{
  border-radius:10px !important;
  background:#2563eb !important;
  box-shadow:none !important;
  padding:11px 16px !important;
}
.neo-command a[href="/app/assets/new"]:hover{
  background:#1d4ed8 !important;
}
.neo-command button{
  border-radius:10px !important;
}

/* Content width and breathing room */
.neo-app main > section{
  width:100%;
  max-width:1600px;
  margin:0 auto;
  padding:28px 32px 42px !important;
}

/* Surfaces: reduce "bubble/card" look across the app */
.neo-app main section .rounded-\[2rem\],
.neo-app main section .sm\:rounded-\[2rem\],
.neo-app main section .rounded-3xl{
  border-radius:16px !important;
}
.neo-app main section .rounded-2xl{
  border-radius:12px !important;
}
.neo-app main section .rounded-xl{
  border-radius:10px !important;
}
.neo-app main section .shadow-xl,
.neo-app main section .shadow-2xl{
  box-shadow:0 8px 24px rgba(15,23,42,.07) !important;
}

/* White panels */
.neo-app main section .bg-white{
  border-color:#e3e8ef;
}

/* Buttons */
.neo-app main section button,
.neo-app main section a{
  transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease !important;
}
.neo-app main section button[class*="rounded-2xl"],
.neo-app main section a[class*="rounded-2xl"]{
  border-radius:10px !important;
}

/* Inputs/selects */
.neo-app input:not([type="checkbox"]):not([type="radio"]),
.neo-app select,
.neo-app textarea{
  border-radius:9px !important;
  border-color:#d8e0ea !important;
  background:#fff;
  box-shadow:none !important;
}
.neo-app input:focus,
.neo-app select:focus,
.neo-app textarea:focus{
  border-color:#2563eb !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.10) !important;
  outline:none !important;
}

/* Tables — clean data-grid feel */
.neo-app table{
  border-collapse:separate;
  border-spacing:0;
}
.neo-app thead{
  background:#f8fafc !important;
}
.neo-app th{
  color:#64748b !important;
  font-size:10px !important;
  font-weight:750 !important;
  letter-spacing:.075em;
  text-transform:uppercase;
}
.neo-app td{
  border-color:#edf0f4 !important;
}
.neo-app tbody tr:hover{
  background:#f8fbff !important;
}

/* Page typography */
.neo-app main section h1,
.neo-app main section h2,
.neo-app main section h3{
  letter-spacing:-.025em;
}
.neo-app main section h1{font-weight:780 !important}

/* Badges/chips: less pill-heavy */
.neo-app main section .rounded-full{
  border-radius:7px !important;
}

/* Dark mode keeps the same restrained language */
html.dark .neo-app{
  background:#090f1b !important;
}
html.dark .neo-command{
  background:rgba(10,17,30,.96) !important;
  border-bottom-color:rgba(255,255,255,.08) !important;
}
html.dark .neo-app main section .bg-white{
  border-color:rgba(255,255,255,.09) !important;
}
html.dark .neo-app input,
html.dark .neo-app select,
html.dark .neo-app textarea{
  border-color:#334155 !important;
}

/* Mobile */
@media (max-width:1023px){
  .neo-sidebar{width:268px !important}
  .neo-command{
    min-height:70px !important;
    padding:10px 14px !important;
  }
  .neo-command h2{font-size:20px !important}
  .neo-app main > section{
    padding:18px 14px 30px !important;
  }
}
@media (max-width:639px){
  .neo-app main > section{padding:14px 12px 26px !important}
  .neo-command{padding-left:12px !important;padding-right:12px !important}
}

/* ===== redesign-v2.css ===== */

/* =========================================================
   ePopis Redesign V2 — Dashboard
   ========================================================= */

.ep-dashboard-hero{
  position:relative;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.ep-dashboard-hero:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:linear-gradient(180deg,#2563eb,#60a5fa);
}
.ep-dashboard-kicker{display:block}

/* KPI cards: information first, decoration second */
.ep-kpi{
  position:relative;
  box-shadow:0 1px 2px rgba(15,23,42,.025);
}
.ep-kpi:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  background:#cbd5e1;
}
.ep-kpi:nth-child(2):before{background:#3b82f6}
.ep-kpi:nth-child(3):before{background:#10b981}
.ep-kpi:nth-child(4):before{background:#f43f5e}
.ep-kpi:hover{
  border-color:#cbd5e1;
  box-shadow:0 8px 22px rgba(15,23,42,.055);
}
.ep-kpi > div:first-child{
  font-size:12px !important;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.ep-kpi > div:nth-child(2) > div:first-child{
  font-size:clamp(1.55rem,2vw,2rem) !important;
  letter-spacing:-.035em;
}
.ep-kpi > div:last-child{
  font-size:12px !important;
  color:#64748b;
}

/* Secondary counts */
.ep-secondary-metric{
  box-shadow:0 1px 2px rgba(15,23,42,.025);
}
.ep-secondary-metric > div:first-child{
  font-size:11px !important;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.ep-secondary-metric > div:nth-child(2){
  margin-top:8px !important;
  font-size:26px !important;
}
.ep-secondary-metric > div:last-child{
  margin-top:8px !important;
  font-size:12px !important;
}

/* Main dashboard panels */
.ep-dashboard-panel{
  box-shadow:0 1px 2px rgba(15,23,42,.025);
}
.ep-dashboard-panel h2{
  font-size:17px !important;
  font-weight:750 !important;
  letter-spacing:-.02em;
}
.ep-dashboard-panel h2 + p{
  font-size:12px !important;
}

/* Feed rows feel like rows, not nested cards */
.ep-feed-row{
  box-shadow:none !important;
}
.ep-feed-row:hover{
  transform:none !important;
}

/* Dashboard spacing becomes denser on desktop */
@media (min-width:1280px){
  .neo-app main > section > .space-y-6{
    gap:20px;
  }
}

html.dark .ep-dashboard-hero:before{
  background:linear-gradient(180deg,#3b82f6,#60a5fa);
}
html.dark .ep-kpi{
  box-shadow:none;
}

/* ===== redesign-v3.css ===== */

/* =========================================================
   ePopis Redesign V3
   Dashboard refinement + Assets workspace
   ========================================================= */

/* Dashboard: compact dark anchor */
.ep-dashboard-hero-dark{
  background:
    radial-gradient(circle at 86% 10%,rgba(59,130,246,.24),transparent 23rem),
    linear-gradient(118deg,#0b1220 0%,#111c32 58%,#10285c 100%) !important;
  border-color:rgba(148,163,184,.15) !important;
  box-shadow:0 12px 28px rgba(15,23,42,.12);
}
.ep-dashboard-hero-dark:before{
  display:none;
}
.ep-dashboard-hero-dark a[href="/app/assets/new"]{
  background:#3b82f6 !important;
}
.ep-dashboard-hero-dark a[href="/app/scanner"]{
  border-color:rgba(255,255,255,.16) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
}
.ep-dashboard-hero-dark a[href="/app/scanner"]:hover{
  background:rgba(255,255,255,.14) !important;
}

/* Softer premium rounding */
.ep-kpi,
.ep-secondary-metric{
  border-radius:18px !important;
}
.ep-dashboard-panel{
  border-radius:20px !important;
}
.ep-feed-row{
  border-radius:14px !important;
}

/* =========================================================
   ASSETS — turn the page into a denser management workspace.
   These selectors intentionally key off the current production
   structure, without altering API/event logic.
   ========================================================= */

/* Main assets page surfaces */
.neo-app main section{
  --asset-radius:18px;
}

/* Search fields become visually primary */
.neo-app main section input[type="search"],
.neo-app main section input[placeholder*="Pretra"],
.neo-app main section input[placeholder*="pretra"]{
  min-height:44px !important;
  border-radius:12px !important;
  border-color:#cfd8e6 !important;
  background:#fff !important;
  padding-left:42px !important;
  font-size:13px !important;
}
.neo-app main section input[type="search"]:focus,
.neo-app main section input[placeholder*="Pretra"]:focus{
  border-color:#2563eb !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.09) !important;
}

/* Filter controls: compact and aligned */
.neo-app main section select{
  min-height:40px;
  border-radius:11px !important;
  font-size:12px;
  font-weight:600;
}
.neo-app main section label{
  color:#64748b;
}

/* Large white filter/table containers */
.neo-app main section div[class*="border"][class*="bg-white"][class*="shadow"]{
  box-shadow:0 2px 8px rgba(15,23,42,.035) !important;
}

/* Asset table becomes the visual center */
.neo-app main section table{
  width:100%;
  font-size:13px;
}
.neo-app main section table thead th{
  height:43px;
  padding-top:10px !important;
  padding-bottom:10px !important;
  background:#f7f9fc !important;
  border-bottom:1px solid #dfe5ed !important;
  white-space:nowrap;
}
.neo-app main section table tbody td{
  padding-top:13px !important;
  padding-bottom:13px !important;
  vertical-align:middle;
}
.neo-app main section table tbody tr{
  transition:background-color .12s ease;
}
.neo-app main section table tbody tr:hover{
  background:#f6f9ff !important;
}

/* First meaningful table links/names are easier to scan */
.neo-app main section table tbody a{
  font-weight:650;
  color:#172033;
}
.neo-app main section table tbody a:hover{
  color:#1d4ed8;
}

/* Status badges: still rounded, but not giant pills */
.neo-app main section table .rounded-full,
.neo-app main section table [class*="rounded-full"]{
  border-radius:8px !important;
  padding-top:4px !important;
  padding-bottom:4px !important;
  font-size:10px !important;
  font-weight:750 !important;
}

/* Toolbar buttons */
.neo-app main section button[class*="border"],
.neo-app main section a[class*="border"]{
  box-shadow:none !important;
}
.neo-app main section button:hover,
.neo-app main section a:hover{
  transform:none !important;
}

/* Pagination becomes quieter */
.neo-app main section nav[aria-label*="pagination" i],
.neo-app main section [class*="pagination"]{
  font-size:12px;
}

/* Saved filter / auxiliary strips should read as controls, not cards */
.neo-app main section [class*="bg-slate-50"]{
  box-shadow:none !important;
}

/* Better horizontal table handling on narrower displays */
.neo-app main section .overflow-x-auto{
  scrollbar-width:thin;
  scrollbar-color:#cbd5e1 transparent;
}
.neo-app main section .overflow-x-auto::-webkit-scrollbar{
  height:8px;
}
.neo-app main section .overflow-x-auto::-webkit-scrollbar-thumb{
  background:#cbd5e1;
  border-radius:999px;
}

/* Dark mode assets */
html.dark .neo-app main section table thead th{
  background:#111827 !important;
  border-bottom-color:#263244 !important;
}
html.dark .neo-app main section table tbody tr:hover{
  background:#111c30 !important;
}
html.dark .neo-app main section table tbody a{
  color:#e5edf8;
}
html.dark .neo-app main section input[type="search"],
html.dark .neo-app main section input[placeholder*="Pretra"]{
  background:#0f172a !important;
  border-color:#334155 !important;
}

/* Mobile: keep actions usable and data breathable */
@media(max-width:767px){
  .ep-dashboard-hero-dark{
    border-radius:18px !important;
  }
  .neo-app main section input[type="search"],
  .neo-app main section input[placeholder*="Pretra"]{
    min-height:42px !important;
  }
  .neo-app main section table{
    font-size:12px;
  }
  .neo-app main section table tbody td{
    padding-top:11px !important;
    padding-bottom:11px !important;
  }
}

/* ===== redesign-v4.css ===== */

/* ePopis Redesign V4 fixes */

/* Header/hero corners must not depend on Tailwind classes added after build. */
.ep-dashboard-hero-dark{
  border-radius:20px !important;
}

/* Assets hero keeps the same visual language and rounding. */
.neo-app main section > .relative.z-20{
  border-radius:20px !important;
}

/* Search no longer reserves space for a removed icon. */
.neo-app main section input[placeholder^="Pretraga po nazivu"]{
  padding-left:16px !important;
}

/* Do not let generic table-link styling turn blue action buttons black. */
.neo-app main section table a.bg-blue-600,
.neo-app main section table a[class*="bg-blue-600"]{
  color:#fff !important;
}
.neo-app main section table a.bg-blue-600:hover,
.neo-app main section table a[class*="bg-blue-600"]:hover{
  color:#fff !important;
  background:#1d4ed8 !important;
}

/* Saved filter dropdown */
.ep-saved-filters summary{
  user-select:none;
}
.ep-saved-filters[open] summary{
  border-color:#93c5fd !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.08);
}
html.dark .ep-saved-filters summary,
html.dark .ep-saved-filters > div{
  background:#0f172a !important;
  border-color:#334155 !important;
  color:#e2e8f0 !important;
}

/* Keep page-size control compact despite global select rules. */
.neo-app main section label select{
  min-height:36px !important;
  height:36px !important;
  border-radius:9px !important;
}

/* Slightly more rounded cards, as agreed. */
.neo-app main section .ep-kpi,
.neo-app main section .ep-secondary-metric{
  border-radius:18px !important;
}
.neo-app main section .ep-dashboard-panel{
  border-radius:20px !important;
}

/* ===== redesign-v5.css ===== */

/* =========================================================
   ePopis Redesign V5
   Assets UX fixes + Annual Inventory redesign
   ========================================================= */

/* ---------- Assets: page size ---------- */
.ep-page-size{
  min-width:150px;
  justify-content:flex-end;
}
.ep-page-size select{
  width:86px !important;
  min-width:86px !important;
  max-width:86px !important;
  padding-left:10px !important;
  padding-right:24px !important;
  flex:none !important;
}

/* ---------- Assets: saved filters ---------- */
.ep-saved-filters{
  width:100%;
  max-width:460px;
}
.ep-saved-filters summary{
  min-width:220px;
}
.ep-saved-filter-menu{
  position:relative !important;
  max-height:240px;
  scrollbar-width:thin;
}
.ep-saved-filter-menu > div{
  min-height:40px;
}
.ep-saved-filter-menu > div + div{
  border-top:1px solid #f1f5f9;
}
html.dark .ep-saved-filter-menu > div + div{
  border-top-color:#1e293b;
}

/* ---------- Annual inventory ---------- */
.ep-annual-hero{
  background:
    radial-gradient(circle at 87% 5%,rgba(59,130,246,.23),transparent 21rem),
    linear-gradient(118deg,#0b1220 0%,#111c32 58%,#10285c 100%) !important;
  border-color:rgba(148,163,184,.15) !important;
  box-shadow:0 12px 28px rgba(15,23,42,.11);
}

/* The annual page should feel like a working screen, not a marketing page */
.ep-annual-create,
.ep-annual-list{
  box-shadow:0 2px 8px rgba(15,23,42,.035) !important;
}

/* Create-year form */
.ep-annual-create input{
  border-radius:11px !important;
  min-height:42px;
}
.ep-annual-create button{
  border-radius:11px !important;
  min-height:42px;
}

/* Annual list table */
.ep-annual-list table{
  font-size:13px;
}
.ep-annual-list thead{
  background:#f7f9fc !important;
}
.ep-annual-list th{
  height:43px;
  padding-top:10px !important;
  padding-bottom:10px !important;
  font-size:10px !important;
  font-weight:750 !important;
  letter-spacing:.075em;
  text-transform:uppercase;
}
.ep-annual-list td{
  padding-top:13px !important;
  padding-bottom:13px !important;
}
.ep-annual-list tbody tr:hover{
  background:#f6f9ff !important;
}

/* Annual progress/status buttons */
.ep-annual-list .rounded-full{
  border-radius:8px !important;
}
.ep-annual-list a.bg-blue-600,
.ep-annual-list a[class*="bg-blue-600"]{
  color:#fff !important;
  border-radius:10px !important;
}
.ep-annual-list button{
  border-radius:10px !important;
}

/* Dark annual */
html.dark .ep-annual-create,
html.dark .ep-annual-list{
  background:#0f172a !important;
  border-color:#263244 !important;
}
html.dark .ep-annual-list thead{
  background:#111827 !important;
}

/* ---------- Responsive ---------- */
@media(max-width:639px){
  .ep-page-size{
    min-width:0;
    width:100%;
    justify-content:space-between;
  }
  .ep-saved-filters,
  .ep-saved-filters summary{
    width:100%;
    max-width:none;
  }
  .ep-annual-hero{
    border-radius:18px !important;
  }
}

/* ===== redesign-v6.css ===== */

/* =========================================================
   ePopis Redesign V6
   Custom dropdown system for Assets + Annual Inventory
   ========================================================= */

.ep-page-size{
  min-width:auto !important;
  justify-content:flex-end;
  white-space:nowrap;
}
.ep-page-size > span{
  flex:none;
  white-space:nowrap;
}

/* Shared custom select */
.ep-custom-select{
  position:relative;
  flex:none;
}
.ep-custom-select summary{
  user-select:none;
}
.ep-custom-select[open] .ep-custom-select-trigger{
  border-color:#60a5fa !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.10);
}
.ep-custom-select-menu{
  background:#fff;
}
.ep-custom-select-option{
  transition:background-color .12s ease,color .12s ease;
}
.ep-custom-select-option:hover{
  background:#eff6ff !important;
  color:#1d4ed8 !important;
}

/* Assets page-size menu */
.ep-page-size .ep-custom-select-trigger{
  width:92px !important;
  min-width:92px !important;
}
.ep-page-size .ep-custom-select-menu{
  width:110px !important;
  min-width:110px !important;
}

/* Annual filter */
.ep-annual-filter{
  width:100%;
}
.ep-annual-filter .ep-custom-select-trigger{
  width:100% !important;
  min-height:46px !important;
  border-radius:12px !important;
}
.ep-annual-filter .ep-custom-select-menu{
  width:100% !important;
  min-width:220px !important;
}

/* Dark mode */
html.dark .ep-custom-select-trigger,
html.dark .ep-custom-select-menu{
  background:#0f172a !important;
  border-color:#334155 !important;
  color:#e2e8f0 !important;
}
html.dark .ep-custom-select-option{
  color:#cbd5e1 !important;
}
html.dark .ep-custom-select-option:hover{
  background:#172554 !important;
  color:#bfdbfe !important;
}

/* Prevent menu clipping in the annual filter card */
.ep-annual-filter,
.ep-custom-select-menu{
  overflow:visible !important;
}

/* On narrow screens, keep page-size compact and readable */
@media(max-width:639px){
  .ep-page-size{
    width:auto !important;
    justify-content:flex-start !important;
  }
}

/* ===== redesign-v9.css ===== */

/* =========================================================
   ePopis Redesign V9
   Stable annual-detail polish + scanner redesign
   ========================================================= */

/* ---------- Assets result summary ---------- */
.ep-assets-results-row > p{
  white-space:nowrap;
}
@media (min-width:640px){
  .ep-assets-results-row{
    justify-content:flex-end !important;
  }
}

/* ---------- Annual inventory detail: keep original light design ---------- */
.ep-annual-detail-card{
  border-radius:26px !important;
  border-color:#dbe3ee !important;
  box-shadow:0 10px 28px rgba(15,23,42,.055) !important;
}
.ep-annual-detail-card > div + div > div{
  border-radius:20px !important;
}
.ep-annual-detail-panel{
  border-radius:22px !important;
  border-color:#dbe3ee !important;
  box-shadow:0 7px 20px rgba(15,23,42,.045) !important;
}
.ep-annual-detail-table{
  border-radius:22px !important;
  border-color:#dbe3ee !important;
  box-shadow:0 7px 20px rgba(15,23,42,.04) !important;
}

/* Dropdown must float above the table. */
.ep-annual-filter{
  position:relative !important;
  z-index:80 !important;
}
.ep-annual-filter[open]{
  z-index:200 !important;
}
.ep-annual-filter .ep-custom-select-menu{
  position:absolute !important;
  top:100% !important;
  right:0 !important;
  z-index:9999 !important;
  margin-top:8px !important;
  box-shadow:0 18px 40px rgba(15,23,42,.16) !important;
}
.ep-annual-detail-panel{
  overflow:visible !important;
  position:relative;
  z-index:30;
}
.ep-annual-detail-table{
  position:relative;
  z-index:1;
}

/* Keep rounded language on annual detail controls. */
.ep-annual-detail-card .rounded-2xl,
.ep-annual-detail-panel .rounded-2xl{
  border-radius:16px !important;
}
.ep-annual-detail-card .rounded-xl,
.ep-annual-detail-panel .rounded-xl{
  border-radius:12px !important;
}

/* ---------- Scanner ---------- */
.ep-scanner-hero{
  background:
    radial-gradient(circle at 86% 4%,rgba(59,130,246,.25),transparent 24rem),
    linear-gradient(118deg,#0b1220 0%,#111c32 58%,#10285c 100%) !important;
  border:1px solid rgba(148,163,184,.13) !important;
  border-radius:24px !important;
  box-shadow:0 12px 30px rgba(15,23,42,.12) !important;
}
.ep-scanner-kicker{
  display:block;
}
.ep-scanner-mode{
  border-radius:16px !important;
  backdrop-filter:blur(8px);
}
.ep-scanner-input{
  border-radius:16px !important;
  background:rgba(15,23,42,.82) !important;
}
.ep-scanner-input:focus{
  border-color:#60a5fa !important;
  box-shadow:0 0 0 4px rgba(59,130,246,.13) !important;
}
.ep-scanner-camera{
  border-radius:22px !important;
  box-shadow:0 14px 34px rgba(15,23,42,.18) !important;
}

/* Scanner buttons */
.ep-scanner-hero button{
  border-radius:14px !important;
}

/* Progress/status card under inventory selector */
.ep-scanner-hero .rounded-2xl.border.border-slate-700.bg-slate-900{
  border-radius:16px !important;
  background:rgba(15,23,42,.72) !important;
}

/* Result panel beneath scanner */
.ep-scanner-hero + div[class*="rounded-3xl"],
.ep-scanner-hero ~ div[class*="rounded-3xl"]{
  border-radius:22px !important;
}

/* Dark mode still uses the same scanner design */
html.dark .ep-annual-detail-card,
html.dark .ep-annual-detail-panel,
html.dark .ep-annual-detail-table{
  border-color:#263244 !important;
}

/* Mobile */
@media(max-width:639px){
  .ep-annual-detail-card,
  .ep-annual-detail-panel,
  .ep-annual-detail-table,
  .ep-scanner-hero,
  .ep-scanner-camera{
    border-radius:18px !important;
  }
}

/* ===== redesign-v10.css ===== */

/* =========================================================
   ePopis Redesign V10
   Reliable dropdown flow + visible Scanner redesign
   ========================================================= */

/* =========================================================
   DROPDOWNS
   Do not float over/clipped behind following sections.
   Opening the menu expands its row/card instead.
   ========================================================= */

.ep-page-size .ep-custom-select,
.ep-annual-filter.ep-custom-select{
  position:relative !important;
}

/* Critical: menus participate in document flow. */
.ep-page-size .ep-custom-select-menu,
.ep-annual-filter .ep-custom-select-menu{
  position:relative !important;
  inset:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;
  left:auto !important;
  transform:none !important;
  z-index:1 !important;
  margin-top:7px !important;
  box-shadow:0 10px 24px rgba(15,23,42,.10) !important;
}

/* Page-size dropdown stays aligned under its trigger. */
.ep-page-size{
  align-items:flex-start !important;
}
.ep-page-size > span{
  padding-top:10px;
}
.ep-page-size .ep-custom-select-menu{
  width:92px !important;
  min-width:92px !important;
}

/* Annual filter menu expands the filter card instead of hiding behind table. */
.ep-annual-filter{
  z-index:auto !important;
}
.ep-annual-filter[open]{
  z-index:auto !important;
}
.ep-annual-filter .ep-custom-select-menu{
  width:100% !important;
  min-width:100% !important;
}
.ep-annual-detail-panel{
  overflow:visible !important;
}

/* =========================================================
   SCANNER — visibly new, while preserving all functionality
   ========================================================= */

.ep-scanner-hero{
  position:relative;
  overflow:hidden !important;
  border-radius:26px !important;
  border:1px solid rgba(96,165,250,.15) !important;
  padding:28px 30px 30px !important;
  background:
    radial-gradient(circle at 90% 0%,rgba(37,99,235,.36),transparent 28rem),
    radial-gradient(circle at 10% 120%,rgba(14,165,233,.12),transparent 24rem),
    linear-gradient(125deg,#08111f 0%,#101c33 55%,#163777 100%) !important;
  box-shadow:0 18px 44px rgba(15,23,42,.15) !important;
}

/* subtle premium pattern */
.ep-scanner-hero:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.12;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:36px 36px;
  mask-image:linear-gradient(to bottom,black,transparent 72%);
}
.ep-scanner-hero > *{
  position:relative;
  z-index:1;
}

/* Header feels like an application workflow, not a generic hero */
.ep-scanner-kicker{
  display:block;
  margin-bottom:5px;
  font-size:10px !important;
  letter-spacing:.22em !important;
  color:#7dd3fc !important;
}
.ep-scanner-hero h1{
  font-size:32px !important;
  letter-spacing:-.035em !important;
}
.ep-scanner-hero h1 + p{
  max-width:720px !important;
  margin-top:9px !important;
  color:#bdc9db !important;
  font-size:14px !important;
  line-height:1.7 !important;
}

/* "Režim rada" becomes a compact status badge */
.ep-scanner-mode{
  min-width:180px;
  border-radius:14px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.07) !important;
  padding:11px 14px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.ep-scanner-mode > div:first-child{
  font-size:10px !important;
  text-transform:uppercase;
  letter-spacing:.08em;
}

/* Main workflow becomes two clear glass panels */
.ep-scanner-hero .mt-6.grid.grid-cols-1.gap-4{
  gap:16px !important;
  margin-top:24px !important;
  grid-template-columns:minmax(270px,320px) minmax(0,1fr) !important;
}
.ep-scanner-hero .mt-6.grid.grid-cols-1.gap-4 > div{
  border:1px solid rgba(255,255,255,.10);
  border-radius:20px;
  background:rgba(7,15,28,.34);
  padding:18px;
  backdrop-filter:blur(8px);
}
.ep-scanner-hero .mt-6.grid.grid-cols-1.gap-4 label{
  margin-bottom:8px !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#91a4bf !important;
}

/* Inventory/progress panel */
.ep-scanner-hero .mt-3.rounded-2xl.border.border-slate-700.bg-slate-900{
  margin-top:12px !important;
  border-radius:14px !important;
  border-color:rgba(255,255,255,.09) !important;
  background:rgba(2,8,23,.38) !important;
}

/* Barcode input: stronger focus and cleaner field */
.ep-scanner-input{
  min-height:56px !important;
  border-radius:14px !important;
  border-color:rgba(148,163,184,.28) !important;
  background:rgba(255,255,255,.96) !important;
  color:#0f172a !important;
  font-size:16px !important;
  font-weight:650 !important;
}
.ep-scanner-input::placeholder{
  color:#94a3b8 !important;
}
.ep-scanner-input:focus{
  border-color:#60a5fa !important;
  box-shadow:0 0 0 4px rgba(59,130,246,.18) !important;
}

/* Camera + scan buttons now clearly differentiated */
.ep-scanner-input + button{
  min-height:56px !important;
  border-radius:14px !important;
  background:linear-gradient(135deg,#2563eb,#0ea5e9) !important;
  box-shadow:0 8px 18px rgba(37,99,235,.20);
}
.ep-scanner-input + button + button{
  min-height:56px !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#172033 !important;
  box-shadow:none !important;
}
.ep-scanner-input + button + button:hover{
  background:#eff6ff !important;
}

/* Helper copy */
.ep-scanner-input ~ p{
  color:#8292aa !important;
}

/* Camera area */
.ep-scanner-camera{
  margin-top:18px !important;
  border-radius:18px !important;
  border-color:rgba(96,165,250,.24) !important;
  background:#050b15 !important;
  box-shadow:0 14px 34px rgba(0,0,0,.22) !important;
}

/* "Poslednja skeniranja" card */
.ep-scanner-hero + div,
.ep-scanner-hero ~ div{
  border-radius:22px !important;
}
.ep-scanner-hero + div[class*="border"]{
  border-color:#dbe3ee !important;
  box-shadow:0 8px 24px rgba(15,23,42,.045) !important;
}

/* Responsive scanner */
@media(max-width:1023px){
  .ep-scanner-hero .mt-6.grid.grid-cols-1.gap-4{
    grid-template-columns:1fr !important;
  }
}
@media(max-width:639px){
  .ep-scanner-hero{
    padding:20px 16px 22px !important;
    border-radius:20px !important;
  }
  .ep-scanner-hero h1{
    font-size:27px !important;
  }
  .ep-scanner-mode{
    width:100%;
  }
  .ep-scanner-hero .mt-6.grid.grid-cols-1.gap-4 > div{
    padding:14px;
    border-radius:16px;
  }
}

/* ===== redesign-v11.css ===== */

/* =========================================================
   ePopis Redesign V11
   Dropdown layering fix — no layout expansion / no clipping
   ========================================================= */

/* ---------- shared custom select ---------- */
.ep-custom-select{
  position:relative !important;
}
.ep-custom-select[open]{
  z-index:500 !important;
}
.ep-custom-select-menu{
  position:absolute !important;
  top:calc(100% + 8px) !important;
  bottom:auto !important;
  left:auto !important;
  right:0 !important;
  margin:0 !important;
  transform:none !important;
  z-index:99999 !important;
  background:#fff !important;
  box-shadow:0 18px 40px rgba(15,23,42,.16) !important;
  overflow:hidden !important;
}

/* ---------- Assets: Po strani ---------- */
.ep-page-size{
  position:relative !important;
  align-items:center !important;
  min-width:auto !important;
  margin:0 !important;
}
.ep-page-size > span{
  padding-top:0 !important;
}
.ep-page-size .ep-custom-select{
  position:relative !important;
}
.ep-page-size .ep-custom-select-menu{
  width:110px !important;
  min-width:110px !important;
  right:0 !important;
  left:auto !important;
}

/* The whole filters/saved-filters container must allow the menu to float out. */
.neo-app main section div[class*="rounded-3xl"][class*="border"][class*="bg-white"],
.neo-app main section div[class*="rounded-[20px]"][class*="border"][class*="bg-white"]{
  overflow:visible !important;
}

/* Assets filters area sits above the saved-filter/table region while menu is open. */
.ep-assets-results-row{
  position:relative !important;
  z-index:120 !important;
  min-height:40px !important;
}
.ep-assets-results-row:has(.ep-custom-select[open]){
  z-index:1000 !important;
}

/* ---------- Annual inventory filter ---------- */
.ep-annual-filter{
  position:relative !important;
  z-index:150 !important;
}
.ep-annual-filter[open]{
  z-index:1200 !important;
}
.ep-annual-filter .ep-custom-select-menu{
  width:100% !important;
  min-width:220px !important;
  right:0 !important;
  left:auto !important;
}

/* Filter card must never clip the dropdown. */
.ep-annual-detail-panel,
.ep-annual-filter-panel{
  position:relative !important;
  overflow:visible !important;
  z-index:120 !important;
}

/* Table always stays below the dropdown layer. */
.ep-annual-detail-table,
.ep-annual-items{
  position:relative !important;
  z-index:1 !important;
}

/* Remove V10's in-flow expansion effect completely. */
.ep-page-size .ep-custom-select-menu,
.ep-annual-filter .ep-custom-select-menu{
  max-height:260px !important;
}

/* Dark */
html.dark .ep-custom-select-menu{
  background:#0f172a !important;
  border-color:#334155 !important;
}

/* Mobile: menu can align to left if space is tight */
@media(max-width:639px){
  .ep-page-size .ep-custom-select-menu{
    right:0 !important;
  }
  .ep-annual-filter .ep-custom-select-menu{
    left:0 !important;
    right:auto !important;
  }
}

/* ===== redesign-v12.css ===== */

/* =========================================================
   ePopis Redesign V12
   Final dropdown sizing + Reports/Activities polish
   ========================================================= */

/* ---------- Fix giant empty area around custom selects ---------- */
/* The cause is the open <details> affecting parent row height.
   Keep details compact and absolutely position the menu. */
.ep-custom-select{
  display:inline-block !important;
  vertical-align:top;
}
.ep-custom-select > summary{
  position:relative;
  z-index:2;
}
.ep-custom-select-menu{
  position:absolute !important;
  top:calc(100% + 8px) !important;
  left:0 !important;
  right:auto !important;
  width:max-content !important;
  min-width:100% !important;
  max-width:320px !important;
  max-height:280px !important;
  overflow-y:auto !important;
  z-index:99999 !important;
}

/* Parent rows should not inherit menu height. */
.ep-page-size,
.ep-annual-filter,
.ep-activity-filter{
  height:fit-content !important;
}
.ep-page-size[open],
.ep-annual-filter[open],
.ep-activity-filter[open]{
  height:fit-content !important;
}

/* Assets */
.ep-assets-results-row{
  min-height:36px !important;
  align-items:center !important;
}
.ep-page-size{
  width:auto !important;
}
.ep-page-size .ep-custom-select-trigger{
  width:92px !important;
  min-width:92px !important;
}
.ep-page-size .ep-custom-select-menu{
  width:110px !important;
  min-width:110px !important;
  left:auto !important;
  right:0 !important;
}

/* Annual inventory */
.ep-annual-filter{
  width:100% !important;
}
.ep-annual-filter .ep-custom-select-trigger{
  width:100% !important;
}
.ep-annual-filter .ep-custom-select-menu{
  width:100% !important;
  min-width:100% !important;
  left:0 !important;
  right:auto !important;
}
.ep-annual-detail-panel,
.ep-annual-filter-panel{
  overflow:visible !important;
  position:relative !important;
  z-index:30 !important;
}
.ep-annual-detail-table,
.ep-annual-items{
  position:relative !important;
  z-index:1 !important;
}

/* ---------- Reports ---------- */
/* Keep hero rounded and compact, only remove redundant kicker. */
.neo-app main section [class*="bg-gradient-to-br"][class*="from-slate-950"]{
  border-radius:24px !important;
}
.neo-app main section [class*="bg-gradient-to-br"][class*="from-slate-950"] h1{
  margin-top:0 !important;
}

/* ---------- Activities ---------- */
.ep-activities-filter-card{
  border-radius:22px !important;
  border-color:#dbe3ee !important;
  box-shadow:0 8px 22px rgba(15,23,42,.045) !important;
  overflow:visible !important;
  position:relative;
  z-index:50;
}

/* Search and activity dropdown same width/height/radius/colors */
.ep-activities-filter-card > div{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:start !important;
}
.ep-activity-search,
.ep-activity-filter .ep-custom-select-trigger{
  height:48px !important;
  min-height:48px !important;
  border-radius:14px !important;
  border:1px solid #d7e0eb !important;
  background:#fff !important;
  color:#172033 !important;
  box-shadow:none !important;
}
.ep-activity-search:focus,
.ep-activity-filter[open] .ep-custom-select-trigger{
  border-color:#60a5fa !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.09) !important;
}

/* Equal widths: both columns share the grid equally */
.ep-activity-filter{
  width:100% !important;
}
.ep-activity-filter .ep-custom-select-trigger{
  width:100% !important;
}
.ep-activity-filter-menu{
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  max-height:320px !important;
}

/* Activity cards softer and more rounded */
.ep-activity-card{
  border-radius:20px !important;
  border-color:#dbe3ee !important;
  box-shadow:0 6px 18px rgba(15,23,42,.04) !important;
}
.ep-activity-card:hover{
  border-color:#c7d5e5 !important;
  box-shadow:0 8px 22px rgba(15,23,42,.055) !important;
}
.ep-activity-card .rounded-full{
  border-radius:9px !important;
}

/* KPI summary cards under activities hero */
.neo-app main section .grid.grid-cols-1.gap-4.sm\:grid-cols-2.xl\:grid-cols-4 > div{
  border-radius:18px !important;
}

/* Dark */
html.dark .ep-activity-search,
html.dark .ep-activity-filter .ep-custom-select-trigger,
html.dark .ep-activity-filter-menu{
  background:#0f172a !important;
  border-color:#334155 !important;
  color:#e2e8f0 !important;
}

/* Responsive */
@media(max-width:900px){
  .ep-activities-filter-card > div{
    grid-template-columns:1fr !important;
  }
}

/* ===== redesign-v13.css ===== */

/* =========================================================
   ePopis Redesign V13
   Definitive dropdown fix + Activities harmonization
   ========================================================= */

/* IMPORTANT: override V10's more-specific in-flow dropdown rules. */
.ep-page-size .ep-custom-select-menu,
.ep-annual-filter .ep-custom-select-menu,
.ep-activity-filter .ep-custom-select-menu{
  position:absolute !important;
  top:calc(100% + 8px) !important;
  bottom:auto !important;
  left:auto !important;
  right:0 !important;
  margin:0 !important;
  transform:none !important;
  z-index:99999 !important;
  max-height:300px !important;
  overflow-y:auto !important;
  background:#fff !important;
  box-shadow:0 18px 40px rgba(15,23,42,.16) !important;
}

/* Opening details must never increase row/card height. */
.ep-page-size,
.ep-annual-filter,
.ep-activity-filter{
  position:relative !important;
  height:36px !important;
  min-height:36px !important;
  overflow:visible !important;
}
.ep-annual-filter,
.ep-activity-filter{
  height:48px !important;
  min-height:48px !important;
}

/* Assets page-size */
.ep-page-size{
  display:flex !important;
  align-items:center !important;
}
.ep-page-size > span{
  padding:0 !important;
}
.ep-page-size .ep-custom-select-menu{
  width:110px !important;
  min-width:110px !important;
}

/* Annual filter */
.ep-annual-filter{
  width:100% !important;
}
.ep-annual-filter .ep-custom-select-menu{
  left:0 !important;
  right:auto !important;
  width:100% !important;
  min-width:100% !important;
}
.ep-annual-detail-panel,
.ep-annual-filter-panel{
  overflow:visible !important;
  position:relative !important;
  z-index:100 !important;
}
.ep-annual-detail-table,
.ep-annual-items{
  z-index:1 !important;
}

/* Activities filter/search: equal visual weight */
.ep-activities-filter-card{
  border-radius:22px !important;
  border-color:#dbe3ee !important;
  box-shadow:0 7px 20px rgba(15,23,42,.045) !important;
  overflow:visible !important;
  position:relative !important;
  z-index:100 !important;
}
@media(min-width:1024px){
  .ep-activities-filter-card{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto !important;
  }
}
.ep-activity-search,
.ep-activity-filter .ep-custom-select-trigger{
  width:100% !important;
  height:48px !important;
  min-height:48px !important;
  border:1px solid #d7e0eb !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#172033 !important;
  box-shadow:none !important;
}
.ep-activity-search:focus,
.ep-activity-filter[open] .ep-custom-select-trigger{
  border-color:#60a5fa !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.09) !important;
}
.ep-activity-filter{
  width:100% !important;
}
.ep-activity-filter .ep-custom-select-menu{
  left:0 !important;
  right:auto !important;
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
}
.ep-activity-filter .ep-custom-select-option:hover{
  background:#eff6ff !important;
  color:#1d4ed8 !important;
}

/* Activities cards: softer, rounded, no upward jumping */
.ep-activity-card{
  border-radius:20px !important;
  border-color:#dbe3ee !important;
  box-shadow:0 6px 18px rgba(15,23,42,.04) !important;
  transform:none !important;
}
.ep-activity-card:hover{
  transform:none !important;
  border-color:#c8d5e5 !important;
  box-shadow:0 9px 24px rgba(15,23,42,.055) !important;
}
.ep-activity-card .rounded-2xl{
  border-radius:14px !important;
}
.ep-activity-card .rounded-full{
  border-radius:9px !important;
}

/* Summary cards under Activities hero */
.neo-app main section div[class*="xl:grid-cols-4"] > div{
  border-radius:18px !important;
}

/* Reports and Activities hero keep same rounded language */
.neo-app main section [class*="from-slate-950"][class*="to-blue-950"]{
  border-radius:24px !important;
}

/* Dark mode */
html.dark .ep-page-size .ep-custom-select-menu,
html.dark .ep-annual-filter .ep-custom-select-menu,
html.dark .ep-activity-filter .ep-custom-select-menu,
html.dark .ep-activity-search,
html.dark .ep-activity-filter .ep-custom-select-trigger{
  background:#0f172a !important;
  border-color:#334155 !important;
  color:#e2e8f0 !important;
}

/* Responsive */
@media(max-width:1023px){
  .ep-activities-filter-card{
    grid-template-columns:1fr !important;
  }
}

/* ===== redesign-v14.css ===== */
/* ePopis Redesign V14 */
/* definitive custom-dropdown layout containment */
details.ep-custom-select{position:relative!important;display:block!important;overflow:visible!important;margin:0!important;padding:0!important}
.ep-page-size>details.ep-custom-select{height:36px!important;min-height:36px!important;max-height:36px!important;width:92px!important}
.ep-annual-filter.ep-custom-select{height:46px!important;min-height:46px!important;max-height:46px!important;width:100%!important}
.ep-activity-filter.ep-custom-select{height:48px!important;min-height:48px!important;max-height:48px!important;width:100%!important}
.ep-custom-select-menu{position:absolute!important;top:calc(100% + 8px)!important;bottom:auto!important;margin:0!important;z-index:2147483000!important;background:#fff!important;opacity:1!important;isolation:isolate!important;box-shadow:0 18px 42px rgba(15,23,42,.18)!important}

/* parent stacking contexts: dropdown must be above following cards/tables */
.ep-assets-filter-card{position:relative!important;overflow:visible!important;z-index:40!important;border-radius:22px!important}
.ep-assets-filter-card:has(.ep-page-size details[open]){z-index:5000!important}
.ep-assets-results-row{position:relative!important;z-index:5100!important;min-height:36px!important}
.ep-page-size .ep-custom-select-menu{right:0!important;left:auto!important;width:110px!important;min-width:110px!important}

.ep-annual-detail-panel{position:relative!important;overflow:visible!important;z-index:40!important}
.ep-annual-detail-panel:has(.ep-annual-filter[open]){z-index:6000!important}
.ep-annual-filter{position:relative!important;z-index:6100!important;align-self:stretch!important}
.ep-annual-filter .ep-custom-select-menu{left:0!important;right:auto!important;width:100%!important;min-width:100%!important}
.ep-annual-detail-table{position:relative!important;z-index:1!important}

/* annual search/filter exact vertical alignment */
.ep-annual-detail-panel .grid{align-items:stretch!important}
.ep-annual-detail-panel input[placeholder*="Pretraga po nazivu"]{height:46px!important;min-height:46px!important;margin:0!important;border-radius:14px!important}
.ep-annual-filter .ep-custom-select-trigger{height:46px!important;min-height:46px!important;margin:0!important;border-radius:14px!important}

/* activities: remove white frame around hero and make sections standalone */
.ep-activities-shell{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.ep-activities-hero{border:1px solid rgba(148,163,184,.12)!important;box-shadow:0 12px 28px rgba(15,23,42,.11)!important}
.ep-activities-stats{box-shadow:0 6px 18px rgba(15,23,42,.04)!important}
.ep-activities-stats>div{border-radius:18px!important;border:1px solid #e7edf4!important;box-shadow:none!important}
.ep-activities-filter-card{border-radius:22px!important;overflow:visible!important;position:relative!important;z-index:45!important}
.ep-activities-filter-card:has(.ep-activity-filter[open]){z-index:7000!important}
.ep-activity-search,.ep-activity-filter .ep-custom-select-trigger{height:48px!important;min-height:48px!important;border-radius:14px!important;border-color:#d7e0eb!important;background:#fff!important}
.ep-activity-filter .ep-custom-select-menu{left:0!important;right:auto!important;width:100%!important;min-width:100%!important;max-width:none!important}
.ep-activity-card{border-radius:20px!important;box-shadow:0 5px 16px rgba(15,23,42,.035)!important}

/* shared secondary/admin pages */
.ep-admin-hero,.ep-trash-hero{border:1px solid rgba(148,163,184,.12)!important;box-shadow:0 12px 28px rgba(15,23,42,.10)!important}
/* Settings already carries ep-annual-hero from earlier builds; normalize it too */
.ep-annual-hero{border-radius:24px!important;padding:28px!important;box-shadow:0 12px 28px rgba(15,23,42,.10)!important}

/* consistent softer cards on administration/account screens */
.neo-app main section .rounded-3xl.border.border-slate-200.bg-white,
.neo-app main section div.rounded-3xl.border.border-slate-200.bg-white,
.neo-app main section form.rounded-3xl.border.border-slate-200.bg-white{border-radius:20px!important;box-shadow:0 5px 18px rgba(15,23,42,.04)!important}
.neo-app main section button.rounded-2xl,.neo-app main section a.rounded-2xl{border-radius:13px!important}
.neo-app main section input.rounded-2xl,.neo-app main section select.rounded-2xl{border-radius:14px!important}

@media(max-width:639px){.ep-admin-hero,.ep-trash-hero,.ep-activities-hero,.ep-activities-stats,.ep-assets-filter-card{border-radius:18px!important}.ep-annual-hero{padding:20px!important;border-radius:18px!important}}

/* ===== redesign-v15.css ===== */

/* =========================================================
   ePopis Redesign V15
   Clipping fix + Activities rounding + Users search + Profile button
   ========================================================= */

/* ---------------------------------------------------------
   HARD FIX: dropdown clipping
   The menu must escape any rounded/overflow-hidden ancestors.
   --------------------------------------------------------- */

/* Any working-area wrapper around custom selects must allow overflow. */
.ep-assets-results-row,
.ep-page-size,
.ep-annual-filter,
.ep-activity-filter,
.ep-activities-filter-card,
.ep-annual-detail-panel,
.ep-annual-filter-panel,
.neo-app main section,
.neo-app main section > div,
.neo-app main section > div > div{
  overflow:visible !important;
}

/* Dropdown container itself */
.ep-custom-select{
  position:relative !important;
  overflow:visible !important;
  z-index:200 !important;
}
.ep-custom-select[open]{
  z-index:999999 !important;
}

/* Menu floats cleanly over following sections */
.ep-custom-select-menu,
.ep-page-size .ep-custom-select-menu,
.ep-annual-filter .ep-custom-select-menu,
.ep-activity-filter .ep-custom-select-menu{
  position:absolute !important;
  top:calc(100% + 8px) !important;
  bottom:auto !important;
  left:auto !important;
  right:0 !important;
  margin:0 !important;
  transform:none !important;
  z-index:2147483000 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  max-height:280px !important;
  background:#fff !important;
  border:1px solid #dbe3ee !important;
  border-radius:14px !important;
  box-shadow:0 22px 50px rgba(15,23,42,.18) !important;
}

/* Keep the dropdown trigger compact; no layout growth */
.ep-page-size,
.ep-annual-filter,
.ep-activity-filter{
  height:auto !important;
  min-height:0 !important;
}

/* Assets page-size */
.ep-page-size{
  align-items:center !important;
}
.ep-page-size > span{
  padding:0 !important;
}
.ep-page-size .ep-custom-select-menu{
  width:110px !important;
  min-width:110px !important;
  right:0 !important;
}

/* Annual inventory filter */
.ep-annual-filter{
  width:100% !important;
}
.ep-annual-filter .ep-custom-select-menu{
  left:0 !important;
  right:auto !important;
  width:100% !important;
  min-width:100% !important;
}

/* Ensure following annual table is beneath dropdown */
.ep-annual-detail-table,
.ep-annual-items{
  position:relative !important;
  z-index:1 !important;
}

/* ---------------------------------------------------------
   ACTIVITIES: round the summary section container too
   --------------------------------------------------------- */

.ep-activities-summary{
  border-radius:22px !important;
}

/* The white block wrapping the four summary cards */
.ep-activities-summary,
.ep-activities-summary > div{
  border-radius:18px !important;
}

/* If the summary grid sits inside a bordered white panel, soften that panel */
.neo-app main section .ep-activities-summary{
  padding:20px !important;
}
.neo-app main section .ep-activities-summary:where([class*="bg-white"]),
.neo-app main section div:has(> .ep-activities-summary){
  border-radius:22px !important;
  overflow:hidden !important;
}

/* ---------------------------------------------------------
   USERS: add search icon visually without changing React logic
   --------------------------------------------------------- */

.ep-users-search{
  padding-left:42px !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:14px 50% !important;
  background-size:17px 17px !important;
}

/* Users filter/search card: softer corners */
.neo-app main section input.ep-users-search{
  border-radius:14px !important;
}

/* ---------------------------------------------------------
   MY ACCOUNT: polish "Promeni fotografiju" action
   --------------------------------------------------------- */

/* Blue gradient button in profile photo card */
.neo-app main section button,
.neo-app main section label{
  transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease !important;
}

/* Target buttons inside the profile-photo card */
.neo-app main section div:has(> img[src*="avatar"]) button,
.neo-app main section div:has(> img[src*="profile"]) button{
  border-radius:12px !important;
}

/* More reliable fallback based on the photo card action layout */
.neo-app main section .flex.items-center.gap-2 button:first-of-type{
  border-radius:12px !important;
}

/* Specific look for the primary change-photo button */
.neo-app main section button[class*="bg-gradient"],
.neo-app main section button[class*="bg-blue"]{
  color:#fff !important;
}

/* Prevent muted/gray icon/text from leaking into the blue profile button */
.neo-app main section button[class*="bg-gradient"] svg,
.neo-app main section button[class*="bg-gradient"] span,
.neo-app main section button[class*="bg-gradient"]{
  color:#fff !important;
  stroke:currentColor !important;
}

/* Profile photo card */
.neo-app main section div:has(img[alt*="profil" i]){
  border-radius:22px !important;
}

/* Dark mode */
html.dark .ep-custom-select-menu{
  background:#0f172a !important;
  border-color:#334155 !important;
}
html.dark .ep-users-search{
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") !important;
}

/* Mobile */
@media(max-width:639px){
  .ep-custom-select-menu{
    max-height:240px !important;
  }
}

/* ===== redesign-v16.css ===== */

/* =========================================================
   ePopis Redesign V16 — hard fixes
   ========================================================= */

/* Portal dropdown: body-level overlay, impossible for table/card overflow to clip. */
.ep-dropdown-portal{
  position:fixed;
  z-index:2147483647;
  max-height:300px;
  overflow-y:auto;
  overflow-x:hidden;
  padding:6px;
  border:1px solid #dbe3ee;
  border-radius:14px;
  background:#fff;
  box-shadow:0 22px 50px rgba(15,23,42,.20);
}
.ep-dropdown-portal > button{
  display:flex;
  width:100%;
  align-items:center;
  min-height:38px;
  padding:8px 12px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#334155;
  font-size:12px;
  font-weight:650;
  text-align:left;
  cursor:pointer;
}
.ep-dropdown-portal > button:hover{
  background:#eff6ff;
  color:#1d4ed8;
}

/* The original menu never affects layout. */
.ep-custom-select > .ep-custom-select-menu{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  min-width:0 !important;
  max-width:1px !important;
  max-height:1px !important;
  overflow:hidden !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  box-shadow:none !important;
  pointer-events:none !important;
}
.ep-custom-select{
  overflow:visible !important;
}
.ep-custom-select[open]{
  height:auto !important;
}

/* Activities: round the entire stats section, not only the 4 inner cards. */
.ep-activities-stats{
  border-radius:22px !important;
  overflow:hidden !important;
  border:1px solid #dbe3ee !important;
  background:#f8fafc !important;
  padding:20px !important;
}
.ep-activities-stats > div{
  border-radius:18px !important;
  border:1px solid #edf1f6;
  box-shadow:0 3px 12px rgba(15,23,42,.035) !important;
}

/* Users search: visible icon + correct inset. */
.ep-users-search{
  padding-left:44px !important;
  background-color:#fff !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:15px center !important;
  background-size:17px 17px !important;
  border-radius:14px !important;
}

/* Profile photo action: blue button with white icon/text. */
label.inline-flex.cursor-pointer.items-center.gap-2[class*="bg-blue-600"]{
  border-radius:13px !important;
  background:#2563eb !important;
  color:#fff !important;
  box-shadow:0 7px 18px rgba(37,99,235,.18) !important;
}
label.inline-flex.cursor-pointer.items-center.gap-2[class*="bg-blue-600"]:hover{
  background:#1d4ed8 !important;
}
label.inline-flex.cursor-pointer.items-center.gap-2[class*="bg-blue-600"] svg{
  color:#fff !important;
  stroke:#fff !important;
}

/* Activities hero + stats no white square frame around corners. */
.ep-activities-stats{
  margin-top:16px !important;
}
.neo-app main section .ep-activities-stats{
  clip-path:inset(0 round 22px);
}

/* Dark mode */
html.dark .ep-dropdown-portal{
  background:#0f172a;
  border-color:#334155;
}
html.dark .ep-dropdown-portal > button{
  color:#cbd5e1;
}
html.dark .ep-dropdown-portal > button:hover{
  background:#172554;
  color:#bfdbfe;
}
html.dark .ep-users-search{
  background-color:#0f172a !important;
}

/* ===== redesign-v17.css ===== */


/* =========================================================
   V17 — Users search icon hard fix
   ========================================================= */

/* Target the actual users search input by placeholder too,
   in case the compiled class hook was not attached. */
input[placeholder="Pretraga po imenu, korisničkom imenu, email-u, firmi..."],
.ep-users-search{
  padding-left:44px !important;
  background-color:#fff !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:15px center !important;
  background-size:17px 17px !important;
  border-radius:14px !important;
}

html.dark input[placeholder="Pretraga po imenu, korisničkom imenu, email-u, firmi..."],
html.dark .ep-users-search{
  background-color:#0f172a !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") !important;
}

/* ===== redesign-v18.css ===== */

/* =========================================================
   ePopis Redesign V18
   Hero consistency + assets cleanup + scanner + trash + comparison
   ========================================================= */

:root{
  --ep-hero-radius:24px;
  --ep-hero-px:28px;
  --ep-hero-py:24px;
  --ep-card-radius:20px;
  --ep-control-radius:14px;
}

/* =========================================================
   GLOBAL HERO SYSTEM
   Equal inner spacing and action treatment across sections
   ========================================================= */

/* Most large section heroes */
.neo-app main section > [class*="bg-gradient-to-br"][class*="from-slate-950"],
.neo-app main section > [class*="bg-slate-950"][class*="text-white"],
.neo-app main section > [class*="from-slate-950"][class*="to-blue-950"]{
  border-radius:var(--ep-hero-radius) !important;
  padding:var(--ep-hero-py) var(--ep-hero-px) !important;
  min-height:auto !important;
  box-shadow:0 12px 30px rgba(15,23,42,.10) !important;
}

/* Same title rhythm everywhere */
.neo-app main section > [class*="from-slate-950"] h1,
.neo-app main section > [class*="bg-slate-950"] h1{
  margin:0 !important;
  font-size:clamp(2rem,2.4vw,2.55rem) !important;
  line-height:1.08 !important;
  letter-spacing:-.035em !important;
}
.neo-app main section > [class*="from-slate-950"] h1 + p,
.neo-app main section > [class*="bg-slate-950"] h1 + p{
  margin-top:10px !important;
  max-width:760px !important;
  line-height:1.65 !important;
}
.neo-app main section > [class*="from-slate-950"] p + p,
.neo-app main section > [class*="bg-slate-950"] p + p{
  margin-top:10px !important;
}

/* All hero action buttons */
.neo-app main section > [class*="from-slate-950"] button,
.neo-app main section > [class*="from-slate-950"] a,
.neo-app main section > [class*="bg-slate-950"] button,
.neo-app main section > [class*="bg-slate-950"] a{
  border-radius:13px !important;
  transform:none !important;
  transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease !important;
}
.neo-app main section > [class*="from-slate-950"] button:hover,
.neo-app main section > [class*="from-slate-950"] a:hover,
.neo-app main section > [class*="bg-slate-950"] button:hover,
.neo-app main section > [class*="bg-slate-950"] a:hover{
  transform:none !important;
}

/* =========================================================
   ASSETS
   Less crowded filter/save area
   ========================================================= */

/* Filters wrapper gets clearer grouping and less visual density */
.neo-app main section form,
.neo-app main section .ep-assets-results-row{
  position:relative;
}
.ep-assets-results-row{
  padding-top:2px !important;
}

/* Make filter block breathe without creating huge whitespace */
.neo-app main section div:has(> .ep-assets-results-row){
  border-radius:22px !important;
}
.neo-app main section .ep-assets-results-row + *{
  margin-top:10px !important;
}

/* Saved filters section */
.neo-app main section div:has(> h3):has(input[placeholder="Naziv novog filtera"]),
.neo-app main section div:has(input[placeholder="Naziv novog filtera"]){
  border-top:1px solid #e6ebf2 !important;
  padding-top:16px !important;
}
.neo-app main section input[placeholder="Naziv novog filtera"]{
  min-height:44px !important;
  border-radius:13px !important;
}
.neo-app main section input[placeholder="Naziv novog filtera"] + button{
  min-height:44px !important;
  border-radius:13px !important;
}

/* Asset table details buttons: no row-to-row shadow bleed */
.neo-app main section table a[href*="/assets/"],
.neo-app main section table button{
  transform:none !important;
}
.neo-app main section table a:has(> *),
.neo-app main section table a{
  box-shadow:none !important;
}
.neo-app main section table a[class*="bg-blue"],
.neo-app main section table button[class*="bg-blue"]{
  background:#2563eb !important;
  color:#fff !important;
  border-radius:11px !important;
  box-shadow:none !important;
}
.neo-app main section table a[class*="bg-blue"]:hover,
.neo-app main section table button[class*="bg-blue"]:hover{
  background:#1d4ed8 !important;
  box-shadow:none !important;
}

/* =========================================================
   SCANNER
   Cleaner workflow, remove redundant mode box feeling
   ========================================================= */

.ep-scanner-hero{
  padding:var(--ep-hero-py) var(--ep-hero-px) !important;
}
.ep-scanner-hero > div:first-child{
  align-items:flex-start !important;
}
.ep-scanner-hero .ep-scanner-mode{
  display:none !important;
}

/* Scanner row: keep action labels visible and consistent */
.ep-scanner-hero button{
  min-height:54px !important;
  padding-left:18px !important;
  padding-right:18px !important;
  border-radius:13px !important;
  font-weight:750 !important;
  box-shadow:none !important;
}
.ep-scanner-hero button:disabled{
  background:#334155 !important;
  color:#cbd5e1 !important;
  opacity:.75 !important;
}

/* Prevent an unlabeled disabled button from looking broken */
.ep-scanner-hero button:empty{
  display:none !important;
}

/* Scanner select/input card */
.ep-scanner-hero .mt-6.grid.grid-cols-1.gap-4 > div{
  border-radius:18px !important;
}
.ep-scanner-input{
  border-radius:13px !important;
}

/* =========================================================
   TRASH
   No unique icon in hero
   ========================================================= */

.neo-app main section > [class*="bg-gradient-to-br"][class*="red"],
.neo-app main section > [class*="from-slate-950"]{
  overflow:hidden;
}
/* Hide standalone large icon directly before Kanta heading if present */
.neo-app main section h1:where(:has(+ p)){
}

/* More reliable: hero decorative icon containers */
.neo-app main section > div:has(h1):has(p) > div:first-child > svg:only-child{
  display:none !important;
}

/* =========================================================
   COMPARISON PAGE
   Treat as a workflow instead of a generic form
   ========================================================= */

/* Main compare selection panel */
.neo-app main section div:has(select):has(button){
  border-radius:22px !important;
}

/* Side-by-side compare controls */
.neo-app main section select{
  border-radius:13px !important;
}

/* Comparison results/cards */
.neo-app main section [class*="comparison"],
.neo-app main section div:has(> h2):has(table){
  border-radius:22px !important;
}

/* Download report action style for any comparison export/download button */
.neo-app main section a[download],
.neo-app main section button[title*="izveštaj" i],
.neo-app main section button[aria-label*="izveštaj" i]{
  border-radius:13px !important;
  background:#0f172a !important;
  color:#fff !important;
}

/* =========================================================
   COMPANY LOGO IN HEADER
   ========================================================= */
.ep-company-mark img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  background:#fff;
}
.ep-company-mark{
  border:1px solid #e6ebf2;
  background:#fff !important;
}

/* =========================================================
   SOFTER CONSISTENT CARDS ACROSS ADMIN PAGES
   ========================================================= */
.neo-app main section .rounded-3xl{
  border-radius:22px !important;
}
.neo-app main section .rounded-2xl{
  border-radius:16px !important;
}
.neo-app main section .rounded-xl{
  border-radius:13px !important;
}

/* Avoid upward jump/glow effects on cards */
.neo-app main section [class*="hover:-translate-y"]{
  transform:none !important;
}
.neo-app main section [class*="shadow-xl"],
.neo-app main section [class*="shadow-2xl"]{
  box-shadow:0 10px 26px rgba(15,23,42,.06) !important;
}

/* Mobile hero rhythm */
@media(max-width:639px){
  :root{
    --ep-hero-px:18px;
    --ep-hero-py:20px;
    --ep-hero-radius:20px;
  }
}

/* ===== redesign-v19.css ===== */

/* =========================================================
   ePopis Redesign V19
   Users page — real search icon + repaired action buttons
   ========================================================= */

.ep-users-search-wrap{
  position:relative !important;
  width:100% !important;
}

.ep-users-search-wrap::before{
  content:"" !important;
  position:absolute !important;
  left:16px !important;
  top:50% !important;
  width:18px !important;
  height:18px !important;
  transform:translateY(-50%) !important;
  z-index:3 !important;
  pointer-events:none !important;
  background:
    center / 18px 18px no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") !important;
}

.ep-users-search-wrap .ep-users-search{
  width:100% !important;
  padding-left:46px !important;
  background-image:none !important;
  background-color:#fff !important;
  border-radius:14px !important;
}

/* Repair the button that was accidentally caught by broad blue-button rules. */
.ep-user-add-company{
  background:#eff6ff !important;
  border-color:#bfdbfe !important;
  color:#1d4ed8 !important;
  box-shadow:none !important;
  border-radius:13px !important;
}

.ep-user-add-company:hover:not(:disabled){
  background:#dbeafe !important;
  border-color:#93c5fd !important;
  color:#1d4ed8 !important;
}

.ep-user-add-company:disabled{
  background:#f8fafc !important;
  border-color:#e2e8f0 !important;
  color:#94a3b8 !important;
  opacity:1 !important;
  cursor:not-allowed !important;
}

.ep-user-reset-password{
  background:#fff !important;
  border-color:#dbe3ee !important;
  color:#334155 !important;
  box-shadow:none !important;
  border-radius:13px !important;
}

.ep-user-reset-password:hover{
  background:#f8fafc !important;
  border-color:#cbd5e1 !important;
}

/* Keep user search/filter controls visually aligned. */
.ep-users-search-wrap,
.ep-users-search-wrap .ep-users-search{
  min-height:48px !important;
  height:48px !important;
}

html.dark .ep-users-search-wrap .ep-users-search{
  background:#0f172a !important;
  border-color:#334155 !important;
  color:#e2e8f0 !important;
}

/* ===== redesign-v23-fixes.css ===== */
/* ePopis V23 — precise fixes for the V19 bundle. */

/* Asset detail back control */
.ep-asset-back {
  text-decoration: none !important;
  transition: color .15s ease !important;
}
.ep-asset-back:hover { color: #1d4ed8 !important; }
.ep-asset-back-icon {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid #dbe3ee;
  border-radius: 10px;
  background: #fff;
  color: #2563eb;
  font-size: 24px;
  font-weight: 500;
  line-height: 1;
}

/* Real company logo rendered by React */
.ep-company-mark img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 2px;
  background: #fff;
  object-fit: contain !important;
}

/* Assets: keep one outer card, not a second rounded/bordered shell. */
.ep-assets-filter-card > div:first-child {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.ep-assets-filter-card > div:first-child::before,
.ep-assets-filter-card > div:first-child::after {
  display: none !important;
}

/* Scanner: compact workflow and readable input/action states. */
.ep-scanner-hero:has(.ep-scanner-input) {
  padding: 26px 28px !important;
}
.ep-scanner-hero:has(.ep-scanner-input) > div:first-child {
  display: block !important;
}
.ep-scanner-hero:has(.ep-scanner-input) .mt-6.grid {
  align-items: start !important;
  margin-top: 20px !important;
}
.ep-scanner-hero:has(.ep-scanner-input) .mt-6.grid > div {
  align-self: start !important;
  min-height: 0 !important;
}
.ep-scanner-input,
.ep-scanner-input:focus,
.ep-scanner-input:not(:placeholder-shown) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  caret-color: #fff !important;
  background: #0f1b33 !important;
  opacity: 1 !important;
}
.ep-scanner-input::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  opacity: 1 !important;
}
.ep-scanner-hero:has(.ep-scanner-input) button:disabled {
  background: #263752 !important;
  border-color: #3c4d68 !important;
  color: #dbe6f5 !important;
  -webkit-text-fill-color: #dbe6f5 !important;
  opacity: 1 !important;
}
.ep-scanner-hero:has(.ep-scanner-input) button:not(:disabled)[class*="bg-blue"] {
  background: #2563eb !important;
  color: #fff !important;
}

/* Comparison workflow */
.ep-comparison-controls,
.ep-comparison-result-head,
.ep-comparison-stat,
.ep-comparison-table {
  border-radius: 20px !important;
  box-shadow: none !important;
}
.ep-comparison-swap:not(:disabled):hover {
  border-color: #93c5fd !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}
.ep-comparison-table tbody tr:hover { background: #f8fafc; }

@media (max-width: 767px) {
  .ep-scanner-hero:has(.ep-scanner-input) { padding: 22px 20px !important; }
  .ep-comparison-swap { width: 100% !important; }
}

/* ===== redesign-v24-fixes.css ===== */
/* ePopis V24 final corrections */

.ep-asset-detail-header {
  margin: 0 !important;
  border-radius: 22px !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .06) !important;
}
.ep-asset-back-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 0 2px !important;
  line-height: 0 !important;
  font-family: Arial, sans-serif !important;
}

/* Exactly one visual shell around Assets filters. */
.ep-assets-filter-card {
  border: 1px solid #dbe3ee !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: #fff !important;
  clip-path: inset(0 round 22px) !important;
}
.ep-assets-filter-card > div:first-child {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.ep-assets-filter-card > div:first-child::before,
.ep-assets-filter-card > div:first-child::after { content: none !important; }

/* Scanner submit has its own stable state; no inherited opacity tricks. */
.ep-scanner-submit {
  border: 1px solid transparent !important;
  background: #2563eb !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  opacity: 1 !important;
  box-shadow: none !important;
}
.ep-scanner-submit:hover:not(:disabled) { background: #1d4ed8 !important; }
.ep-scanner-submit:disabled {
  border-color: #475569 !important;
  background: #334155 !important;
  color: #e2e8f0 !important;
  -webkit-text-fill-color: #e2e8f0 !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

/* Users */
.neo-app .ep-user-add-company {
  border-color: #bfdbfe !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  -webkit-text-fill-color: #1d4ed8 !important;
  opacity: 1 !important;
  box-shadow: none !important;
}
.neo-app .ep-user-add-company:hover:not(:disabled) { background: #dbeafe !important; }
.neo-app .ep-user-add-company:disabled {
  border-color: #cbd5e1 !important;
  background: #f1f5f9 !important;
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
  opacity: 1 !important;
}

/* Settings design system */
.ep-settings-page { max-width: 100% !important; }
.ep-settings-hero {
  border: 0 !important;
  border-radius: 24px !important;
  padding: 26px 28px !important;
  background: linear-gradient(135deg, #071124 0%, #101d39 58%, #143b79 100%) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, .09) !important;
}
.ep-settings-hero h1 { margin: 0 !important; font-size: 30px !important; line-height: 1.15 !important; }
.ep-settings-hero h1 + p { margin-top: 10px !important; }
.ep-settings-hero p + p { margin-top: 8px !important; }

.ep-settings-theme,
.ep-settings-companies,
.ep-settings-branding,
.ep-settings-labels,
.ep-settings-catalog,
.ep-settings-backup {
  border: 1px solid #dbe3ee !important;
  border-radius: 20px !important;
  background: #fff !important;
  padding: 24px !important;
  box-shadow: none !important;
}
.ep-settings-page h2 {
  color: #0f172a !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  letter-spacing: -.015em !important;
}
.ep-settings-page input:not([type="checkbox"]):not([type="color"]),
.ep-settings-page textarea {
  min-height: 46px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  box-shadow: none !important;
}
.ep-settings-page input:focus,
.ep-settings-page textarea:focus {
  border-color: #3b82f6 !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, .12) !important;
}
.ep-settings-page button {
  border-radius: 12px !important;
  box-shadow: none !important;
  transform: none !important;
}
.ep-settings-edit {
  border-color: #93c5fd !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  -webkit-text-fill-color: #1d4ed8 !important;
  opacity: 1 !important;
}
.ep-settings-edit:hover { background: #dbeafe !important; }
.ep-settings-catalog-grid { align-items: start !important; }
.ep-settings-catalog > div:last-child { border-radius: 16px !important; }
.ep-settings-catalog > div:last-child > div > div {
  gap: 10px !important;
  padding: 15px 16px !important;
}
.ep-settings-branding label { color: #334155 !important; }
.ep-settings-branding label > span { border-radius: 14px !important; }
.ep-settings-labels label { border-radius: 14px !important; }

@media (max-width: 1279px) {
  .ep-settings-catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 767px) {
  .ep-asset-detail-header { border-radius: 18px !important; }
  .ep-settings-hero { padding: 22px 20px !important; border-radius: 20px !important; }
  .ep-settings-theme,
  .ep-settings-companies,
  .ep-settings-branding,
  .ep-settings-labels,
  .ep-settings-catalog,
  .ep-settings-backup { padding: 19px !important; border-radius: 18px !important; }
  .ep-settings-catalog-grid { grid-template-columns: 1fr !important; }
}

/* ===== redesign-v25-fixes.css ===== */
/* V25 — structural Assets fix, compact Settings, Account and dark badges */

/* The old inner Assets wrapper no longer creates its own visual box. */
.ep-assets-filter-card > div:first-child {
  display: contents !important;
}
.ep-assets-filter-card > div:first-child > div:first-child {
  padding: 16px 16px 0 !important;
}
.ep-assets-filter-card .ep-assets-results-row {
  margin: 0 16px !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid #e2e8f0 !important;
}
.ep-assets-filter-card .ep-assets-results-row + div {
  margin: 0 !important;
  padding: 16px !important;
  border: 0 !important;
}

/* Settings: same options, lower visual density and clearer groups. */
.ep-settings-page {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, .72fr) !important;
  gap: 18px !important;
}
.ep-settings-page > * { margin: 0 !important; min-width: 0 !important; }
.ep-settings-hero,
.ep-settings-companies,
.ep-settings-catalog-grid { grid-column: 1 / -1 !important; }
.ep-settings-theme { grid-column: 1 !important; }
.ep-settings-branding { grid-column: 1 !important; }
.ep-settings-labels { grid-column: 2 !important; grid-row: 3 / span 2 !important; }
.ep-settings-backup { grid-column: 2 !important; }
.ep-settings-theme,
.ep-settings-companies,
.ep-settings-branding,
.ep-settings-labels,
.ep-settings-catalog,
.ep-settings-backup {
  padding: 20px !important;
  border-radius: 18px !important;
}
.ep-settings-theme > div:last-child {
  margin-top: 14px !important;
  flex-direction: row !important;
}
.ep-settings-theme button { min-height: 42px !important; padding: 9px 16px !important; }
.ep-settings-companies > div:first-child { align-items: center !important; }
.ep-settings-companies form { margin-top: 14px !important; }
.ep-settings-companies > div:last-child { margin-top: 14px !important; }

.ep-settings-branding > div {
  grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr) 96px 96px !important;
  align-items: end !important;
  gap: 12px !important;
}
.ep-settings-branding input[type="color"] {
  width: 72px !important;
  height: 46px !important;
  padding: 4px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 12px !important;
  background: #fff !important;
}
.ep-settings-branding > button { margin-top: 16px !important; }
.ep-settings-labels > div { gap: 10px !important; }
.ep-settings-labels label { padding: 12px !important; }
.ep-settings-catalog-grid { gap: 18px !important; }
.ep-settings-catalog { padding: 18px !important; }
.ep-settings-catalog form { margin-top: 14px !important; }
.ep-settings-catalog > div:last-child { margin-top: 14px !important; }

/* Account follows the same full-width page system. */
.ep-account-page { width: 100% !important; max-width: none !important; margin: 0 !important; }
.ep-account-hero {
  padding: 26px 28px !important;
  border-radius: 24px !important;
  box-shadow: 0 12px 30px rgba(15,23,42,.09) !important;
}
.ep-account-hero h1 { margin: 0 !important; font-size: 30px !important; }
.ep-account-hero > div:last-child { margin-top: 18px !important; max-width: 420px !important; }
.ep-account-photo,
.ep-account-personal,
.ep-account-password {
  border-radius: 20px !important;
  box-shadow: none !important;
}
.ep-account-personal,
.ep-account-password { max-width: none !important; }

/* Consistent dark-theme badges and labels. */
html.dark .neo-app [class*="bg-emerald-100"][class*="text-emerald-700"],
html.dark .neo-app [class*="bg-emerald-50"][class*="text-emerald-700"] {
  border-color: rgba(52,211,153,.35) !important;
  background: rgba(16,185,129,.18) !important;
  color: #a7f3d0 !important;
  -webkit-text-fill-color: #a7f3d0 !important;
}
html.dark .neo-app [class*="bg-blue-100"][class*="text-blue-700"],
html.dark .neo-app [class*="bg-blue-50"][class*="text-blue-700"] {
  border-color: rgba(96,165,250,.35) !important;
  background: rgba(37,99,235,.20) !important;
  color: #bfdbfe !important;
  -webkit-text-fill-color: #bfdbfe !important;
}
html.dark .neo-app [class*="bg-amber-100"],
html.dark .neo-app [class*="bg-amber-50"] {
  border-color: rgba(251,191,36,.38) !important;
  background: rgba(217,119,6,.20) !important;
  color: #fde68a !important;
  -webkit-text-fill-color: #fde68a !important;
}
html.dark .neo-app [class*="bg-red-100"],
html.dark .neo-app [class*="bg-red-50"] {
  border-color: rgba(248,113,113,.38) !important;
  background: rgba(220,38,38,.18) !important;
  color: #fecaca !important;
  -webkit-text-fill-color: #fecaca !important;
}
html.dark .ep-settings-page > :not(.ep-settings-hero),
html.dark .ep-account-photo,
html.dark .ep-account-personal,
html.dark .ep-account-password {
  border-color: #27364d !important;
  background: #0f172a !important;
}
html.dark .ep-settings-page h2,
html.dark .ep-account-page h2,
html.dark .ep-settings-page label,
html.dark .ep-account-page label { color: #e5edf8 !important; }
html.dark .ep-settings-page p,
html.dark .ep-account-page p { color: #94a3b8 !important; }
html.dark .ep-settings-page input:not([type="color"]),
html.dark .ep-account-page input {
  border-color: #334155 !important;
  background: #111c31 !important;
  color: #f1f5f9 !important;
  -webkit-text-fill-color: #f1f5f9 !important;
}

@media (max-width: 1100px) {
  .ep-settings-page { grid-template-columns: 1fr !important; }
  .ep-settings-page > * { grid-column: 1 !important; grid-row: auto !important; }
  .ep-settings-branding > div { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 700px) {
  .ep-settings-branding > div { grid-template-columns: 1fr !important; }
  .ep-settings-branding input[type="color"] { width: 100% !important; }
  .ep-account-hero { padding: 22px 20px !important; border-radius: 20px !important; }
}

/* ===== redesign-v26-fixes.css ===== */
/* V26 — stable Settings flow, catalog expansion and consistent actions */

/* Remove the separator below page-size controls. */
.ep-assets-filter-card .ep-assets-results-row {
  border-bottom: 0 !important;
}

/* Settings use a predictable document flow: no explicit grid rows. */
.ep-settings-page {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  grid-auto-flow: row dense !important;
  gap: 18px !important;
}
.ep-settings-page > * {
  width: 100% !important;
  margin: 0 !important;
  grid-column: auto !important;
  grid-row: auto !important;
}
.ep-settings-page > .ep-settings-hero,
.ep-settings-page > .ep-settings-companies,
.ep-settings-page > .ep-settings-catalog-grid { grid-column: 1 / -1 !important; }
.ep-settings-theme {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  gap: 18px !important;
}
.ep-settings-theme > div:last-child {
  margin: 0 !important;
  white-space: nowrap !important;
}
.ep-settings-branding > div {
  grid-template-columns: minmax(260px,1.35fr) minmax(260px,1fr) 100px 100px !important;
}
.ep-settings-labels > div:first-of-type {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
}
.ep-settings-catalog-grid {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 18px !important;
  align-items: start !important;
}
.ep-settings-catalog {
  height: auto !important;
  align-self: start !important;
}
.ep-settings-catalog > div:last-of-type {
  overflow: hidden !important;
  border-radius: 15px !important;
}
.ep-catalog-more-wrap {
  padding: 12px !important;
  border-top: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
  text-align: center !important;
}
.ep-catalog-more {
  width: 100% !important;
  min-height: 40px !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 11px !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}
.ep-catalog-more:hover { background: #dbeafe !important; }

/* One primary visual language across application actions. */
.neo-app main button[class~="bg-blue-600"],
.neo-app main a[class~="bg-blue-600"],
.neo-app main button[class*="bg-gradient-to-r"][class*="from-blue"],
.neo-app main a[class*="bg-gradient-to-r"][class*="from-blue"] {
  border-color: transparent !important;
  background: linear-gradient(135deg,#2563eb 0%,#06b6d4 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 8px 18px rgba(37,99,235,.16) !important;
}
.neo-app main button[class~="bg-blue-600"]:hover,
.neo-app main a[class~="bg-blue-600"]:hover {
  background: linear-gradient(135deg,#1d4ed8 0%,#0891b2 100%) !important;
  box-shadow: 0 10px 22px rgba(37,99,235,.22) !important;
}
.neo-app main button[class~="bg-red-600"] {
  background: linear-gradient(135deg,#dc2626 0%,#ef4444 100%) !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(220,38,38,.14) !important;
}
.neo-app main button:disabled {
  box-shadow:none !important;
}

html.dark .ep-catalog-more-wrap {
  border-color:#27364d !important;
  background:#111c31 !important;
}
html.dark .ep-catalog-more {
  border-color:rgba(96,165,250,.35) !important;
  background:rgba(37,99,235,.18) !important;
  color:#bfdbfe !important;
}

@media(max-width:1100px){
  .ep-settings-page { grid-template-columns:1fr !important; }
  .ep-settings-page > * { grid-column:1 !important; }
  .ep-settings-branding > div { grid-template-columns:1fr 1fr !important; }
  .ep-settings-catalog-grid { grid-template-columns:1fr !important; }
}
@media(max-width:700px){
  .ep-settings-theme { grid-template-columns:1fr !important; }
  .ep-settings-theme > div:last-child { white-space:normal !important; }
  .ep-settings-branding > div,
  .ep-settings-labels > div:first-of-type { grid-template-columns:1fr !important; }
}

/* ===== redesign-v27-fixes.css ===== */
/* V27 — tabbed Settings and reliable page-size control */

.ep-page-size-select {
  cursor: pointer !important;
  appearance: auto !important;
  color-scheme: light !important;
}
html.dark .ep-page-size-select {
  border-color:#334155 !important;
  background:#0f172a !important;
  color:#e2e8f0 !important;
  color-scheme:dark !important;
}

.ep-settings-page {
  display:flex !important;
  flex-direction:column !important;
  gap:18px !important;
}
.ep-settings-tabs {
  display:flex !important;
  gap:8px !important;
  width:100% !important;
  padding:7px !important;
  border:1px solid #dbe3ee !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:none !important;
}
.ep-settings-tab {
  min-height:42px !important;
  padding:0 20px !important;
  border:0 !important;
  border-radius:11px !important;
  background:transparent !important;
  color:#64748b !important;
  font-size:13px !important;
  font-weight:800 !important;
  box-shadow:none !important;
}
.ep-settings-tab:hover { background:#f1f5f9 !important; color:#0f172a !important; }
.ep-settings-tab.is-active {
  background:linear-gradient(135deg,#2563eb,#06b6d4) !important;
  color:#fff !important;
  box-shadow:0 7px 16px rgba(37,99,235,.16) !important;
}
.ep-settings-theme,
.ep-settings-branding,
.ep-settings-companies,
.ep-settings-labels,
.ep-settings-backup,
.ep-settings-catalog-grid { width:100% !important; }
.ep-settings-theme {
  min-height:0 !important;
  grid-template-columns:1fr auto !important;
}
.ep-settings-branding > div {
  grid-template-columns:minmax(250px,1.4fr) minmax(240px,1fr) 100px 100px !important;
}

.ep-settings-catalog-grid {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}
.ep-settings-catalog {
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
  min-height:520px !important;
}
.ep-settings-catalog form {
  min-height:150px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
}
.ep-settings-catalog > div:last-of-type {
  width:100% !important;
}
.ep-settings-catalog .ep-catalog-more-wrap {
  margin-top:auto !important;
  width:100% !important;
}

html.dark .ep-settings-tabs {
  border-color:#27364d !important;
  background:#0f172a !important;
}
html.dark .ep-settings-tab { color:#94a3b8 !important; }
html.dark .ep-settings-tab:hover { background:#17233a !important; color:#fff !important; }
html.dark .ep-settings-tab.is-active { color:#fff !important; }

@media(max-width:1100px){
  .ep-settings-catalog-grid { grid-template-columns:1fr !important; }
  .ep-settings-catalog { min-height:0 !important; }
  .ep-settings-catalog form { min-height:0 !important; }
}
@media(max-width:700px){
  .ep-settings-tabs { overflow-x:auto !important; }
  .ep-settings-tab { flex:0 0 auto !important; }
  .ep-settings-branding > div { grid-template-columns:1fr !important; }
}
/* V28 — page-size portal, compact catalog rows and aligned branding controls */

.ep-page-size-select {
  height: 40px !important;
  width: 92px !important;
  padding: 0 34px 0 14px !important;
  border: 1px solid #d7e0ec !important;
  border-radius: 13px !important;
  background-color: #fff !important;
  background-image: linear-gradient(45deg,transparent 50%,#8aa0bd 50%),linear-gradient(135deg,#8aa0bd 50%,transparent 50%) !important;
  background-position: calc(100% - 17px) 17px,calc(100% - 12px) 17px !important;
  background-size: 5px 5px,5px 5px !important;
  background-repeat: no-repeat !important;
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 40px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
}
.ep-page-size-select:focus {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 3px rgba(59,130,246,.13) !important;
}
.ep-page-size-portal {
  position: fixed !important;
  z-index: 2147483000 !important;
  padding: 6px !important;
  border: 1px solid #dbe3ee !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 18px 44px rgba(15,23,42,.18) !important;
}
.ep-page-size-portal button {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 38px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-align: left !important;
  cursor: pointer !important;
}
.ep-page-size-portal button:hover { background:#f1f5f9 !important; color:#0f172a !important; }
.ep-page-size-portal button.is-active {
  background: linear-gradient(135deg,#2563eb,#06b6d4) !important;
  color: #fff !important;
}

.ep-settings-branding > div > label:first-child > span {
  height: 60px !important;
  min-height: 60px !important;
  padding: 8px 12px !important;
}
.ep-settings-branding > div > label:nth-child(2) input {
  height: 60px !important;
  min-height: 60px !important;
  margin-top: 8px !important;
}
.ep-settings-branding input[type="color"] {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  padding: 4px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  cursor: pointer !important;
}
.ep-settings-branding input[type="color"]::-webkit-color-swatch-wrapper { padding:0 !important; }
.ep-settings-branding input[type="color"]::-webkit-color-swatch { border:0 !important; border-radius:999px !important; }
.ep-settings-branding input[type="color"]::-moz-color-swatch { border:0 !important; border-radius:999px !important; }

.ep-settings-catalog .ep-catalog-code {
  display:inline-flex !important;
  align-items:center !important;
  min-height:22px !important;
  white-space:nowrap !important;
}

html.dark .ep-page-size-select {
  border-color:#334155 !important;
  background-color:#0f172a !important;
  color:#e2e8f0 !important;
}
html.dark .ep-page-size-portal { border-color:#334155 !important; background:#0f172a !important; }
html.dark .ep-page-size-portal button { color:#cbd5e1 !important; }
html.dark .ep-page-size-portal button:hover { background:#1e293b !important; color:#fff !important; }
html.dark .ep-page-size-portal button.is-active { color:#fff !important; }

@media(max-width:700px){
  .ep-settings-branding > div > label:first-child > span,
  .ep-settings-branding > div > label:nth-child(2) input { height:56px !important; min-height:56px !important; }
}
/* V29 — simplified branding: logo and report footer only */
.ep-settings-branding > div {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: end !important;
}
.ep-settings-branding > div > label {
  min-width: 0 !important;
}
.ep-settings-branding > div > label:first-child > span,
.ep-settings-branding > div > label:nth-child(2) input {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 68px !important;
  min-height: 68px !important;
}
.ep-settings-branding > div > label:nth-child(2) input {
  padding: 0 16px !important;
}
@media(max-width:700px){
  .ep-settings-branding > div { grid-template-columns:1fr !important; }
  .ep-settings-branding > div > label:first-child > span,
  .ep-settings-branding > div > label:nth-child(2) input {
    height:60px !important;
    min-height:60px !important;
  }
}
/* V30 — final interface design system, phase 1 */
:root {
  --ep-primary-a:#2563eb;
  --ep-primary-b:#06b6d4;
  --ep-primary-hover-a:#1d4ed8;
  --ep-primary-hover-b:#0891b2;
  --ep-danger:#dc2626;
  --ep-danger-hover:#b91c1c;
  --ep-text:#0f172a;
  --ep-muted:#64748b;
  --ep-border:#dbe3ee;
  --ep-surface:#ffffff;
  --ep-surface-soft:#f8fafc;
  --ep-control-radius:13px;
  --ep-card-radius:20px;
  --ep-hero-radius:24px;
  --ep-hero-x:28px;
  --ep-hero-y:24px;
  --ep-control-height:44px;
}

/* One hero geometry and typography across every application page. */
:where(.ep-dashboard-hero,.ep-assets-hero,.ep-annual-hero,.ep-scanner-hero,
  .ep-reports-hero,.ep-activities-hero,.ep-admin-hero,.ep-settings-hero,
  .ep-trash-hero,.ep-comparison-hero,.ep-account-hero) {
  box-sizing:border-box !important;
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding:var(--ep-hero-y) var(--ep-hero-x) !important;
  border:1px solid rgba(148,163,184,.14) !important;
  border-radius:var(--ep-hero-radius) !important;
  box-shadow:0 12px 28px rgba(15,23,42,.10) !important;
}
:where(.ep-dashboard-hero,.ep-assets-hero,.ep-annual-hero,.ep-scanner-hero,
  .ep-reports-hero,.ep-activities-hero,.ep-admin-hero,.ep-settings-hero,
  .ep-trash-hero,.ep-comparison-hero,.ep-account-hero) h1 {
  margin:0 !important;
  color:#fff !important;
  font-size:30px !important;
  font-weight:900 !important;
  line-height:1.16 !important;
  letter-spacing:-.025em !important;
}
:where(.ep-dashboard-hero,.ep-assets-hero,.ep-annual-hero,.ep-scanner-hero,
  .ep-reports-hero,.ep-activities-hero,.ep-admin-hero,.ep-settings-hero,
  .ep-trash-hero,.ep-comparison-hero,.ep-account-hero) h1 + p {
  margin-top:10px !important;
  color:#cbd5e1 !important;
  font-size:15px !important;
  line-height:1.65 !important;
}
:where(.ep-dashboard-hero,.ep-assets-hero,.ep-annual-hero,.ep-scanner-hero,
  .ep-reports-hero,.ep-activities-hero,.ep-admin-hero,.ep-settings-hero,
  .ep-trash-hero,.ep-comparison-hero,.ep-account-hero) h1 + p + p {
  margin-top:8px !important;
  color:#94a3b8 !important;
}

/* Primary actions. */
.neo-app main :where(button,a)[class*="bg-blue-600"],
.neo-app main :where(button,a)[class*="from-blue-600"],
.neo-app main :where(button,a)[class*="from-blue-500"] {
  min-height:42px !important;
  border:0 !important;
  border-radius:var(--ep-control-radius) !important;
  background:linear-gradient(135deg,var(--ep-primary-a),var(--ep-primary-b)) !important;
  color:#fff !important;
  box-shadow:0 7px 16px rgba(37,99,235,.16) !important;
  font-weight:800 !important;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease !important;
}
.neo-app main :where(button,a)[class*="bg-blue-600"]:not(:disabled):hover,
.neo-app main :where(button,a)[class*="from-blue-600"]:not(:disabled):hover,
.neo-app main :where(button,a)[class*="from-blue-500"]:not(:disabled):hover {
  filter:saturate(1.06) brightness(.98) !important;
  transform:translateY(-1px) !important;
  box-shadow:0 9px 20px rgba(37,99,235,.20) !important;
}

/* Destructive and outlined secondary actions. */
.neo-app main :where(button,a)[class*="bg-red-600"] {
  min-height:42px !important;
  border:1px solid var(--ep-danger) !important;
  border-radius:var(--ep-control-radius) !important;
  background:var(--ep-danger) !important;
  color:#fff !important;
  box-shadow:none !important;
  font-weight:800 !important;
}
.neo-app main :where(button,a)[class*="bg-red-600"]:not(:disabled):hover { background:var(--ep-danger-hover) !important; }
.neo-app main :where(button,a)[class*="border-slate-200"][class*="bg-white"],
.neo-app main :where(button,a)[class*="border-slate-300"] {
  min-height:42px !important;
  border-radius:var(--ep-control-radius) !important;
  border-color:var(--ep-border) !important;
  background:var(--ep-surface) !important;
  color:#334155 !important;
  box-shadow:none !important;
  font-weight:800 !important;
}
.neo-app main button:disabled,
.neo-app main a[aria-disabled="true"] {
  border-color:#dbe3ee !important;
  background:#eef2f7 !important;
  color:#7c8ba1 !important;
  box-shadow:none !important;
  filter:none !important;
  opacity:1 !important;
  transform:none !important;
  cursor:not-allowed !important;
}

/* Shared form-control geometry. */
.neo-app main :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]),textarea,select),
.neo-app main .ep-custom-select-trigger {
  box-sizing:border-box !important;
  min-height:var(--ep-control-height) !important;
  border:1px solid var(--ep-border) !important;
  border-radius:var(--ep-control-radius) !important;
  background-color:var(--ep-surface) !important;
  color:#263449 !important;
  box-shadow:none !important;
  outline:none !important;
}
.neo-app main :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]),textarea,select):focus,
.neo-app main .ep-custom-select[open] .ep-custom-select-trigger {
  border-color:#3b82f6 !important;
  box-shadow:0 0 0 3px rgba(59,130,246,.12) !important;
}
.ep-dropdown-portal,.ep-page-size-portal {
  border:1px solid var(--ep-border) !important;
  border-radius:14px !important;
  background:var(--ep-surface) !important;
  box-shadow:0 18px 44px rgba(15,23,42,.18) !important;
}

/* Cards and status labels. */
:where(.ep-assets-filter-card,.ep-annual-detail-card,.ep-activities-filter-card,
  .ep-activity-card,.ep-settings-theme,.ep-settings-branding,.ep-settings-companies,
  .ep-settings-labels,.ep-settings-backup,.ep-settings-catalog,.ep-account-photo,
  .ep-account-personal,.ep-account-password,.ep-comparison-controls) {
  border:1px solid var(--ep-border) !important;
  border-radius:var(--ep-card-radius) !important;
  background:var(--ep-surface) !important;
  box-shadow:0 5px 16px rgba(15,23,42,.045) !important;
}
.neo-app [class*="bg-emerald-100"][class*="text-emerald"],
.neo-app [class*="bg-emerald-50"][class*="text-emerald"] { border:1px solid #86efac !important; background:#dcfce7 !important; color:#047857 !important; }
.neo-app [class*="bg-blue-100"][class*="text-blue"],
.neo-app [class*="bg-blue-50"][class*="text-blue"] { border:1px solid #bfdbfe !important; background:#eff6ff !important; color:#1d4ed8 !important; }
.neo-app [class*="bg-amber-100"],.neo-app [class*="bg-amber-50"] { border-color:#fde68a !important; background:#fffbeb !important; color:#b45309 !important; }
.neo-app [class*="bg-red-100"],.neo-app [class*="bg-red-50"] { border-color:#fecaca !important; background:#fef2f2 !important; color:#b91c1c !important; }

/* Complete dark-theme mapping for controls, cards and labels. */
html.dark {
  --ep-text:#f1f5f9;
  --ep-muted:#94a3b8;
  --ep-border:#2a3a52;
  --ep-surface:#0f172a;
  --ep-surface-soft:#111c30;
}
html.dark .neo-app main :where(h2,h3,label,strong) { color:#eaf0f8 !important; }
html.dark .neo-app main :where(p,small) { color:#94a3b8 !important; }
html.dark .neo-app main :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]),textarea,select),
html.dark .neo-app main .ep-custom-select-trigger {
  border-color:var(--ep-border) !important;
  background-color:#0b1323 !important;
  color:#e2e8f0 !important;
}
html.dark .neo-app main input::placeholder,html.dark .neo-app main textarea::placeholder { color:#718198 !important; opacity:1 !important; }
html.dark .neo-app main :where(button,a)[class*="border-slate-200"][class*="bg-white"],
html.dark .neo-app main :where(button,a)[class*="border-slate-300"] {
  border-color:#3a4a62 !important;
  background:#172033 !important;
  color:#e2e8f0 !important;
}
html.dark .neo-app main button:disabled,html.dark .neo-app main a[aria-disabled="true"] {
  border-color:#334155 !important;
  background:#1e293b !important;
  color:#94a3b8 !important;
}
html.dark .neo-app [class*="bg-emerald-100"][class*="text-emerald"],
html.dark .neo-app [class*="bg-emerald-50"][class*="text-emerald"] { border-color:#166534 !important; background:#123b31 !important; color:#86efac !important; }
html.dark .neo-app [class*="bg-blue-100"][class*="text-blue"],
html.dark .neo-app [class*="bg-blue-50"][class*="text-blue"] { border-color:#1e40af !important; background:#172554 !important; color:#93c5fd !important; }
html.dark .neo-app [class*="bg-amber-100"],html.dark .neo-app [class*="bg-amber-50"] { border-color:#92400e !important; background:#422006 !important; color:#fde68a !important; }
html.dark .neo-app [class*="bg-red-100"],html.dark .neo-app [class*="bg-red-50"] { border-color:#991b1b !important; background:#450a0a !important; color:#fca5a5 !important; }

/* V32 — final targeted interface corrections */

/* Keep both annual-inventory table shells visibly rounded, including their
   internal scrolling/table layers and the final row. */
.ep-annual-list,
.ep-annual-detail-table {
  border-radius:20px !important;
  overflow:hidden !important;
  background-clip:padding-box !important;
}
.ep-annual-list > :last-child,
.ep-annual-detail-table > :last-child,
.ep-annual-list tbody tr:last-child td:first-child,
.ep-annual-detail-table tbody tr:last-child td:first-child {
  border-bottom-left-radius:19px !important;
}
.ep-annual-list tbody tr:last-child td:last-child,
.ep-annual-detail-table tbody tr:last-child td:last-child {
  border-bottom-right-radius:19px !important;
}

/* Report monetary/count values need full contrast on tinted dark cards. */
html.dark .neo-app main div:has(> .ep-reports-hero)
  > .grid[class*="xl:grid-cols-4"] > div > div:nth-child(2),
html.dark .neo-app main div:has(> .ep-reports-hero)
  span[class*="font-bold"][class*="text-slate-900"],
html.dark .neo-app main div:has(> .ep-reports-hero)
  span[class*="font-bold"][class*="text-emerald-700"],
html.dark .neo-app main div:has(> .ep-reports-hero)
  span[class*="font-bold"][class*="text-red-700"] {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* The theme card is a single-column block on phones; actions fill the card
   instead of inheriting the later desktop two-column grid declaration. */
@media(max-width:700px) {
  .ep-settings-theme {
    display:block !important;
    grid-template-columns:none !important;
    padding:18px !important;
  }
  .ep-settings-theme > div:nth-child(2) {
    margin-top:7px !important;
  }
  .ep-settings-theme > div:last-child {
    display:flex !important;
    width:100% !important;
    margin-top:16px !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
    white-space:normal !important;
  }
  .ep-settings-theme > div:last-child > button {
    width:100% !important;
    min-width:0 !important;
    justify-content:center !important;
  }
}

@media(max-width:639px){
  :root { --ep-hero-x:20px; --ep-hero-y:21px; --ep-hero-radius:20px; --ep-card-radius:18px; }
  :where(.ep-dashboard-hero,.ep-assets-hero,.ep-annual-hero,.ep-scanner-hero,
    .ep-reports-hero,.ep-activities-hero,.ep-admin-hero,.ep-settings-hero,
    .ep-trash-hero,.ep-comparison-hero,.ep-account-hero) h1 { font-size:27px !important; }
}
/* V31 — phase 2: responsive layout and consistent UI states */

/* Loading skeletons replace layout-jumping text blocks. */
.ep-loading-state {
  position:relative !important;
  display:block !important;
  min-height:82px !important;
  overflow:hidden !important;
  color:transparent !important;
  background:transparent !important;
}
td.ep-loading-state { display:table-cell !important; }
.ep-loading-state::before,
.ep-loading-state::after {
  content:"" !important;
  display:block !important;
  height:12px !important;
  margin:7px auto !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#edf1f6 20%,#f8fafc 38%,#edf1f6 58%) !important;
  background-size:220% 100% !important;
  animation:ep-skeleton-wave 1.25s ease-in-out infinite !important;
}
.ep-loading-state::before { width:min(72%,440px) !important; margin-top:18px !important; }
.ep-loading-state::after { width:min(46%,280px) !important; animation-delay:.12s !important; }
@keyframes ep-skeleton-wave { from{background-position:100% 0} to{background-position:-100% 0} }
@media(prefers-reduced-motion:reduce){ .ep-loading-state::before,.ep-loading-state::after { animation:none !important; } }

.ep-empty-state {
  min-height:92px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:24px !important;
  border:1px dashed #cbd5e1 !important;
  border-radius:15px !important;
  background:#f8fafc !important;
  color:#64748b !important;
  font-size:14px !important;
  font-weight:600 !important;
  line-height:1.55 !important;
  text-align:center !important;
}
td.ep-empty-state { display:table-cell !important; height:92px !important; }

/* One visual language for inline errors and warnings. */
.neo-app main [class*="border-red-"][class*="bg-red-"] {
  border-width:1px !important;
  border-style:solid !important;
  border-color:#fecaca !important;
  border-radius:15px !important;
  background:#fef2f2 !important;
  color:#b91c1c !important;
  box-shadow:none !important;
  line-height:1.55 !important;
}
.neo-app main [class*="border-amber-"][class*="bg-amber-"] {
  border-radius:15px !important;
  box-shadow:none !important;
  line-height:1.55 !important;
}

/* Long content must wrap without pushing cards or actions outside. */
.neo-app main :where(section,article,form,div) { min-width:0; }
.neo-app main :where(h1,h2,h3,p,strong,small,label,td,th) { overflow-wrap:anywhere; }
.neo-app main :where([class*="font-mono"],.ep-page-size) { overflow-wrap:normal; }
.neo-app main table { width:100% !important; }
.neo-app main th,.neo-app main td { vertical-align:middle !important; }
.neo-app main td[class*="text-right"],.neo-app main th[class*="text-right"],
.neo-app main td:last-child,.neo-app main th:last-child { white-space:nowrap !important; }
.neo-app main [class*="overflow-x-auto"] {
  max-width:100% !important;
  overscroll-behavior-x:contain !important;
  scrollbar-width:thin !important;
}

html.dark .ep-loading-state::before,html.dark .ep-loading-state::after {
  background:linear-gradient(90deg,#172033 20%,#22304a 38%,#172033 58%) !important;
  background-size:220% 100% !important;
}
html.dark .ep-empty-state {
  border-color:#334155 !important;
  background:#101a2c !important;
  color:#94a3b8 !important;
}
html.dark .neo-app main [class*="border-red-"][class*="bg-red-"] {
  border-color:#7f1d1d !important;
  background:#3b1015 !important;
  color:#fca5a5 !important;
}

/* Smaller laptops and tablets. */
@media(max-width:1279px){
  .neo-app main { max-width:100% !important; }
  .ep-settings-branding > div { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .ep-activities-stats { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .ep-comparison-controls > div:last-child { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important; }
  .ep-comparison-controls > div:last-child > button:last-child { grid-column:1 / -1 !important; width:100% !important; }
}

@media(max-width:1023px){
  .ep-settings-catalog-grid { grid-template-columns:1fr !important; }
  .ep-settings-catalog { min-height:0 !important; }
  .ep-settings-catalog form { min-height:0 !important; }
  .ep-comparison-result-head { align-items:stretch !important; }
  .ep-comparison-result-head button { width:100% !important; }
  .ep-assets-filter-card { padding-left:16px !important; padding-right:16px !important; }
}

/* Phone layout: actions become easy to tap and tables scroll inside their card. */
@media(max-width:767px){
  .neo-app main { width:100% !important; overflow-x:hidden !important; }
  .neo-app main .space-y-6 { --tw-space-y-reverse:0; }
  .ep-settings-tabs { padding:5px !important; gap:5px !important; overflow-x:auto !important; }
  .ep-settings-tab { min-height:40px !important; padding:0 14px !important; white-space:nowrap !important; }
  .ep-settings-branding > div { grid-template-columns:1fr !important; }
  .ep-activities-stats { grid-template-columns:1fr !important; }
  .ep-comparison-controls > div:last-child { grid-template-columns:1fr !important; }
  .ep-comparison-controls > div:last-child > button { grid-column:auto !important; width:100% !important; }
  .ep-comparison-swap { min-height:42px !important; }
  .ep-assets-results-row { align-items:stretch !important; }
  .ep-page-size { justify-content:space-between !important; width:100% !important; }
  .ep-activity-card { padding:16px !important; }
  .ep-annual-detail-table table,.ep-comparison-table table { min-width:680px !important; }
  .neo-app main :where(button,a)[class*="px-5"],
  .neo-app main :where(button,a)[class*="px-6"] { max-width:100% !important; }
}

@media(max-width:479px){
  .ep-settings-tab { padding:0 12px !important; font-size:12px !important; }
  .ep-empty-state { min-height:82px !important; padding:20px 16px !important; }
  .ep-activities-filter-card,.ep-assets-filter-card { border-radius:18px !important; }
}
