/* Flexify Commerce Brand Identity v2 — Flex Finance UI layer
   Source palette: Burgundy #4A1F2D, Wine #6F2A3D, Champagne #C9B18F,
   Cream #EFEAE4, Ink #2A2A2E. */
:root{
  --fc-burgundy:#4A1F2D;
  --fc-wine:#6F2A3D;
  --fc-champagne:#C9B18F;
  --fc-cream:#EFEAE4;
  --fc-ink:#2A2A2E;
  --fc-white:#FFFFFF;
  --fc-border:rgba(74,31,45,.13);
  --fc-border-strong:rgba(74,31,45,.23);
  --fc-muted:rgba(42,42,46,.63);
  --fc-shadow:0 12px 34px rgba(74,31,45,.07);
}

html{background:var(--fc-cream);color:var(--fc-ink)}
body{background:var(--fc-cream);color:var(--fc-ink);font-family:"Noto Sans Arabic",Tahoma,Arial,sans-serif}
h1,h2,h3{color:var(--fc-burgundy);font-family:"Noto Sans Arabic",Tahoma,Arial,sans-serif;letter-spacing:0}
.muted,.small.muted{color:var(--fc-muted)}
.boot{background:var(--fc-cream);color:var(--fc-burgundy)}
.boot-logo{width:min(330px,65vw);height:auto;display:block}
button:focus-visible,a:focus-visible,input:focus,select:focus,textarea:focus{outline:3px solid rgba(201,177,143,.78);outline-offset:2px}

/* Approved wordmark + product lockup */
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin:0 10px 30px;color:var(--fc-cream);direction:ltr}
.brand-logo{display:block;width:188px;max-width:100%;height:auto}
.brand-product{font:600 9px/1.2 Inter,Arial,sans-serif;letter-spacing:.22em;color:var(--fc-champagne);padding-left:2px;text-transform:uppercase}

/* Main shell */
.sidebar{background:linear-gradient(180deg,var(--fc-burgundy) 0%,#3d1925 100%);color:rgba(239,234,228,.84);border-left:1px solid rgba(201,177,143,.14)}
.nav-section{color:var(--fc-champagne);opacity:.7;letter-spacing:.08em}
.nav-link{color:rgba(239,234,228,.78);border:1px solid transparent}
.nav-link:hover{background:rgba(111,42,61,.72);color:var(--fc-cream);border-color:rgba(201,177,143,.12)}
.nav-link.active{background:var(--fc-champagne);color:var(--fc-burgundy);font-weight:700;box-shadow:0 7px 22px rgba(42,42,46,.12)}
.sidebar-bottom{border-top-color:rgba(201,177,143,.24)}
.avatar{background:var(--fc-wine);color:var(--fc-cream);border:1px solid rgba(201,177,143,.34)}
.sidebar-bottom .text-button{color:rgba(239,234,228,.78)}
.sidebar-bottom .text-button:hover{color:var(--fc-champagne)}
.main{background:var(--fc-cream)}
.topbar{border-bottom-color:var(--fc-border)}
.breadcrumb{color:var(--fc-muted)}
.breadcrumb strong{color:var(--fc-burgundy)}
.top-meta{color:var(--fc-muted)}
.secure-dot:before{background:var(--fc-champagne);box-shadow:0 0 0 3px rgba(201,177,143,.18)}
.page-head p{color:var(--fc-muted)}
.footer-note{color:rgba(42,42,46,.48);letter-spacing:.06em}

/* Controls */
.btn{background:var(--fc-white);border-color:var(--fc-border);color:var(--fc-burgundy);box-shadow:none}
.btn:hover{background:rgba(239,234,228,.72);border-color:var(--fc-border-strong)}
.btn.primary{background:var(--fc-burgundy);color:var(--fc-cream);border-color:var(--fc-burgundy);box-shadow:0 8px 20px rgba(74,31,45,.12)}
.btn.primary:hover{background:var(--fc-wine);border-color:var(--fc-wine)}
.btn.danger{border-color:rgba(111,42,61,.22);color:var(--fc-wine);background:rgba(111,42,61,.04)}
.text-button{color:var(--fc-wine)}
.icon-button{color:var(--fc-wine)}
.icon-button:hover{background:rgba(201,177,143,.18)}
.check-field input{accent-color:var(--fc-burgundy)}
.demo-banner{background:rgba(201,177,143,.23);border-color:rgba(201,177,143,.55);color:var(--fc-burgundy)}

/* Dashboard & cards */
.stat,.panel,.mini-card,.filter-bar,.account-card{background:var(--fc-white);border-color:var(--fc-border);box-shadow:0 2px 7px rgba(74,31,45,.025)}
.stat-top{color:var(--fc-muted)}
.stat-icon{background:rgba(201,177,143,.17);color:var(--fc-burgundy)}
.stat-value{color:var(--fc-burgundy)}
.stat-value small,.stat-foot{color:rgba(42,42,46,.52)}
.stat.highlight{background:linear-gradient(145deg,var(--fc-burgundy),var(--fc-wine));border-color:var(--fc-burgundy);box-shadow:var(--fc-shadow)}
.highlight .stat-top,.highlight .stat-foot{color:rgba(239,234,228,.75)}
.highlight .stat-icon{background:rgba(201,177,143,.2);color:var(--fc-champagne)}
.highlight .stat-value{color:var(--fc-cream)}
.highlight .stat-value small{color:rgba(239,234,228,.72)}
.stat.clickable:hover{border-color:rgba(111,42,61,.38);box-shadow:var(--fc-shadow)}
.panel-head p,.mini-card label{color:var(--fc-muted)}
.mini-card strong,.account-card .account-value{color:var(--fc-burgundy)}
.mini-card .icon{color:var(--fc-wine)}
.account-metrics{border-top-color:var(--fc-border)}
.account-metrics label{color:var(--fc-muted)}
.category-item{border-bottom-color:rgba(74,31,45,.08)}
.category-dot{background:rgba(201,177,143,.18);color:var(--fc-burgundy)}

/* Charts */
.chart text{fill:rgba(42,42,46,.55)}
.chart .gridline{stroke:rgba(74,31,45,.09)}
.chart .series-a{stroke:var(--fc-burgundy)}
.chart .series-b{stroke:var(--fc-champagne)}
.chart .point{fill:var(--fc-wine);stroke:var(--fc-white)}
.chart .area{fill:rgba(201,177,143,.17)}
.legend{color:var(--fc-muted)}
.legend i{background:var(--fc-burgundy)}
.legend span:nth-child(2) i{background:var(--fc-champagne)}
.bar-bg{fill:rgba(201,177,143,.18)}
.bar-fill{fill:var(--fc-burgundy)}
.bar-negative{fill:var(--fc-wine)}
.loading-line{background:linear-gradient(90deg,var(--fc-cream),var(--fc-champagne),var(--fc-wine),var(--fc-champagne),var(--fc-cream))}

/* Tables, filters, forms */
th{background:rgba(239,234,228,.55);color:rgba(42,42,46,.58);border-color:rgba(74,31,45,.08)}
td{border-bottom-color:rgba(74,31,45,.08);color:rgba(42,42,46,.78)}
tbody tr:hover{background:rgba(239,234,228,.42)}
td .primary-text{color:var(--fc-burgundy)}
.pager{border-top-color:rgba(74,31,45,.08);color:var(--fc-muted)}
.filter-main label,.field label,.detail-grid label{color:var(--fc-muted)}
.field input,.field select,.field textarea{border-color:var(--fc-border);background:var(--fc-white);color:var(--fc-ink)}
.field input:hover,.field select:hover,.field textarea:hover{border-color:rgba(111,42,61,.28)}
.field input:disabled{background:rgba(239,234,228,.65);color:rgba(42,42,46,.45)}
.advanced summary{color:var(--fc-wine)}
.invoice-line{border-color:var(--fc-border);background:rgba(239,234,228,.34)}
.invoice-line-top{color:var(--fc-muted)}
.preview-totals{background:rgba(201,177,143,.18)}
.preview-totals label{color:var(--fc-muted)}
.attachment-row{border-color:var(--fc-border)}
.code{background:rgba(239,234,228,.62);color:var(--fc-ink)}

/* Statuses: approved palette, with explicit labels retained in the UI */
.badge{background:rgba(42,42,46,.06);color:var(--fc-ink);border:1px solid rgba(42,42,46,.08)}
.badge.success{background:rgba(74,31,45,.07);color:var(--fc-burgundy);border-color:rgba(74,31,45,.13)}
.badge.warning{background:rgba(201,177,143,.25);color:var(--fc-burgundy);border-color:rgba(201,177,143,.4)}
.badge.danger{background:rgba(111,42,61,.09);color:var(--fc-wine);border-color:rgba(111,42,61,.18)}
.badge.neutral{background:rgba(42,42,46,.055);color:rgba(42,42,46,.72);border-color:rgba(42,42,46,.08)}
.positive{color:var(--fc-burgundy)}
.negative{color:var(--fc-wine)}

/* Notes, messages and dialogs */
.note{background:rgba(201,177,143,.18);color:var(--fc-burgundy);border:1px solid rgba(201,177,143,.27)}
.note.warning{background:rgba(111,42,61,.06);color:var(--fc-wine);border-color:rgba(111,42,61,.13)}
.empty{color:var(--fc-muted)}
.empty .icon{color:var(--fc-champagne)}
.empty h3{color:var(--fc-burgundy)}
dialog{border-color:var(--fc-border);color:var(--fc-ink);box-shadow:0 26px 90px rgba(42,42,46,.22)}
dialog::backdrop{background:rgba(42,42,46,.52);backdrop-filter:blur(4px)}
.modal-head{border-bottom-color:var(--fc-border);background:var(--fc-white)}
.modal-foot{border-top-color:var(--fc-border)}
.detail-grid strong{color:var(--fc-burgundy)}
.form-error{background:rgba(111,42,61,.08);color:var(--fc-wine);border:1px solid rgba(111,42,61,.13)}
.toast{background:var(--fc-burgundy);color:var(--fc-cream);box-shadow:0 12px 34px rgba(74,31,45,.22)}
.toast.error{background:var(--fc-wine)}

/* Login — full Flexify Commerce identity */
.login-layout{background:var(--fc-cream)}
.login-art{background:linear-gradient(145deg,var(--fc-burgundy) 0%,#3d1925 58%,var(--fc-wine) 100%);color:var(--fc-cream);padding:68px 70px 46px}
.login-art:after{content:"";position:absolute;width:520px;height:262px;left:-80px;bottom:-14px;border:0;border-radius:0;box-shadow:none;background:url('/src/brand/symbol-reverse.svg') center/contain no-repeat;opacity:.13;transform:rotate(-2deg);pointer-events:none}
.login-art:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(201,177,143,.06));pointer-events:none}
.login-art .brand{margin:0;align-items:flex-start;justify-content:flex-start;position:relative;z-index:2}
.login-message{position:relative;z-index:2;max-width:430px}
.login-message h1{font-size:46px;line-height:1.55;color:var(--fc-cream)}
.login-message p{font-size:15px;color:rgba(239,234,228,.78);line-height:2.2}
.login-art footer{font:600 10px/1.4 Inter,Arial,sans-serif;letter-spacing:.17em;color:var(--fc-champagne);position:relative;z-index:2}
.login-main{background:var(--fc-cream)}
.login-form{background:rgba(255,255,255,.78);border:1px solid var(--fc-border);padding:38px 38px 34px;border-radius:32px 0 32px 0;box-shadow:var(--fc-shadow);backdrop-filter:blur(8px)}
.login-form h2{color:var(--fc-burgundy)}
.login-form>p{color:var(--fc-muted)}
.login-secure{color:rgba(42,42,46,.53)}
.login-secure .icon{color:var(--fc-champagne)}

@media(max-width:960px){
  .mobile-shade.visible{background:rgba(42,42,46,.46)}
  .login-art{padding:40px}
}
@media(max-width:640px){
  .brand-logo{width:170px}
  .login-art{min-height:190px;padding:25px 30px}
  .login-art:after{width:300px;height:150px;left:-45px;bottom:-25px;opacity:.12}
  .login-form{padding:28px 24px;border-radius:24px 0 24px 0}
  .login-message h1{font-size:27px}
}