/*
 * Hany Teleb - desk & portal brand theme.
 * Identity pulled from hanyteleb-acc.com: indigo HT monogram (#363A91),
 * gold arc (#D9B000), Tajawal typeface. Loaded via app_include_css and
 * web_include_css AFTER Frappe's bundles, so plain variable overrides win by
 * cascade order. Dark-mode rules match [data-theme=dark] to keep specificity.
 * Reversible: remove the two hook lines and rebuild to fully revert.
 */

/* ---- Self-hosted Tajawal (no external CDN, CSP-safe, offline-safe) ---- */
@font-face{font-family:'Tajawal';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/hanyteleb/fonts/tajawal-400-ar.woff2') format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200E;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/hanyteleb/fonts/tajawal-400-lat.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:500;font-display:swap;
  src:url('/assets/hanyteleb/fonts/tajawal-500-ar.woff2') format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200E;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:500;font-display:swap;
  src:url('/assets/hanyteleb/fonts/tajawal-500-lat.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:700;font-display:swap;
  src:url('/assets/hanyteleb/fonts/tajawal-700-ar.woff2') format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200E;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:700;font-display:swap;
  src:url('/assets/hanyteleb/fonts/tajawal-700-lat.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:800;font-display:swap;
  src:url('/assets/hanyteleb/fonts/tajawal-800-ar.woff2') format('woff2');
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200E;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:800;font-display:swap;
  src:url('/assets/hanyteleb/fonts/tajawal-800-lat.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;}

/* ---- Brand tokens ---- */
:root{
  --ht-indigo:#363A91;
  --ht-indigo-600:#2E3280;
  --ht-indigo-700:#262A6B;
  --ht-navy:#10172B;
  --ht-gold:#D9B000;
  --ht-gold-300:#EEC432;
  --ht-red:#C91C05;

  --brand-color:var(--ht-indigo);
  --primary:var(--ht-indigo);
  --primary-color:var(--ht-indigo);
  --btn-primary:var(--ht-indigo);
  --text-on-primary:#ffffff;
  --sidebar-select-color:#eef0fb;

  --font-stack:'Tajawal','InterVariable','Inter','-apple-system','BlinkMacSystemFont','Segoe UI','Roboto','Helvetica Neue',sans-serif;
}

/* Frappe sets --primary again inside [data-theme=light]; match it to win there too */
[data-theme=light]{
  --brand-color:var(--ht-indigo);
  --primary:var(--ht-indigo);
  --primary-color:var(--ht-indigo);
  --btn-primary:var(--ht-indigo);
  --sidebar-select-color:#eef0fb;
}
[data-theme=dark]{
  --brand-color:#8f95e6;
  --primary:#8f95e6;
  --primary-color:#8f95e6;
  --btn-primary:var(--ht-indigo);
  --sidebar-select-color:#20233f;
}

body,.navbar,.page-head,button,input,select,textarea,
.frappe-control input,.ql-editor{font-family:var(--font-stack) !important;}

/* ---- Primary buttons ---- */
.btn-primary{
  background-color:var(--ht-indigo);
  border-color:var(--ht-indigo);
  color:#fff;
  font-weight:500;
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active{
  background-color:var(--ht-indigo-600) !important;
  border-color:var(--ht-indigo-600) !important;
  color:#fff !important;
  box-shadow:0 0 0 2px rgba(54,58,145,.18);
}

/* Links / brand text */
a,.text-primary{color:var(--ht-indigo);}
a:hover{color:var(--ht-indigo-700);}

/* Focus ring: subtle gold, reads premium */
.form-control:focus,.input-with-feedback:focus,.btn:focus,
.awesomplete input:focus{
  border-color:var(--ht-indigo) !important;
  box-shadow:0 0 0 2px rgba(217,176,0,.25) !important;
}

/* ================= Navbar - deep indigo, gold accent ================= */
.navbar{
  background:linear-gradient(100deg,var(--ht-navy) 0%,var(--ht-indigo-700) 55%,var(--ht-indigo) 100%) !important;
  border-bottom:2px solid var(--ht-gold) !important;
  box-shadow:0 1px 8px rgba(16,23,43,.18);
}
.navbar .navbar-brand img,.navbar img.app-logo{
  height:28px;width:auto;
  background:#fff;border-radius:50%;padding:1px;
  box-shadow:0 0 0 1px rgba(255,255,255,.35);
}
/* All navbar text/icons to white */
.navbar .nav-link,.navbar .navbar-brand,.navbar a,
.navbar .navbar-nav .nav-link,.navbar .dropdown-toggle,
.navbar .navbar-text{color:#fff !important;}
.navbar .icon use,.navbar .icon{stroke:#fff;color:#fff;}
.navbar .es-icon,.navbar svg{color:#fff;}
.navbar .nav-link:hover{color:var(--ht-gold-300) !important;}

/* Awesomebar / global search on dark navbar */
.navbar .form-control,.navbar #navbar-search,.navbar input[type="text"]{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
}
.navbar .form-control::placeholder{color:rgba(255,255,255,.7);}
.navbar .form-control:focus{
  background:rgba(255,255,255,.18);
  border-color:var(--ht-gold) !important;
  box-shadow:0 0 0 2px rgba(217,176,0,.30) !important;
  color:#fff;
}
.navbar .navbar-toggler{border-color:rgba(255,255,255,.4);}
/* notifications / avatar keep contrast */
.navbar .dropdown .avatar{box-shadow:none;}
.navbar .avatar .avatar-frame,.navbar .avatar .standard-image{border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.45);}
/* dropdown menus that open from navbar stay light - do not restyle them */
.navbar .dropdown-menu{color:var(--text-color);}
.navbar .dropdown-menu a,.navbar .dropdown-menu .dropdown-item{color:var(--text-color) !important;}
/* awesomebar results list lives inside .navbar: it is a light panel, so undo the
   white-on-dark text/icon rules above (the search popup showed white text on white) */
.navbar .awesomplete > ul,.navbar .awesomplete > ul li,.navbar .awesomplete > ul li *,
.navbar .awesomplete > ul a,.navbar .awesomplete > ul span{color:var(--text-color) !important;}
.navbar .awesomplete > ul .text-muted,.navbar .awesomplete > ul small{color:var(--text-muted) !important;}
.navbar .awesomplete > ul svg,.navbar .awesomplete > ul .icon{color:var(--text-color);stroke:var(--text-color);}
.navbar .awesomplete > ul li[aria-selected="true"],.navbar .awesomplete > ul li:hover{background:var(--fg-hover-color, var(--gray-100));}

/* ================= Sidebar - light, indigo active + gold rail ======= */
.desk-sidebar .standard-sidebar-item.selected,
.standard-sidebar-item.selected{
  background-color:var(--sidebar-select-color);
  border-left:3px solid var(--ht-gold);
}
.desk-sidebar .standard-sidebar-item.selected a,
.standard-sidebar-item.selected .sidebar-item-label{
  color:var(--ht-indigo) !important;font-weight:600;
}
.desk-sidebar .standard-sidebar-item.selected .icon use,
.standard-sidebar-item.selected .icon{stroke:var(--ht-indigo);}

/* ================= Cards / dashboards - subtle premium depth ======== */
.widget,.number-widget-box,.dashboard-list-item,
.form-section .section-body .form-column .frappe-control,
.frappe-card{border-radius:10px;}
.widget.number-widget-box,.number-card{
  border:1px solid var(--border-color);
  box-shadow:0 1px 3px rgba(16,23,43,.06);
  transition:box-shadow .18s ease,transform .18s ease;
}
.widget.number-widget-box:hover{
  box-shadow:0 6px 18px rgba(16,23,43,.10);
  transform:translateY(-1px);
}
.number-card .widget-head .number,.number-widget-box .widget-content .number{
  color:var(--ht-indigo);font-weight:700;
}

/* Page head title weight for a sharper enterprise feel */
.page-head .title-text,.page-title .title-text{font-weight:700;letter-spacing:-.01em;}

/* Checkboxes / switches / active indicators inherit --primary already.
   Progress + tab underline explicitly branded: */
.progress-bar{background-color:var(--ht-indigo);}
.nav-tabs .nav-link.active{
  border-bottom-color:var(--ht-indigo);
  color:var(--ht-indigo);
}

/* Login / portal page: logo + primary already brand it; add gold sign-in */
.page-card .btn-primary,.for-login .btn-primary{background:var(--ht-indigo);border-color:var(--ht-indigo);}

/* =====================================================================
   LOGIN PAGE - premium split screen. The whole <section.for-login> is
   moved into .ht-login-pane by hanyteleb_login.js; the hero is injected
   beside it. All rules scoped to body[data-path="login"].
   ===================================================================== */
body[data-path="login"]{min-height:100vh;margin:0;background:#0e1430;font-family:var(--font-stack);}
/* strip Bootstrap container width/margins so the split fills the viewport */
body[data-path="login"] .container,
body[data-path="login"] main.container{max-width:none !important;width:100% !important;margin:0 !important;padding:0 !important;}
body[data-path="login"] .page_content{margin:0;padding:0;min-height:100vh;}
body[data-path="login"] .page_content > div{min-height:100vh;}

/* two-column shell */
.ht-login-split{display:flex;min-height:100vh;width:100%;}

/* ---- brand hero (appears on the right in RTL) ---- */
.ht-hero{
  flex:1 1 52%;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(1100px 520px at 82% -8%,rgba(217,176,0,.20),transparent 60%),
    radial-gradient(760px 520px at 12% 112%,rgba(143,149,230,.22),transparent 62%),
    linear-gradient(135deg,#0d1430 0%,#1a1f52 45%,#2b3080 100%);
}
.ht-hero::before{content:"";position:absolute;inset:0;opacity:.06;
  background-image:repeating-linear-gradient(135deg,#fff 0,#fff 1px,transparent 1px,transparent 22px);}
.ht-hero::after{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:3px;
  background:linear-gradient(var(--ht-gold),rgba(217,176,0,.15));}
.ht-hero-inner{position:relative;z-index:1;max-width:440px;padding:48px;text-align:center;color:#fff;}
.ht-hero-logo{width:118px;height:118px;border-radius:50%;background:#fff;padding:8px;
  box-shadow:0 12px 40px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.25);margin-bottom:26px;}
.ht-hero .ht-hero-title{font-size:30px;font-weight:800;margin:0 0 8px;letter-spacing:-.01em;line-height:1.25;color:#ffffff;}
.ht-hero .ht-hero-sub{font-size:16px;color:#c7cbf0;margin:0 0 30px;font-weight:500;}
.ht-hero-list{list-style:none;padding:0;margin:0 auto;max-width:330px;text-align:start;}
.ht-hero-list li{position:relative;padding:9px 30px;color:#e6e8fb;font-size:15px;line-height:1.5;}
.ht-hero-list li::before{content:"";position:absolute;inset-inline-start:6px;top:15px;width:9px;height:9px;
  border-radius:50%;background:var(--ht-gold);box-shadow:0 0 0 4px rgba(217,176,0,.18);}
.ht-hero-foot{margin-top:34px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55);}

/* ---- form pane (appears on the left in RTL) ---- */
.ht-login-pane{flex:1 1 48%;display:flex;align-items:center;justify-content:center;background:#f6f7fb;padding:40px 24px;}
/* the moved section becomes a centered column: head (logo+title) then card */
.ht-login-pane .for-login{width:100%;max-width:400px;display:flex;flex-direction:column;align-items:stretch;margin:0;}
.ht-login-pane .for-login > .page-card-head{
  text-align:center;border:0;padding:0;margin:0 0 16px;
}
.ht-login-pane .for-login > .page-card-head .app-logo{
  width:60px;height:60px;border-radius:50%;background:#fff;padding:4px;
  box-shadow:0 4px 14px rgba(16,23,43,.12),0 0 0 1px #ececf3;display:inline-block;margin-bottom:10px;
}
.ht-login-pane .for-login > .page-card-head h4{
  font-size:21px;font-weight:700;color:var(--ht-indigo);margin:0;
}
/* the white form card */
body[data-path="login"] .login-content.page-card{
  width:100%;max-width:400px;margin:0;background:#fff;border:1px solid #eceef5;border-radius:16px;
  box-shadow:0 18px 50px rgba(16,23,43,.12);padding:30px 30px 26px;
}
/* forgot / email-link cards carry their own head - keep it tidy */
.ht-login-pane .for-login .page-card-head{border:0;}

body[data-path="login"] .form-control{
  height:44px;border-radius:10px;border:1px solid #e2e4ee;background:#fbfbfe;font-size:14px;padding:0 14px;}
body[data-path="login"] .form-control:focus{
  background:#fff;border-color:var(--ht-indigo);box-shadow:0 0 0 3px rgba(217,176,0,.22);}
body[data-path="login"] .btn-login,
body[data-path="login"] .btn-primary{
  height:46px;border-radius:10px;font-weight:600;font-size:15px;
  background:linear-gradient(135deg,var(--ht-indigo) 0%,var(--ht-indigo-700) 100%);
  border:0;color:#fff;box-shadow:0 6px 16px rgba(54,58,145,.28);transition:.18s;}
body[data-path="login"] .btn-login:hover,
body[data-path="login"] .btn-primary:hover{
  filter:brightness(1.06);box-shadow:0 8px 22px rgba(54,58,145,.34);transform:translateY(-1px);}
body[data-path="login"] .btn-login-option,
body[data-path="login"] .btn-default{
  height:42px;border-radius:10px;border:1px solid #e2e4ee;background:#fff;color:var(--ht-indigo);font-weight:500;}
body[data-path="login"] .login-divider{color:#9aa0b4;font-size:12px;}
body[data-path="login"] a{color:var(--ht-indigo);font-weight:500;}
body[data-path="login"] a:hover{color:var(--ht-indigo-700);}

/* mobile: stack, hero compact on top */
@media(max-width:860px){
  .ht-login-split{flex-direction:column;}
  .ht-hero{flex:0 0 auto;padding:34px 0;}
  .ht-hero::after{display:none;}
  .ht-hero-inner{padding:8px 24px;}
  .ht-hero-logo{width:82px;height:82px;margin-bottom:14px;}
  .ht-hero-title{font-size:23px;}
  .ht-hero-sub{margin-bottom:0;}
  .ht-hero-list{display:none;}
  .ht-hero-foot{margin-top:16px;}
  .ht-login-pane{flex:1 1 auto;padding:26px 18px 40px;}
  body[data-path="login"] .page_content > div{min-height:auto;}
}

/* Login inputs: center the prefix icon vertically in the taller field */
body[data-path="login"] .email-field,
body[data-path="login"] .password-field{position:relative;}
body[data-path="login"] .field-icon{
  top:50% !important;bottom:auto !important;transform:translateY(-50%);
  color:#9aa0b4;
}
/* keep room for the icon so text never sits under it */
body[data-path="login"] .email-field .form-control,
body[data-path="login"] .password-field .form-control{padding-inline-start:40px;}

/* ht-arabic-mark: search-result highlighting. Frappe wraps every matched
   letter in its own <mark>; Bootstrap gives mark .2em padding, which breaks
   Arabic joining so «ملفات» renders as isolated, spaced letters. Zero box,
   inline, soft gold background -- letters shape normally across the marks. */
.awesomplete mark, .awesomplete .mark, .navbar mark, .dropdown-menu mark,
.awesomplete li mark, [role="listbox"] mark {
  padding: 0 !important; margin: 0 !important; border: 0 !important;
  display: inline !important; letter-spacing: 0 !important; line-height: inherit !important;
  background: rgba(217,176,0,.32) !important; color: inherit !important; border-radius: 0 !important;
  font: inherit !important; text-decoration: none !important; box-shadow: none !important;
}
.awesomplete li, .awesomplete li span, .awesomplete .awesomplete-item { letter-spacing: 0 !important; word-spacing: normal !important; }

/* ---- List sidebar: Frappe renders an empty tooltip ("undefined") under the
   Save Filter box; hide the tooltip text node ---- */
.list-sidebar .tooltip-content,.layout-side-section .list-filters .tooltip-content{display:none !important;}

/* ---- Expiry quick-filter pills (lists) ---- */
.ht-pills{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px var(--padding-md,15px) 10px;border-bottom:1px solid var(--border-color);}
.ht-pills .ht-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 10px;font-size:12px;}
.ht-pills .ht-pill .ht-pill-count{background:var(--gray-200);color:var(--text-color);font-weight:600;}
.ht-pills .ht-pill.btn-primary .ht-pill-count{background:rgba(255,255,255,.25);color:#fff;}
.ht-pills .ht-pill[data-color="red"]:not(.btn-primary) .ht-pill-count{background:#fee2e2;color:#991b1b;}
.ht-pills .ht-pill[data-color="orange"]:not(.btn-primary) .ht-pill-count{background:#ffedd5;color:#9a3412;}
.ht-pills .ht-pill[data-color="yellow"]:not(.btn-primary) .ht-pill-count{background:#fef9c3;color:#854d0e;}
.ht-pills .ht-pill[data-color="green"]:not(.btn-primary) .ht-pill-count{background:#dcfce7;color:#166534;}
.ht-pills .ht-pill-clear{margin-inline-start:auto;font-size:12px;}

/* ---- Credential vault (company tab card) ---- */
.ht-vault-card{margin-top:0;}
.ht-vault-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.ht-vault-head h6{margin:0;font-weight:700;display:flex;align-items:center;gap:6px;}
.ht-vault-head .badge{background:var(--ht-indigo,#1e1b4b);color:#fff;}
.ht-cred-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,430px),1fr));gap:12px;}
.ht-cred{border:1px solid var(--border-color);border-radius:10px;background:var(--card-bg,#fff);padding:10px 12px 8px;
  border-inline-start:4px solid var(--ht-cred-color);box-shadow:0 1px 2px rgba(0,0,0,.04);}
.ht-cred-stopped{opacity:.6;}
.ht-cred-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px;}
.ht-cred-dot{width:9px;height:9px;border-radius:50%;background:var(--ht-cred-color);flex:0 0 auto;}
.ht-cred-title{font-weight:700;font-size:13.5px;color:var(--text-color) !important;}
.ht-cred-title:hover{color:var(--ht-indigo) !important;}
.ht-cred-purpose{font-size:11px;background:var(--gray-100);color:var(--text-muted);border-radius:999px;padding:1px 8px;}
.ht-cred-spacer{flex:1;}
.ht-cred-body{display:flex;flex-direction:column;gap:4px;}
.ht-cred-field{display:flex;align-items:center;gap:8px;min-height:26px;}
.ht-cred-label{flex:0 0 96px;color:var(--text-muted);font-size:12px;}
.ht-cred-value{flex:1;min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;direction:ltr;text-align:left;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ht-cred-mask{letter-spacing:2px;color:var(--text-muted);}
.ht-cred-actions{display:inline-flex;gap:4px;flex:0 0 auto;}
.ht-cred-actions .btn-xs{padding:1px 7px;font-size:11px;line-height:18px;display:inline-flex;align-items:center;gap:3px;}
.ht-cred-actions .btn-xs:hover{border-color:var(--ht-indigo);color:var(--ht-indigo);}
.ht-cred-foot{font-size:11px;margin-top:6px;padding-top:6px;border-top:1px dashed var(--border-color);}
.ht-vault-note{margin:8px 0 0;font-size:11px;display:flex;align-items:center;gap:4px;}
.ht-vault-value{direction:ltr;text-align:left;}
@media (max-width:480px){.ht-cred-label{flex-basis:80px;}.ht-cred-actions .btn-xs span+span{display:none;}}

/* ---- Navbar: hide the Help (مساعدة) dropdown; it points at Frappe docs and forum ---- */
.navbar .dropdown-help,.navbar li.dropdown-help,.navbar .nav-item.dropdown-help{display:none !important;}

/* ---- WhatsApp button on contact cards ---- */
.ht-wa-btn{display:inline-flex;align-items:center;gap:4px;padding:1px 8px;line-height:18px;}
.ht-wa-btn:hover{border-color:#25D366;color:#128C7E;}
.ht-wa-icon{flex:0 0 auto;vertical-align:middle;}

/* ---- Navbar breadcrumbs: Frappe draws the separator as an SVG chevron with a
   dark stroke baked into a CSS variable; on the indigo header it read black.
   Same chevron, white, pointing left for the RTL layout. ---- */
#navbar-breadcrumbs a:before{
  content:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='12' viewBox='0 0 8 12'><path d='M6 1.5L1.5 6 6 10.5' fill='none' stroke='%23ffffff' stroke-opacity='.8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;
  vertical-align:middle;
}
[dir="ltr"] #navbar-breadcrumbs a:before{
  content:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='12' viewBox='0 0 8 12'><path d='M2 1.5L6.5 6 2 10.5' fill='none' stroke='%23ffffff' stroke-opacity='.8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;
}
#navbar-breadcrumbs li.disabled a{color:rgba(255,255,255,.75) !important;}
/* centre the chevron on the Arabic text (it sat a few pixels high) */
#navbar-breadcrumbs li a{display:inline-flex;align-items:center;gap:8px;line-height:1;}
#navbar-breadcrumbs a:before{margin:0 !important;position:relative;top:0;line-height:0;transform:scale(.85);}
/* ---- Card headings on the Company tabs: badge and pills centred on the
   heading text (Tajawal sits high in its box, so the badges looked low) ---- */
.ht-client-file-head h6,.ht-vault-head h6,.ht-contact-card .ht-vault-head h6{display:inline-flex;align-items:center;gap:6px;line-height:1.2;}
.ht-client-file-head h6 .badge,.ht-vault-head h6 .badge{position:relative;top:-2px;line-height:1.4;padding:2px 7px;}
.ht-vault-head h6 .indicator-pill{position:relative;top:-2px;line-height:1.5;}
/* breadcrumbs on the same centre line as the logo (the link sat at the top of its 22px row) */
#navbar-breadcrumbs{display:flex;align-items:center;align-self:stretch;}
#navbar-breadcrumbs > li{display:flex;align-items:center;}
/* bell and other filled navbar icons (es-icon uses fill, not stroke) */
.navbar .es-icon,.navbar .es-icon use,.navbar .notifications-seen svg,.navbar .notifications-unseen svg{fill:#fff !important;color:#fff;}
/* awesomebar text centred in its 28px box (Tajawal sits high; nudge the text down) */
.navbar #navbar-search,.navbar .form-control{line-height:16px;padding-top:8px;padding-bottom:4px;height:28px;}
/* Frappe "es" icons paint their paths with var(--icon-stroke); set it white inside the header */
.navbar,.navbar .es-icon,.navbar .dropdown-notifications,.navbar .notifications-seen,.navbar .notifications-unseen{--icon-stroke:#fff;--icon-fill:transparent;}

/* ---- Company documents card (مستندات الشركة): category sections ---- */
.ht-cf-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
.ht-cf-head h6{margin:0;font-weight:700;}
.ht-cf-tools{margin-inline-start:auto;display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.ht-cf-tools .btn-xs{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;line-height:18px;}
.ht-cf-search-wrap{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--border-color);border-radius:6px;padding:0 8px;background:var(--control-bg,#f8fafc);height:26px;}
.ht-cf-search-wrap .icon{opacity:.6;}
.ht-cf-search{border:0;background:transparent;font-size:12px;min-width:170px;height:24px;outline:none;}
.ht-cf-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 10px;font-size:12px;}
.ht-cf-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border-color);border-radius:999px;padding:2px 10px;background:var(--card-bg,#fff);color:var(--text-color) !important;text-decoration:none !important;}
.ht-cf-chip .n{font-weight:700;font-variant-numeric:tabular-nums;}
.ht-cf-chip[data-color="green"] .n{color:#166534;} .ht-cf-chip[data-color="orange"] .n{color:#9a3412;}
.ht-cf-chip[data-color="red"] .n{color:#991b1b;} .ht-cf-chip[data-color="indigo"] .n{color:#3730a3;}
.ht-cf-chip:hover{border-color:var(--ht-indigo);}
.ht-cf-chip.active,.ht-cf-chip.active .n{background:var(--ht-indigo);border-color:var(--ht-indigo);color:#fff !important;}
.ht-cf-spacer{flex:1;}
.ht-cf-expand-all,.ht-cf-collapse-all{font-size:12px;color:var(--text-muted) !important;}
.ht-cf-cat{border:1px solid var(--border-color);border-radius:10px;margin-bottom:10px;background:var(--card-bg,#fff);overflow:hidden;}
.ht-cf-cat-head{display:flex;align-items:center;gap:8px;padding:7px 12px;background:var(--subtle-fg,#f8f9fb);cursor:pointer;user-select:none;border-bottom:1px solid var(--border-color);}
.ht-cf-cat.collapsed .ht-cf-cat-head{border-bottom:0;}
.ht-cf-cat.collapsed .ht-cf-cat-body{display:none;}
.ht-cf-chev{display:inline-flex;transition:transform .15s;color:var(--text-muted);}
.ht-cf-cat.collapsed .ht-cf-chev{transform:rotate(90deg);}
.ht-cf-cat-title{font-weight:700;font-size:13px;}
.ht-cf-cat-count{font-size:11px;background:var(--gray-200,#e5e7eb);color:var(--text-color);border-radius:999px;padding:1px 8px;font-variant-numeric:tabular-nums;}
.ht-cf-cat-flags{display:inline-flex;gap:4px;}
.ht-cf-flag{font-size:11px;border-radius:999px;padding:1px 8px;}
.ht-cf-flag.red{background:#fee2e2;color:#991b1b;} .ht-cf-flag.orange{background:#ffedd5;color:#9a3412;} .ht-cf-flag.indigo{background:#e0e7ff;color:#3730a3;}
.ht-cf-cat .btn-xs{display:inline-flex;align-items:center;gap:3px;padding:1px 7px;line-height:18px;font-size:11px;}
.ht-cf-cat-body .table{margin:0;}
.ht-cf-cat-body .table th{font-size:11.5px;font-weight:600;color:var(--text-muted);border-top:0;padding:6px 8px;white-space:nowrap;}
.ht-cf-cat-body .table td{padding:6px 8px;vertical-align:middle;}
.ht-cf-check-col{width:32px;}
.ht-cf-type{font-weight:600;color:var(--text-color) !important;}
.ht-cf-type:hover{color:var(--ht-indigo) !important;}
.ht-cf-ver{font-size:10px;color:var(--text-muted);border:1px solid var(--border-color);border-radius:4px;padding:0 4px;direction:ltr;display:inline-block;}
.ht-cf-missing td{background:#fafbff;}
.ht-cf-actions{display:inline-flex;gap:2px;}
.ht-cf-actions a{display:inline-flex;padding:3px 5px;border-radius:5px;color:var(--text-muted);}
.ht-cf-actions a:hover{background:var(--gray-100,#f3f4f6);color:var(--ht-indigo);}
.ht-cf-empty-cats{font-size:12px;color:var(--text-muted);margin-top:4px;line-height:2;}
.ht-cf-empty-cats a{color:var(--text-muted) !important;text-decoration:underline dotted;}
.ht-cf-empty-cats a:hover{color:var(--ht-indigo) !important;}
.ht-cf-dot{margin:0 6px;}
.ht-cf-hidden{display:none !important;}
.ht-cf-noresults{padding:18px;text-align:center;color:var(--text-muted);border:1px dashed var(--border-color);border-radius:10px;}
@media (max-width:640px){.ht-cf-search{min-width:110px;} .ht-cf-tools .btn-xs span+span{display:none;}}

/* ---- company access profiles (ht_access.js, company form, access screen) ---- */
.ht-cf-no-add .ht-add-doc,.ht-cf-no-add .ht-cf-add-type,.ht-cf-no-add .ht-cf-add-cat{display:none !important;}
.ht-cf-no-edit .ht-renew-doc{display:none !important;}
.ht-cf-no-print .ht-print-file,.ht-cf-no-print .ht-print-selected,.ht-cf-no-print .ht-print-doc{display:none !important;}
.ht-contact-card.ht-readonly .ht-add-contact,.ht-contact-card.ht-readonly .ht-add-address{display:none !important;}
.ht-access-intro{line-height:1.7;}
.ht-access-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;}
.ht-access-chip{display:inline-block;padding:1px 8px;border-radius:999px;font-size:11px;line-height:18px;border:1px solid var(--border-color);white-space:nowrap;}
.ht-access-full{background:rgba(22,163,74,.10);border-color:rgba(22,163,74,.35);color:#166534;}
.ht-access-part{background:rgba(79,70,229,.08);border-color:rgba(79,70,229,.30);color:var(--ht-indigo,#4338ca);}
.ht-access-none{background:var(--subtle-fg,#f4f5f7);color:var(--text-muted);text-decoration:line-through;}
.ht-access-table-wrap{overflow-x:auto;}
.ht-access-table{font-size:12px;margin-bottom:8px;}
.ht-access-table td{vertical-align:middle;}
.ht-access-table td.ht-access-chips{display:table-cell;min-width:320px;}
.ht-access-table td.ht-access-chips .ht-access-chip{margin:1px;}
.ht-access-inactive td{opacity:.6;}
.ht-access-h{margin:12px 0 6px;font-weight:700;}
.ht-access-empty{padding:10px;color:var(--text-muted);border:1px dashed var(--border-color);border-radius:8px;}
.ht-access-preview{padding:8px 10px;border-radius:8px;background:var(--subtle-fg,#f4f5f7);}
.ht-access-summary{display:flex;flex-direction:column;gap:8px;}
.ht-access-stats{display:flex;gap:18px;flex-wrap:wrap;}
.ht-access-stats>div{display:flex;align-items:baseline;gap:6px;color:var(--text-muted);}
.ht-access-num{font-size:20px;font-weight:700;color:var(--text-color);font-variant-numeric:tabular-nums;}
.ht-access-profiles{display:flex;flex-wrap:wrap;gap:6px;}
.ht-access-warn{padding:6px 10px;border-radius:8px;background:rgba(234,88,12,.08);color:#9a3412;}
.ht-access-usage{padding:6px 0;}

/* ---- company form: «أوامر العمل» tab (work_order_company.js) ---- */
.ht-wo-table-wrap{overflow-x:auto;border:1px solid var(--border-color);border-radius:10px;background:var(--card-bg,#fff);}
.ht-wo-table-wrap .table.ht-wo-table{margin:0 !important;font-size:13px;}
.ht-wo-table tbody tr:last-child td{border-bottom:0;}
.ht-wo-table td:first-child{min-width:200px;}
.ht-wo-table td:nth-child(4),.ht-wo-table td:nth-child(5){white-space:nowrap;}
.ht-wo-sub span[dir="ltr"]{white-space:nowrap;}
.ht-wo-table th{font-size:11.5px;font-weight:600;color:var(--text-muted);border-top:0;padding:7px 10px;white-space:nowrap;background:var(--subtle-fg,#f8f9fb);}
.ht-wo-table td{padding:7px 10px;vertical-align:middle;}
.ht-wo-row{cursor:pointer;}
.ht-wo-row:hover td{background:var(--gray-50,#fafafa);}
.ht-wo-title{font-weight:600;color:var(--text-color) !important;}
.ht-wo-title:hover{color:var(--ht-indigo) !important;}
.ht-wo-sub{font-size:11px;color:var(--text-muted);margin-top:2px;line-height:1.6;}
.ht-wo-sub .ht-cf-flag{font-size:10.5px;}
.ht-wo-late{color:#991b1b;font-weight:600;}
.ht-wo-bill{font-size:12px;color:var(--text-muted);}
.ht-wo-more{text-align:center;margin-top:10px;}
@media (max-width:640px){.ht-wo-hide-sm{display:none;} .ht-wo-table td,.ht-wo-table th{padding:6px;}}