/* MATI SOFT 16.5.97 - brand layer in the colours of the MATI SOFT logo.
   Navy #061744 / #0A2C78, royal #0047AB, azure #0096FD, ice #E9F4FF.
   Loaded last and only in MATI SOFT (body.mb), so Alaqaree e-Invoice keeps its own colours. Screen only. */
:root{--mb-navy-950:#030E2B;--mb-navy-900:#061744;--mb-navy-800:#0A2C78;--mb-royal:#0047AB;--mb-royal-600:#003A8F;
  --mb-azure:#0096FD;--mb-azure-300:#5CB8FF;--mb-ice:#E9F4FF;--mb-ice-2:#F4F9FF;--mb-ink:#0B1733;--mb-muted:#5B6B85;--mb-line:#E1E8F2}
@media screen{
html body.mb{--ms-brand:#0047AB;--ms-brand-600:#003A8F;--ms-brand-50:#EEF6FF;--ms-brand-100:#D6E9FF;--ms-accent:#0096FD;--ms-ink:#0B1733;
  --ms-side:#061744;--ms-side-2:#030E2B;--ms-side-ink:#C9D6EC;--ms-side-muted:#7F93B8;background:#F3F6FB!important}

/* ---------- sidebar ---------- */
html body.mb aside.sidebar.ms-side{background:
  url('mati-ribbon-soft.svg') no-repeat 50% 112%/620px auto,
  radial-gradient(120% 50% at 100% 0%,rgba(0,150,253,.16),transparent 60%),
  linear-gradient(180deg,#061744 0%,#04113A 55%,#030E2B 100%)!important;border-inline-end:1px solid rgba(92,184,255,.10)!important}
html body.mb .ms-side .ms-side-logo{padding:24px 22px 20px!important;border-bottom:1px solid rgba(124,192,242,.12)!important}
html body.mb .ms-side .ms-side-logo img{height:44px!important}
html body.mb .ms-side .side-title{color:#6F8BB8!important;font-size:10.5px!important;font-weight:700!important;letter-spacing:1.2px!important;padding:18px 14px 6px!important}
html body.mb .ms-side .side-link{border-radius:11px!important;padding:10px 12px!important;color:#C9D6EC!important;font-weight:500!important;transition:background .15s,color .15s}
html body.mb .ms-side .side-link .side-icon{color:#7F93B8!important}
html body.mb .ms-side .side-link:hover{background:rgba(92,184,255,.08)!important;color:#fff!important}
html body.mb .ms-side .side-link:hover .side-icon{color:#5CB8FF!important}
html body.mb .ms-side .side-link.active{background:linear-gradient(90deg,#0047AB,#0A2C78)!important;color:#fff!important;font-weight:700!important;
  box-shadow:0 8px 20px rgba(0,71,171,.35),inset 0 0 0 1px rgba(92,184,255,.25)!important}
html[dir=rtl] body.mb .ms-side .side-link.active{background:linear-gradient(270deg,#0047AB,#0A2C78)!important}
html body.mb .ms-side .side-link.active .side-icon{color:#fff!important}
html body.mb .ms-side .side-link.active::before{background:#0096FD!important;box-shadow:0 0 10px #0096FD}
html body.mb .ms-side .ms-license-card{background:rgba(6,23,68,.6)!important;border:1px solid rgba(92,184,255,.18)!important;backdrop-filter:blur(6px)}
html body.mb .ms-side .ms-license-card .v b{color:#fff!important}

/* ---------- top bar ---------- */
html body.mb .ms-main .top{background:rgba(255,255,255,.92)!important;border-bottom:1px solid var(--mb-line)!important;box-shadow:0 1px 0 rgba(6,23,68,.02)}
html body.mb .ms-main .top::before{content:"";position:absolute;inset-inline:0;top:0;height:3px;background:linear-gradient(90deg,#061744,#0047AB 45%,#0096FD)}
html body.mb .ms-top-title b{color:var(--mb-navy-900)!important;font-weight:700!important;font-size:15.5px!important}
html body.mb .ms-avatar{background:linear-gradient(135deg,#0096FD,#0047AB)!important}
html body.mb .ms-main .top .btn.ghost{background:#fff!important;border:1px solid var(--mb-line)!important;color:var(--mb-navy-900)!important}
html body.mb .ms-main .top .btn.ghost:hover{border-color:#5CB8FF!important;color:#0047AB!important}

/* ---------- common controls ---------- */
html body.mb .ms-main .btn:not(.secondary):not(.ghost){background:linear-gradient(180deg,#0A5BD0,#0047AB)!important;border-color:#0047AB!important;color:#fff!important;
  box-shadow:0 6px 14px rgba(0,71,171,.22),inset 0 1px 0 rgba(255,255,255,.18)!important}
html body.mb .ms-main .btn:not(.secondary):not(.ghost):hover{background:linear-gradient(180deg,#0047AB,#003A8F)!important}
html body.mb .ms-main .btn.secondary{background:#fff!important;color:var(--mb-navy-900)!important;border:1px solid var(--mb-line)!important}
html body.mb .ms-main .btn.secondary:hover{border-color:#5CB8FF!important;color:#0047AB!important;background:#F4F9FF!important}
html body.mb .ms-main input:focus,html body.mb .ms-main select:focus,html body.mb .ms-main textarea:focus{outline:3px solid rgba(0,150,253,.18)!important;border-color:#0096FD!important}
html body.mb .ms-main .card{border-color:var(--mb-line)!important;border-radius:18px!important;box-shadow:0 1px 2px rgba(6,23,68,.04),0 8px 24px rgba(6,23,68,.05)!important}
html body.mb .ms-main .page-head h1{color:var(--mb-navy-900)!important;font-weight:800!important}
html body.mb .ms-main .page-head h1::after{background:linear-gradient(90deg,#0096FD,#0047AB)!important;width:54px!important}
html body.mb .ms-main .table-wrap th{background:#EEF5FF!important;color:#0A2C78!important}
html body.mb .ms-main .table-wrap tbody tr:hover td{background:#F1F8FF!important}
html body.mb .ms-main .table-wrap tbody tr:hover td:first-child{box-shadow:inset -3px 0 0 #0096FD!important}
html[dir=ltr] body.mb .ms-main .table-wrap tbody tr:hover td:first-child{box-shadow:inset 3px 0 0 #0096FD!important}
html body.mb .ms-main td a{color:#0047AB!important}
html body.mb .ms-main .quick{border-radius:14px!important;border-color:var(--mb-line)!important;background:linear-gradient(180deg,#fff,#F7FAFF)!important}
html body.mb .ms-main .quick:hover{border-color:#5CB8FF!important;box-shadow:0 10px 22px rgba(0,71,171,.10)}
html body.mb .ms-main .quick strong{color:var(--mb-navy-900)}
html body.mb .ms-tile{border-radius:14px!important}
html body.mb .ms-tile:hover{border-color:#5CB8FF!important;background:#F4F9FF!important;box-shadow:0 10px 22px rgba(0,71,171,.08)}
html body.mb .ms-tile-ico{background:linear-gradient(135deg,#E9F4FF,#D6E9FF)!important;color:#0047AB!important}
html body.mb .ms-footer{color:#8A9BB8}

/* ---------- dashboard hero ---------- */
html body.mb .ms-hero-band{background:
  url('mati-ribbon.svg') no-repeat 0% 50%/auto 150%,
  radial-gradient(70% 120% at 100% 0%,rgba(0,150,253,.30),transparent 60%),
  linear-gradient(120deg,#030E2B 0%,#061744 40%,#0A2C78 100%)!important;
  border-radius:24px!important;padding:32px 36px!important;box-shadow:0 22px 44px rgba(6,23,68,.28)!important;border:1px solid rgba(92,184,255,.14)}
html[dir=ltr] body.mb .ms-hero-band{background-position:100% 50%,0 0,0 0!important}
html body.mb .ms-hero-band::before{display:none}
html body.mb .ms-hero-band::after{display:none}
html body.mb .ms-hero-band h2{font-size:30px!important;font-weight:800!important;letter-spacing:-.2px;margin:12px 0 4px!important}
html body.mb .mb-hero-sub{position:relative;color:#A9C4EA;font-size:13.5px;margin:0 0 20px}
html body.mb .ms-eyebrow{color:#9FD3FF!important;background:rgba(0,150,253,.12)!important;border-color:rgba(92,184,255,.28)!important;letter-spacing:.3px}
html body.mb .ms-hero-stats div{border-inline-start:2px solid #0096FD!important}
html body.mb .ms-hero-stats b{font-size:34px!important;font-weight:800!important}
html body.mb .ms-gauge .track{stroke:rgba(255,255,255,.10)!important}
html body.mb .ms-gauge .fill{filter:none!important}
html body.mb .ms-gauge{border-radius:50%;box-shadow:0 0 40px rgba(0,150,253,.25),inset 0 0 30px rgba(0,150,253,.12)}
html body.mb .ms-gauge-label b{font-size:42px!important;font-weight:800!important}

/* today strip */
.mb-today{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px;align-items:stretch;margin:0 0 18px}
.mb-today-h{grid-column:1/-1;display:flex;align-items:baseline;gap:10px;padding:0 4px}
.mb-chip .n .ms-ico{width:20px;height:20px}
.mb-status{position:relative;z-index:1;display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.mb-status a{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(92,184,255,.22);
  color:#DCEBFF!important;font-size:12px;text-decoration:none!important;white-space:nowrap}
.mb-status a:hover{background:rgba(255,255,255,.14)}
.mb-status i{width:8px;height:8px;border-radius:50%;background:#2DD4A0;box-shadow:0 0 0 3px rgba(45,212,160,.2)}
.mb-status i.warn{background:#F5B544;box-shadow:0 0 0 3px rgba(245,181,68,.2)}.mb-status i.bad{background:#F07167;box-shadow:0 0 0 3px rgba(240,113,103,.2)}
.mb-status i.off{background:#8EA3C4;box-shadow:none}
.mb-today-h b{font-size:15px;color:#061744;font-weight:800}.mb-today-h small{font-size:12px;color:#5B6B85}
.mb-chip{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;background:#fff;border:1px solid #E1E8F2;text-decoration:none!important;color:#0B1733!important;
  transition:transform .15s,box-shadow .15s,border-color .15s}
.mb-chip:hover{transform:translateY(-2px);border-color:#5CB8FF;box-shadow:0 12px 24px rgba(0,71,171,.10)}
.mb-chip .n{min-width:46px;height:46px;padding:0 8px;border-radius:13px;display:grid;place-items:center;font-size:19px;font-weight:800;font-variant-numeric:tabular-nums}
.mb-chip.warn .n{background:#FFF4DE;color:#A15C00}.mb-chip.bad .n{background:#FFECEA;color:#B42318}.mb-chip.ok .n{background:#E9F4FF;color:#0047AB}
.mb-chip.zero .n{background:#EEF7F1;color:#15803D}
.mb-chip b{display:block;font-size:13.5px}.mb-chip small{display:block;font-size:11.5px;color:#5B6B85;margin-top:2px}
.mb-chip .go{margin-inline-start:auto;color:#9AB0D0;font-size:18px}
html[dir=rtl] .mb-chip .go{transform:scaleX(-1)}

/* KPI cards: one brand family instead of four colours */
html body.mb .ms-kpi2{border-radius:18px!important;border-color:#E1E8F2!important;padding:20px!important;position:relative;overflow:hidden}
html body.mb .ms-kpi2::after{content:"";position:absolute;inset-inline:18px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:linear-gradient(90deg,#0096FD,#0047AB);opacity:0;transition:opacity .2s}
html body.mb .ms-kpi2:hover::after{opacity:1}
html body.mb .ms-kpi2:hover{border-color:#5CB8FF!important;box-shadow:0 14px 30px rgba(0,71,171,.12)!important}
html body.mb .ms-kpi2 .ms-kpi2-ico{background:linear-gradient(135deg,#0096FD,#0047AB)!important;color:#fff!important;box-shadow:0 8px 16px rgba(0,71,171,.25)}
html body.mb .ms-kpi2-body b{font-size:30px!important;font-weight:800!important;color:#061744!important}
html body.mb .ms-section-head h2{font-weight:800!important;color:#061744!important}
html body.mb .ms-chart-card{border-radius:16px!important;border-color:#E6EDF6!important}
html body.mb .ms-chart-total{color:#0047AB!important}
html body.mb .ms-kpi-inline{background:linear-gradient(180deg,#F4F9FF,#EEF5FF)!important;border:1px solid #DCEBFF}
html body.mb .ms-kpi-inline b{font-weight:800!important;color:#061744!important}
html body.mb .ms-coll-card .pill.info{background:#E9F4FF!important;color:#0047AB!important}

/* ---------- login ---------- */
html body.mb .ms-auth{background:#F6F9FE!important}
html body.mb .ms-auth-panel{background:radial-gradient(80% 60% at 50% 0%,#EAF4FF,transparent 70%),#fff}
html body.mb .ms-auth-panel h1{font-size:30px!important;font-weight:800!important;color:#061744}
html body.mb .ms-auth-panel input{padding:13px 14px!important;border-radius:12px!important;border:1px solid #D5DFEC!important;background:#FBFDFF!important}
html body.mb .ms-auth-panel input:focus{outline:3px solid rgba(0,150,253,.18)!important;border-color:#0096FD!important;background:#fff!important}
html body.mb .ms-auth-panel .btn:not(.secondary){background:linear-gradient(180deg,#0A5BD0,#0047AB)!important;border:0!important;border-radius:12px!important;color:#fff!important;font-weight:700!important;
  padding:14px!important;box-shadow:0 12px 24px rgba(0,71,171,.28)!important}
html body.mb .ms-auth-panel .btn:not(.secondary):hover{background:linear-gradient(180deg,#0047AB,#003A8F)!important}
html body.mb .ms-auth-panel .btn.secondary{width:auto!important;margin:0!important;padding:8px 16px!important;font-size:13px!important;border-radius:999px!important;background:#fff!important;border:1px solid #D5DFEC!important;color:#061744!important}
html body.mb .ms-auth-logo{width:200px!important}
html body.mb .ms-auth-side{background:
  url('mati-ribbon.svg') no-repeat 50% 18%/140% auto,
  radial-gradient(90% 60% at 80% 0%,rgba(0,150,253,.35),transparent 60%),
  linear-gradient(160deg,#030E2B 0%,#061744 45%,#0A2C78 100%)!important;justify-content:space-between!important;padding:52px 56px!important}
html body.mb .ms-auth-side::before{opacity:.35}
.mb-auth-brand{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px}
.mb-auth-brand img{width:170px;height:auto}
.mb-auth-brand span{font-size:11px;letter-spacing:1.6px;color:#9FD3FF;border:1px solid rgba(92,184,255,.35);padding:5px 11px;border-radius:999px;font-weight:700}
html body.mb .ms-auth-side h2{font-size:34px!important;font-weight:800!important;line-height:1.45!important}
html body.mb .ms-auth-side p{color:#B9CDEB!important}
html body.mb .ms-auth-points{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px!important;margin-top:30px!important}
html body.mb .ms-auth-points div{flex-direction:column;align-items:flex-start!important;gap:10px!important;padding:16px;border-radius:16px;background:rgba(6,23,68,.45);border:1px solid rgba(92,184,255,.18);font-size:13px!important;line-height:1.6;backdrop-filter:blur(6px)}
html body.mb .ms-auth-points .ms-ico{width:34px;height:34px;padding:8px;border-radius:10px;background:linear-gradient(135deg,#0096FD,#0047AB);color:#fff!important;box-sizing:border-box}

@media(max-width:700px){.mb-today{grid-template-columns:1fr}html body.mb .ms-hero-band{padding:24px!important}html body.mb .ms-hero-band h2{font-size:24px!important}
  html body.mb .ms-auth-points{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.mb-chip,.mb-chip:hover{transition:none;transform:none}}

/* 16.5.99 invoicing & VAT summary */
.mb-ei-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:14px}
.mb-ei-kpi{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #E1E8F2;border-radius:14px;background:#fff;text-decoration:none!important;color:#0B1733!important;position:relative;overflow:hidden;transition:transform .15s,box-shadow .15s}
.mb-ei-kpi::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--c)}
.mb-ei-kpi:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(0,71,171,.10)}
.mb-ei-kpi .ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 12%,#fff);flex:none}
.mb-ei-kpi .ic .ms-ico{width:18px;height:18px}
.mb-ei-kpi small{display:block;font-size:12px;color:#5B6B85;font-weight:600}.mb-ei-kpi b{display:block;font-size:24px;font-weight:800;color:#061744;font-variant-numeric:tabular-nums}
.mb-fin-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:14px}.mb-fin-grid.one{grid-template-columns:1fr}
.mb-fin-box{border:1px solid #E6EDF6;border-radius:16px;padding:16px}
.mb-fin-box h3{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:14.5px;color:#061744}
.mb-fin-box h3 .ms-ico{width:18px;height:18px;color:#0096FD}.mb-fin-box h3 a{margin-inline-start:auto;font-size:12.5px;text-decoration:none;color:#0047AB}
.mb-big{font-size:30px;font-weight:800;color:#061744}.mb-big small{font-size:13px;color:#5B6B85;font-weight:600}
.mb-meter{height:12px;border-radius:999px;background:#E9F4FF;overflow:hidden;margin:12px 0 8px}
.mb-meter i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#0096FD,#0047AB)}
.mb-meter.warn i{background:linear-gradient(90deg,#F5B544,#E08E1B)}.mb-meter.bad i{background:linear-gradient(90deg,#F07167,#C9443A)}
.mb-mini{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:#5B6B85}.mb-mini b{color:#061744}
.mb-owner{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid #E8EEF6;border-radius:12px;margin-bottom:8px;text-decoration:none!important;color:#0B1733!important}
.mb-owner:hover{background:#F4F9FF;border-color:#BFDDFF}
.mb-owner b{display:block;font-size:13.5px}.mb-owner small{display:block;font-size:11.5px;color:#6B7C96;margin-top:2px}
.mb-owner em{font-style:normal;font-size:11px;font-weight:800;padding:5px 9px;border-radius:999px;white-space:nowrap}
.mb-owner em.ok{background:#E9F4FF;color:#0047AB}.mb-owner em.warn{background:#FFF4DE;color:#A15C00}.mb-owner em.bad{background:#FFECEA;color:#B42318}.mb-owner em.mute{background:#EEF2F7;color:#5B6B85}
@media(max-width:1200px){.mb-ei-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.mb-fin-grid{grid-template-columns:1fr}}
@media(max-width:560px){.mb-ei-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
}