/* BCH Central v0.22.5 — project-wide readable typography system */
:root{
  --bch-font-ar:'Cairo',Tahoma,Arial,sans-serif;
  --bch-font-latin:'Inter','Cairo',Tahoma,Arial,sans-serif;
  --bch-type-xs:12px;
  --bch-type-sm:13px;
  --bch-type-md:14px;
  --bch-type-lg:16px;
  --bch-type-xl:20px;
  --bch-weight-ui:700;
  --bch-weight-strong:800;
  --bch-weight-heavy:900;
}

html{font-size:16px}
body{
  font-family:var(--bch-font-ar)!important;
  font-size:14px;
  font-weight:var(--bch-weight-ui);
  line-height:1.72;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

body :where(button,input,select,textarea,option){font-family:var(--bch-font-ar)!important}
body :where(p,span,small,label,a,button,input,select,textarea,th,td,summary,option,li,dt,dd){font-weight:700}
body :where(h1,h2,h3,h4,h5,h6,strong,b){font-weight:800}
body :where(code,.mono,[dir="ltr"]){font-family:var(--bch-font-latin)}

/* Core hierarchy */
.page-head h1,.dashboard-heading h1,.admins-head h1,.alerts-head h1,.cx-head h1,.cx-profile-head h1{
  font-size:34px!important;
  line-height:1.35!important;
  font-weight:900!important;
  letter-spacing:-.35px!important;
}
.page-head p,.dashboard-heading p,.admins-head p,.alerts-head p,.cx-head p,.cx-profile-head p{
  font-size:14px!important;
  line-height:1.85!important;
  font-weight:700!important;
  color:#58667a!important;
}
.eyebrow,.section-kicker,[class*="kicker"],[class*="eyebrow"]{
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.8px!important;
  line-height:1.55!important;
}
.panel-head h2,.card-head h2,.users-head h2,.ui-card h2,.ui-card h3,.module-card h2,.module-card h3{
  font-size:18px!important;
  line-height:1.5!important;
  font-weight:900!important;
}
.panel-head p,.card-head p,.users-head p,.ui-card p,.module-card p{
  font-size:13px!important;
  line-height:1.8!important;
  font-weight:700!important;
}

/* Sidebar + navigation */
.brand strong{font-size:20px!important;font-weight:900!important}
.brand small{font-size:12px!important;font-weight:700!important;color:#8b96a8!important}
.scope-switcher label{font-size:12px!important;font-weight:800!important}
.scope-switcher select{font-size:13px!important;font-weight:800!important;min-height:44px!important}
.scope-back{font-size:12px!important;font-weight:800!important}
.sidebar-nav a,.sidebar nav a{
  min-height:48px!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1.45!important;
}
.sidebar-nav a span,.sidebar nav a span{font-size:14px!important;font-weight:800!important}
.nav-label{
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.65px!important;
  color:#7e899c!important;
}
.sidebar nav small{font-size:11px!important;font-weight:800!important}
.platform-state strong{font-size:13px!important;font-weight:800!important}
.platform-state small{font-size:11px!important;font-weight:700!important}
.sidebar form button{font-size:13px!important;font-weight:800!important;min-height:44px!important}

/* Breadcrumbs / module navigation */
.module-breadcrumb,.module-breadcrumb a,.module-breadcrumb span{font-size:13px!important;font-weight:800!important}

/* Buttons, fields, labels */
.button,.primary,.head-actions a,.head-actions button,
.main button,.main input[type="submit"],.main input[type="button"]{
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.35!important;
}
.main label,.main label>span,.main .field-label{
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.55!important;
}
.main input:not([type="checkbox"]):not([type="radio"]),
.main select,.main textarea{
  font-size:14px!important;
  font-weight:700!important;
  line-height:1.6!important;
}
.main input::placeholder,.main textarea::placeholder{font-weight:600!important;color:#8a97aa!important;opacity:1}
.main small{font-size:12px!important;line-height:1.65!important;font-weight:700!important}

/* Tables */
.main table th{
  font-size:12px!important;
  font-weight:900!important;
  line-height:1.55!important;
  color:#475467!important;
}
.main table td{
  font-size:13px!important;
  font-weight:700!important;
  line-height:1.65!important;
  color:#344054!important;
}

/* Badges / metadata / pills */
.main :where([class*="badge"],[class*="pill"],[class*="chip"],[class*="meta"]){
  font-size:11px!important;
  font-weight:800!important;
  line-height:1.45!important;
}

/* Generic card microcopy that used to be 8–10px */
.metric-card span,.metric-card small,.network-cell span,.network-store span,.rank-row code,.rank-row em,
.quick-actions small,.activity-row small,.activity-row time,
.alerts-kpis span,.alerts-kpis small,.alert-meta,.alert-main small,
.finance-subnav a small,.finance-form-hint,.finance-recurring-row small,.finance-expense-row small,
.cx-stats small,.cx-card-head p,.cx-store-list small{
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.6!important;
}
.metric-card span,.network-cell b,.network-store strong,.rank-row strong,.quick-actions strong,.activity-row strong{
  font-size:13px!important;
  font-weight:800!important;
}

/* Access control / users page — screenshot target */
.admins-page{gap:20px!important}
.role-grid article{padding:16px!important}
.role-grid strong{font-size:14px!important;font-weight:900!important}
.role-grid p{font-size:12px!important;font-weight:700!important;line-height:1.75!important;color:#58667a!important}
.admin-card,.admin-users{padding:18px!important}
.card-head h2,.users-head h2{font-size:18px!important;font-weight:900!important}
.card-head span,.users-head span,.role-pill{font-size:11px!important;font-weight:800!important}
.admin-form label,.user-grid label{font-size:12px!important;font-weight:800!important}
.admin-form input,.admin-form select,.user-grid input,.user-grid select{font-size:13px!important;font-weight:700!important;min-height:44px!important}
.admin-form>button,.user-footer button{font-size:13px!important;font-weight:900!important;min-height:44px!important}
.store-checks>span{font-size:12px!important;font-weight:900!important}
.store-checks label{font-size:12px!important;font-weight:700!important}
.store-checks label small{font-size:11px!important;font-weight:700!important}
.user-title strong{font-size:13px!important;font-weight:900!important}
.user-title small{font-size:11px!important;font-weight:700!important}
.active-toggle{font-size:12px!important;font-weight:800!important}

/* Customers */
.cx-stats span{font-size:13px!important;font-weight:800!important}
.cx-table-wrap th{font-size:12px!important;font-weight:900!important}
.cx-table-wrap td{font-size:13px!important;font-weight:700!important}
.cx-badge,.cx-open{font-size:12px!important;font-weight:800!important}
.cx-info span,.cx-info strong,.cx-store-list strong{font-size:13px!important;font-weight:800!important}

/* Alerts */
.alerts-kpis span{font-size:13px!important;font-weight:800!important}
.alerts-kpis small,.alert-main small{font-size:11px!important;font-weight:700!important}
.alert-main h2{font-size:16px!important;font-weight:900!important}
.alert-main p{font-size:13px!important;font-weight:700!important}
.alert-actions a,.alert-actions button{font-size:12px!important;font-weight:800!important}

/* Finance */
.finance-ledger-head h1,.finance-ledger-head--pro h1{font-size:32px!important;font-weight:900!important}
.finance-ledger-head p,.finance-ledger-head--pro p{font-size:14px!important;font-weight:700!important}
.finance-subnav a b{font-size:14px!important;font-weight:900!important}
.finance-subnav a small{font-size:11px!important;font-weight:700!important}
.finance-section-head h2{font-weight:900!important}
.finance-section-head p{font-size:13px!important;font-weight:700!important}
.finance-entry-form label>span{font-size:12px!important;font-weight:900!important}
.finance-entry-form input,.finance-entry-form select,.finance-entry-form textarea{font-size:13px!important;font-weight:700!important}
.finance-managed-categories strong{font-size:14px!important;font-weight:900!important}
.finance-managed-categories small{font-size:11px!important;font-weight:700!important}
.finance-managed-categories details summary{font-size:12px!important;font-weight:900!important}
.finance-managed-categories input{font-size:12px!important;font-weight:700!important}
.finance-managed-categories button{font-size:12px!important;font-weight:900!important}

/* Mobile shell */
.mobile-brand span{font-size:13px!important;font-weight:900!important}
.mobile-scope-select{font-size:12px!important;font-weight:800!important}
.mobile-bottom-nav a{font-size:11px!important;font-weight:800!important;line-height:1.25!important}
.mobile-drawer-head span{font-size:11px!important;font-weight:700!important}

@media(max-width:900px){
  body{font-size:14px!important}
  .main{padding-left:15px!important;padding-right:15px!important}
  .page-head h1,.dashboard-heading h1,.admins-head h1,.alerts-head h1,.cx-head h1,.cx-profile-head h1{font-size:27px!important}
  .page-head p,.dashboard-heading p,.admins-head p,.alerts-head p,.cx-head p,.cx-profile-head p{font-size:13px!important}
  .sidebar-nav a,.sidebar nav a,.sidebar-nav a span,.sidebar nav a span{font-size:14px!important}
  .nav-label{font-size:11px!important}
  .ui-table td{font-size:13px!important;font-weight:700!important}
  .ui-table td:before{font-size:11px!important;font-weight:900!important}
  .finance-ledger-head h1,.finance-ledger-head--pro h1{font-size:27px!important}
  .finance-ledger-head p,.finance-ledger-head--pro p{font-size:13px!important}
  .finance-head-btn{font-size:12px!important;font-weight:900!important}
  .finance-subnav a b{font-size:13px!important}
  .finance-subnav a small{font-size:11px!important}
  .finance-period-tabs a,.finance-filter-form select{font-size:12px!important;font-weight:800!important}
  .finance-section-head p{font-size:12px!important}
  .finance-entry-form label span{font-size:12px!important}
  .finance-entry-form input,.finance-entry-form select,.finance-entry-form textarea{font-size:13px!important}
}

@media(max-width:560px){
  .main{padding-left:12px!important;padding-right:12px!important}
  .page-head h1,.dashboard-heading h1,.admins-head h1,.alerts-head h1,.cx-head h1,.cx-profile-head h1{font-size:25px!important}
  .mobile-bottom-nav{height:70px!important}
  .mobile-bottom-nav a{font-size:11px!important}
  .mobile-bottom-nav a span{font-size:19px!important}
  .role-grid{gap:9px!important}
  .role-grid article{padding:14px!important}
  .role-grid strong{font-size:13px!important}
  .role-grid p{font-size:11px!important}
}
