@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap");

/* ==========================================================
   InfoClutch visual theme layer
   - visual-only pass; no layout logic or card structure changes
   - matches the shared InfoClutch references: #518fee primary,
     #eeb308 secondary, Poppins typography, pill controls,
     bright blue header surfaces, light blue workspace background.
   ========================================================== */
:root{
  --info-primary:#518fee;
  --info-primary-dark:#3d76c7;
  --info-secondary:#eeb308;
  --info-text:#4d4d4d;
  --info-accent:#61ce70;
  --info-bg:#f5f9ff;
  --info-panel:#ffffff;
  --info-soft:#eef5ff;
  --info-soft-2:#dceafe;
  --info-border:#d8e6fb;
  --info-shadow:0 18px 42px rgba(61,118,199,.14);
}
html,body{font-family:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;color:var(--info-text);}
body{background:linear-gradient(180deg,#edf5ff 0%,#f8fbff 44%,#f5f9ff 100%) !important;}

/* ---------- Shared typography ---------- */
body h1, body h2, body h3, body h4, body h5, body h6,
body .h1, body .h2, body .h3, body .h4, body .h5, body .h6,
body .navbar, body .btn, body .form-label, body .nav-link, body .dropdown-item,
body .card-title, body .ff-page-title, body .dash-title, body .page-title{
  font-family:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;
}
body p, body span, body div, body a, body li, body td, body th, body small, body input, body select, body textarea{
  font-family:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;
}

a{color:var(--info-primary);}
a:hover{color:var(--info-primary-dark);}

/* ---------- Public nav / top nav ---------- */
.sg-nav,
body.landing .sg-nav,
body.auth .sg-nav{
  background:linear-gradient(135deg,#4f89e4 0%,#5e9bf2 100%) !important;
  border:0 !important;
  border-radius:0 0 22px 22px;
  box-shadow:0 14px 32px rgba(61,118,199,.18) !important;
  padding-top:10px;
  padding-bottom:10px;
}
.sg-nav .container{align-items:center;}
.sg-brand{gap:14px !important;}
.sg-brandmark.sg-brandmark--wide{
  width:auto !important;
  height:42px !important;
  border:0 !important;
  background:transparent !important;
  border-radius:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
}
.sg-brandmark.sg-brandmark--wide img{
  width:auto !important;
  height:100% !important;
  max-width:178px;
  object-fit:contain;
  filter:brightness(0) invert(1);
}
.sg-nav .nav-link,
body.landing .sg-nav .nav-link,
body.auth .sg-nav .nav-link,
.sg-nav .navbar-brand,
.sg-nav .navbar-brand:hover{
  color:#fff !important;
  font-weight:500 !important;
}
.sg-nav .nav-link:hover,
.sg-nav .nav-link:focus{color:#eaf3ff !important;}
.sg-nav .nav-link i{opacity:.9;}
.sg-nav .navbar-toggler{border:1px solid rgba(255,255,255,.35);border-radius:14px;padding:.5rem .7rem;}
.sg-nav .navbar-toggler:focus{box-shadow:0 0 0 .18rem rgba(255,255,255,.22);}
.sg-nav .navbar-toggler-icon{filter:brightness(0) invert(1);}
.sg-nav .btn,
body.landing .sg-navbtn,
body.auth .sg-navbtn{
  border-radius:14px !important;
  min-height:44px;
  padding:10px 18px !important;
  font-weight:600 !important;
  box-shadow:none !important;
}
.sg-nav .btn-primary,
body.landing .sg-nav .btn-primary,
body.auth .sg-nav .btn-primary{
  background:#fff !important;
  border-color:#fff !important;
  color:var(--info-primary) !important;
}
.sg-nav .btn-outline-secondary,
.sg-nav .btn-outline-primary{
  border-color:rgba(255,255,255,.75) !important;
  color:#fff !important;
  background:transparent !important;
}
.sg-nav .btn-outline-secondary:hover,
.sg-nav .btn-outline-primary:hover{
  background:rgba(255,255,255,.12) !important;
  color:#fff !important;
}

/* ---------- Workspace frame ---------- */
body:not(.landing):not(.auth) .dash-layout{background:transparent !important;}
body:not(.landing):not(.auth) .dash-main{
  background:
    radial-gradient(circle at 10% 10%, rgba(81,143,238,.10) 0, rgba(81,143,238,.10) 14px, transparent 15px),
    radial-gradient(circle at 18% 16%, rgba(81,143,238,.12) 0, rgba(81,143,238,.12) 8px, transparent 9px),
    linear-gradient(180deg,#edf5ff 0%,#f8fbff 46%,#f5f9ff 100%) !important;
  border-left:1px solid rgba(81,143,238,.08);
}
body:not(.landing):not(.auth) .dash-main::after{
  background-image:url('../img/dashboard-end-waves.svg') !important;
  opacity:.6 !important;
}

/* ---------- Sidebar ---------- */
.dash-sidebar,
.dash-offcanvas{
  background:linear-gradient(180deg,#4f89e4 0%,#5a97ef 55%,#4f89e4 100%) !important;
  border-right:0 !important;
  box-shadow:10px 0 34px rgba(61,118,199,.16) !important;
  color:#fff !important;
}
.dash-sidebar::before,
.dash-offcanvas::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:230px;
  pointer-events:none;
  background:
    radial-gradient(circle at 24% 20%, rgba(255,255,255,.22) 0 16px, transparent 17px),
    radial-gradient(circle at 56% 34%, rgba(255,255,255,.16) 0 10px, transparent 11px),
    radial-gradient(circle at 74% 10%, rgba(255,255,255,.12) 0 22px, transparent 23px);
  opacity:.55;
}
.dash-sidebar .dash-logo.dash-logo--combined,
.dash-offcanvas .dash-logo.dash-logo--combined{
  height:56px !important;
}
.dash-sidebar .dash-logo.dash-logo--combined img,
.dash-offcanvas .dash-logo.dash-logo--combined img{
  filter:brightness(0) invert(1);
  max-width:185px !important;
}
.dash-brand, .offcanvas-header .offcanvas-title{position:relative;z-index:1;}
.dash-sidebar .sidebar-toggle{
  border-color:rgba(255,255,255,.28) !important;
  background:rgba(255,255,255,.14) !important;
  color:#fff !important;
  border-radius:999px !important;
  box-shadow:0 10px 24px rgba(26,72,145,.24) !important;
}
.dash-sidebar .sidebar-toggle:hover{background:rgba(255,255,255,.22) !important;color:#fff !important;}
.sidebar-nav{gap:8px !important;position:relative;z-index:1;}
.sidebar-nav .nav-item{
  border-radius:18px !important;
  min-height:48px !important;
  color:rgba(255,255,255,.88) !important;
  font-weight:500 !important;
  border:1px solid transparent !important;
  padding:11px 14px !important;
}
.sidebar-nav .nav-item i{color:rgba(255,255,255,.88) !important;}
.sidebar-nav .nav-item:hover{
  background:rgba(255,255,255,.16) !important;
  border-color:rgba(255,255,255,.16) !important;
  color:#fff !important;
  transform:translateX(2px);
}
.sidebar-nav .nav-item.active{
  background:rgba(255,255,255,.19) !important;
  border-color:rgba(255,255,255,.18) !important;
  box-shadow:inset 4px 0 0 var(--info-secondary), 0 12px 26px rgba(31,78,152,.16) !important;
  color:#fff !important;
}
.sidebar-nav .nav-item.active i,
.sidebar-nav .nav-item:hover i{color:#fff !important;}
.sidebar-nav .nav-item-badge{
  background:#fff !important;
  color:var(--info-primary) !important;
  border:1px solid rgba(255,255,255,.45);
  font-weight:700 !important;
}
.dash-sidebar-footer,
.dash-offcanvas .border-top{
  border-color:rgba(255,255,255,.18) !important;
  color:rgba(255,255,255,.78) !important;
}
.dash-sidebar-footer a,
.dash-sidebar-footer .btn,
.dash-offcanvas .btn{color:#fff !important;border-color:rgba(255,255,255,.24) !important;}
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined img{max-width:92px !important;}
.dash-sidebar.is-collapsed .sidebar-nav .nav-item{justify-content:center;}

/* ---------- Page hero / topbar ---------- */
body:not(.landing):not(.auth) .ff-topbar,
.super-admin-page .sa-page-header,
body.dashboard-view .dashboard-topbar{
  position:relative;
  overflow:hidden;
  border:0 !important;
  border-radius:28px !important;
  padding:20px 24px !important;
  background:linear-gradient(135deg,#4f89e4 0%,#5e9bf2 100%) !important;
  box-shadow:var(--info-shadow) !important;
  color:#fff !important;
}
body:not(.landing):not(.auth) .ff-topbar::before,
.super-admin-page .sa-page-header::before,
body.dashboard-view .dashboard-topbar::before{
  content:"";
  position:absolute;
  right:-56px;
  top:-70px;
  width:180px;
  height:180px;
  border-radius:50%;
  background:rgba(255,255,255,.17);
}
body:not(.landing):not(.auth) .ff-topbar::after,
.super-admin-page .sa-page-header::after,
body.dashboard-view .dashboard-topbar::after{
  content:"";
  position:absolute;
  left:26px;
  bottom:0;
  width:78px;
  height:5px;
  border-radius:999px 999px 0 0;
  background:var(--info-secondary);
}
.ff-topbar .page-section-header,
.dashboard-topbar .page-section-header,
.sa-page-header > *{position:relative;z-index:1;}
.ff-topbar .dash-title,
.dashboard-topbar .dash-title,
.ff-topbar h1,
.ff-topbar h2,
.ff-topbar .page-title,
.dashboard-topbar h1,
.dashboard-topbar h2,
.sa-page-header h1,
.sa-page-header h2,
.sa-page-header .h3,
.page-heading-row .h3,
.page-heading-row .h4{
  color:#fff !important;
  font-size:clamp(1.7rem,2vw,2.2rem) !important;
  font-weight:600 !important;
  letter-spacing:-.02em !important;
  text-transform:none !important;
}
.ff-topbar .dash-subtitle,
.dashboard-topbar .dash-subtitle,
.ff-topbar p,
.dashboard-topbar p,
.page-section-header p,
.sa-page-header p,
.page-subtitle{color:rgba(255,255,255,.84) !important;}
.ff-topbar .ff-icon-btn,
.ff-topbar .compact-profile-menu .btn,
.ff-topbar .btn,
.dashboard-topbar .btn,
.dashboard-topbar .ff-icon-btn{
  border-radius:999px !important;
}

/* ---------- Buttons / pills / forms ---------- */
body .btn,
body .form-control,
body .form-select,
body .input-group-text,
body .badge,
body .nav-pills .nav-link,
body .nav-tabs .nav-link{
  border-radius:16px !important;
}
body:not(.landing):not(.auth) .btn-primary,
body:not(.landing):not(.auth) .ff-primary-btn,
body.auth .td-login-submit,
body.auth .btn-primary{
  background:linear-gradient(135deg,#1575cf 0%,#518fee 100%) !important;
  border-color:#518fee !important;
  color:#fff !important;
  font-weight:600 !important;
  box-shadow:0 10px 24px rgba(61,118,199,.18) !important;
}
body:not(.landing):not(.auth) .btn-primary:hover,
body:not(.landing):not(.auth) .ff-primary-btn:hover,
body.auth .td-login-submit:hover,
body.auth .btn-primary:hover{
  background:linear-gradient(135deg,#1269b8 0%,#467fce 100%) !important;
  border-color:#467fce !important;
}
body .btn-outline-primary,
body .btn-outline-secondary,
body .dashboard-view-all,
body .sa-toolbar-view-all,
body .dashboard-recent-action,
body .dashboard-client-action,
body .sa-action-view,
body .ff-panel-share-btn,
body .ff-client-view,
body .ff-back,
body .recent-action-btn{
  border:1px solid var(--info-border) !important;
  background:#fff !important;
  color:var(--info-primary) !important;
  border-radius:999px !important;
  box-shadow:none !important;
  font-weight:600 !important;
}
body .btn-outline-primary:hover,
body .btn-outline-secondary:hover,
body .dashboard-view-all:hover,
body .sa-toolbar-view-all:hover,
body .dashboard-recent-action:hover,
body .dashboard-client-action:hover,
body .sa-action-view:hover,
body .ff-panel-share-btn:hover,
body .ff-client-view:hover,
body .ff-back:hover,
body .recent-action-btn:hover{
  background:var(--info-soft) !important;
  border-color:#bfd5f7 !important;
  color:var(--info-primary-dark) !important;
}
body .form-control,
body .form-select,
body .input-group-text{
  border-color:#dfe9f9 !important;
  background:#fff !important;
  color:var(--info-text) !important;
  min-height:46px;
}
body .form-control:focus,
body .form-select:focus{
  border-color:#8ab5f4 !important;
  box-shadow:0 0 0 .18rem rgba(81,143,238,.14) !important;
}

/* ---------- Cards / panels ---------- */
body:not(.landing):not(.auth) .card,
body:not(.landing):not(.auth) .stat-card,
body:not(.landing):not(.auth) .action-card,
body:not(.landing):not(.auth) .dashboard-reference-card,
body:not(.landing):not(.auth) .dashboard-clients-card,
body:not(.landing):not(.auth) .dashboard-recent-card,
body:not(.landing):not(.auth) .dash-panel,
body:not(.landing):not(.auth) .ff-card,
body:not(.landing):not(.auth) .sa-table-card,
.super-admin-page .sa-overview-card,
body:not(.landing):not(.auth) .ticket-thread-body,
body:not(.landing):not(.auth) .ticket-composer{
  background:var(--info-panel) !important;
  border:1px solid var(--info-border) !important;
  border-radius:24px !important;
  box-shadow:0 12px 28px rgba(61,118,199,.08) !important;
}
body.dashboard-view .dash-stats-compact .action-card,
body.dashboard-view .stat-card.action-card{
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%) !important;
  min-height:146px !important;
}
body.dashboard-view .dash-stats-compact .action-card:hover,
body:not(.landing):not(.auth) .action-card:hover,
.super-admin-page .sa-overview-card:hover{
  transform:translateY(-3px);
  border-color:#bfd5f7 !important;
  box-shadow:0 18px 36px rgba(61,118,199,.12) !important;
}
body.dashboard-view .dash-stats-compact .icon-bubble,
body.dashboard-view .dashboard-recent-icon,
body.dashboard-view .received-file-icon,
body .page-heading-icon,
body .ff-metric-icon,
body .sa-overview-icon,
body .dash-share-icon{
  background:linear-gradient(135deg,#eef5ff 0%,#dceafe 100%) !important;
  color:var(--info-primary) !important;
  border:1px solid #d4e4fb !important;
  box-shadow:none !important;
}
body.dashboard-view .dashboard-recent-icon.is-folder{background:rgba(238,179,8,.16) !important;color:#b78600 !important;border-color:rgba(238,179,8,.26) !important;}
body.dashboard-view .card-title,
body.dashboard-view .dash-stats-compact .card-title,
body.dashboard-view .dashboard-recent-name,
body.dashboard-view .dashboard-client-name,
.super-admin-page .sa-overview-value,
.super-admin-page .sa-overview-title{color:#1f2e46 !important;font-weight:600 !important;}
body.dashboard-view .card-subtitle,
body.dashboard-view .dashboard-recent-muted,
body.dashboard-view .dashboard-client-sub,
.super-admin-page .sa-overview-meta{color:#5c6c84 !important;}
body.dashboard-view .dashboard-reference-head,
body.dashboard-view .dashboard-clients-head,
body.dashboard-view .dashboard-recent-head,
body .card-header,
body .ff-activity-panel-head,
body .ticket-thread-head{
  border-bottom:1px solid #ebf1fb !important;
  background:transparent !important;
}
body.dashboard-view .dashboard-reference-label,
body.dashboard-view .dashboard-side-heading,
body.dashboard-view .dashboard-section-chip,
body .ff-section-label,
body .badge-soft{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  border-radius:999px;
  background:var(--info-soft) !important;
  border:1px solid #d8e6fb !important;
  color:var(--info-primary) !important;
  font-weight:600 !important;
}

/* ---------- Tables / lists ---------- */
body .table,
body .ff-project-table,
body .sa-table-card table{color:#31455f !important;}
body .table thead th,
body .ff-project-table thead th,
body .sa-table-card thead th,
body.dashboard-view .dashboard-recent-table thead th{
  background:#f6f9ff !important;
  color:#55708f !important;
  border-color:#e4edf9 !important;
  font-weight:600 !important;
  letter-spacing:.04em;
}
body .table tbody td,
body .ff-project-table tbody td,
body.dashboard-view .dashboard-recent-table tbody td{
  border-color:#edf2fb !important;
  color:#2f4158 !important;
}
body .table tbody tr:hover td,
body .ff-project-table tbody tr:hover td,
body.dashboard-view .dashboard-recent-table tbody tr:hover td{
  background:#fbfdff !important;
}
body .table-responsive,
body .ff-project-table-wrap,
body .sa-table-card > .table-responsive{
  border-radius:20px !important;
}
body.dashboard-view .dashboard-client-row,
body.dashboard-view .dashboard-client-row.dashboard-client-row-received,
body .recent-row{
  border-bottom:1px solid #edf2fb !important;
}
body.dashboard-view .dashboard-client-row:hover,
body .recent-row:hover{
  background:#fbfdff !important;
}
body.dashboard-view .dashboard-side-empty,
body .text-muted{color:#6a7c95 !important;}

/* ---------- Auth / login ---------- */
body.auth,
body.login-view{
  background:linear-gradient(180deg,#edf5ff 0%,#f8fbff 52%,#f5f9ff 100%) !important;
}
body.auth .td-login-stage{
  background:transparent !important;
}
body.auth .td-login-card{
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:30px !important;
  box-shadow:0 24px 50px rgba(61,118,199,.12) !important;
}
body.auth .td-login-brand-mark--combined img{
  max-width:188px !important;
}
body.auth .td-login-kicker{
  color:var(--info-primary) !important;
  letter-spacing:.18em !important;
  font-weight:700 !important;
}
body.auth .td-login-title{color:#1e2d46 !important;font-weight:600 !important;}
body.auth .td-login-subtitle,
body.auth .td-login-brand-copy small,
body.auth .td-back-login{color:#61748d !important;}

/* ---------- Footer ---------- */
.footer,
body:not(.landing):not(.auth) footer{
  background:transparent !important;
  border-top:1px solid rgba(81,143,238,.12) !important;
  color:#61748d !important;
}
.footer a,
footer a{color:var(--info-primary) !important;}

/* ---------- Utility clean-up ---------- */
.modal-content,
.dropdown-menu{
  border:1px solid #dfe9f9 !important;
  border-radius:22px !important;
  box-shadow:0 18px 36px rgba(61,118,199,.16) !important;
}
.dropdown-item:hover,
.dropdown-item:focus{background:var(--info-soft) !important;color:var(--info-primary-dark) !important;}
.ticket-msg.is-mine .ticket-msg-bubble,
.ticket-composer-send,
.ticket-msg-avatar.avatar-client{background:var(--info-primary) !important;border-color:var(--info-primary) !important;}

/* Make the collapsed sidebar toggle stay visible on the blue rail. */
.dash-sidebar.is-collapsed .sidebar-toggle{
  right:-15px !important;
  background:#fff !important;
  color:var(--info-primary) !important;
  border-color:#dbe7fa !important;
}

@media (max-width: 991.98px){
  .sg-nav,
  body.landing .sg-nav,
  body.auth .sg-nav{border-radius:0 0 18px 18px;}
  body:not(.landing):not(.auth) .ff-topbar,
  body.dashboard-view .dashboard-topbar,
  .super-admin-page .sa-page-header{border-radius:22px !important;padding:18px 18px !important;}
}

/* ======================================================================
   INFOCLUTCH FULL-SITE CONSISTENCY PASS
   Covers legacy workspace headers, clients, projects, issues, documents,
   shared files, settings, profile, preview, notifications, auth and legal.
   ====================================================================== */

/* The older workspace pages use .workspace-topbar / .ff-client-head rather
   than .ff-topbar. Give every internal page the same blue InfoClutch header. */
body:not(.landing):not(.auth) .workspace-topbar,
body:not(.landing):not(.auth) .ff-client-head,
body:not(.landing):not(.auth) .ff-topbar,
body:not(.landing):not(.auth) .super-admin-page .sa-page-header,
body:not(.landing):not(.auth) .sa-page-header{
  position:relative !important;
  isolation:isolate;
  overflow:visible !important;
  width:100% !important;
  margin:0 0 22px !important;
  padding:18px 22px !important;
  border:0 !important;
  border-radius:25px !important;
  background:
    radial-gradient(circle at 95% 5%,rgba(255,255,255,.15) 0 78px,transparent 79px),
    radial-gradient(circle at 87% 112%,rgba(255,255,255,.08) 0 112px,transparent 113px),
    linear-gradient(135deg,#4a86e3 0%,#5b97ee 58%,#66a2f7 100%) !important;
  box-shadow:0 15px 34px rgba(61,118,199,.16) !important;
}
body:not(.landing):not(.auth) .workspace-topbar::after,
body:not(.landing):not(.auth) .ff-client-head::after,
body:not(.landing):not(.auth) .ff-topbar::after,
body:not(.landing):not(.auth) .sa-page-header::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:22px !important;
  right:auto !important;
  top:auto !important;
  bottom:0 !important;
  width:72px !important;
  height:5px !important;
  border-radius:999px 999px 0 0 !important;
  background:var(--info-secondary) !important;
  z-index:2 !important;
}
body:not(.landing):not(.auth) .workspace-topbar::before,
body:not(.landing):not(.auth) .ff-client-head::before,
body:not(.landing):not(.auth) .ff-topbar::before,
body:not(.landing):not(.auth) .sa-page-header::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  right:-42px !important;
  top:-76px !important;
  width:190px !important;
  height:190px !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.12) !important;
  pointer-events:none !important;
  z-index:0 !important;
}
body:not(.landing):not(.auth) .workspace-topbar > *,
body:not(.landing):not(.auth) .ff-client-head > *,
body:not(.landing):not(.auth) .ff-topbar > *,
body:not(.landing):not(.auth) .sa-page-header > *{
  position:relative !important;
  z-index:3 !important;
}
body:not(.landing):not(.auth) .workspace-topbar h1,
body:not(.landing):not(.auth) .workspace-topbar h2,
body:not(.landing):not(.auth) .workspace-topbar .h3,
body:not(.landing):not(.auth) .workspace-topbar .h4,
body:not(.landing):not(.auth) .ff-client-head h1,
body:not(.landing):not(.auth) .ff-client-head h2,
body:not(.landing):not(.auth) .ff-topbar h1,
body:not(.landing):not(.auth) .ff-topbar h2,
body:not(.landing):not(.auth) .ff-topbar .h3,
body:not(.landing):not(.auth) .ff-topbar .h4,
body:not(.landing):not(.auth) .sa-page-header h1,
body:not(.landing):not(.auth) .sa-page-header h2,
body:not(.landing):not(.auth) .sa-page-header .h3,
body:not(.landing):not(.auth) .sa-page-header .h4{
  color:#fff !important;
  font-weight:600 !important;
  letter-spacing:-.02em !important;
}
body:not(.landing):not(.auth) .workspace-topbar .page-heading-subtitle,
body:not(.landing):not(.auth) .workspace-topbar .text-muted,
body:not(.landing):not(.auth) .ff-client-head .page-heading-subtitle,
body:not(.landing):not(.auth) .ff-client-head .text-muted,
body:not(.landing):not(.auth) .ff-topbar .page-heading-subtitle,
body:not(.landing):not(.auth) .ff-topbar .text-muted,
body:not(.landing):not(.auth) .sa-page-header .page-heading-subtitle,
body:not(.landing):not(.auth) .sa-page-header .text-muted{
  color:rgba(255,255,255,.82) !important;
}
body:not(.landing):not(.auth) .workspace-topbar .page-heading-icon,
body:not(.landing):not(.auth) .ff-client-head .page-heading-icon,
body:not(.landing):not(.auth) .ff-topbar .page-heading-icon,
body:not(.landing):not(.auth) .sa-page-header .page-heading-icon{
  background:rgba(255,255,255,.15) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.24) !important;
  box-shadow:none !important;
}
body:not(.landing):not(.auth) .workspace-topbar .page-back-icon,
body:not(.landing):not(.auth) .ff-client-head .page-back-icon,
body:not(.landing):not(.auth) .ff-topbar .page-back-icon,
body:not(.landing):not(.auth) .sa-page-header .page-back-icon,
body:not(.landing):not(.auth) .ff-client-heading-back{
  background:rgba(255,255,255,.14) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.24) !important;
  box-shadow:none !important;
  border-radius:999px !important;
}
body:not(.landing):not(.auth) .workspace-topbar .page-back-icon:hover,
body:not(.landing):not(.auth) .ff-client-head .page-back-icon:hover,
body:not(.landing):not(.auth) .ff-topbar .page-back-icon:hover,
body:not(.landing):not(.auth) .sa-page-header .page-back-icon:hover,
body:not(.landing):not(.auth) .ff-client-heading-back:hover{
  background:rgba(255,255,255,.23) !important;
  color:#fff !important;
}

/* Search bars and top-right controls on blue header surfaces. */
body:not(.landing):not(.auth) .workspace-topbar .ff-search,
body:not(.landing):not(.auth) .ff-client-head .ff-search,
body:not(.landing):not(.auth) .ff-topbar .ff-search,
body:not(.landing):not(.auth) .sa-page-header .sa-top-search,
body:not(.landing):not(.auth) .sa-page-header .ff-search{
  background:#fff !important;
  border:1px solid rgba(255,255,255,.65) !important;
  border-radius:999px !important;
  box-shadow:0 7px 18px rgba(35,77,145,.12) !important;
}
body:not(.landing):not(.auth) .workspace-topbar .ff-search .form-control,
body:not(.landing):not(.auth) .ff-client-head .ff-search .form-control,
body:not(.landing):not(.auth) .ff-topbar .ff-search .form-control,
body:not(.landing):not(.auth) .sa-page-header .sa-top-search .form-control,
body:not(.landing):not(.auth) .sa-page-header .ff-search .form-control{
  background:transparent !important;
  border:0 !important;
  min-height:38px !important;
  box-shadow:none !important;
  color:#40516a !important;
}
body:not(.landing):not(.auth) .workspace-topbar .ff-search i,
body:not(.landing):not(.auth) .ff-client-head .ff-search i,
body:not(.landing):not(.auth) .ff-topbar .ff-search i,
body:not(.landing):not(.auth) .sa-page-header .sa-top-search i,
body:not(.landing):not(.auth) .sa-page-header .ff-search i{color:var(--info-primary) !important;}
body:not(.landing):not(.auth) .workspace-topbar .ff-icon-btn,
body:not(.landing):not(.auth) .ff-client-head .ff-icon-btn,
body:not(.landing):not(.auth) .ff-topbar .ff-icon-btn,
body:not(.landing):not(.auth) .sa-page-header .ff-icon-btn,
body:not(.landing):not(.auth) .workspace-topbar .compact-profile-btn,
body:not(.landing):not(.auth) .ff-client-head .compact-profile-btn,
body:not(.landing):not(.auth) .ff-topbar .compact-profile-btn,
body:not(.landing):not(.auth) .sa-page-header .compact-profile-btn{
  background:#fff !important;
  color:var(--info-primary) !important;
  border:1px solid rgba(255,255,255,.72) !important;
  border-radius:999px !important;
  box-shadow:0 7px 18px rgba(35,77,145,.12) !important;
}
body:not(.landing):not(.auth) .workspace-topbar .ff-icon-btn:hover,
body:not(.landing):not(.auth) .ff-client-head .ff-icon-btn:hover,
body:not(.landing):not(.auth) .ff-topbar .ff-icon-btn:hover,
body:not(.landing):not(.auth) .sa-page-header .ff-icon-btn:hover,
body:not(.landing):not(.auth) .workspace-topbar .compact-profile-btn:hover,
body:not(.landing):not(.auth) .ff-client-head .compact-profile-btn:hover,
body:not(.landing):not(.auth) .ff-topbar .compact-profile-btn:hover,
body:not(.landing):not(.auth) .sa-page-header .compact-profile-btn:hover{
  background:#f4f8ff !important;
  color:var(--info-primary-dark) !important;
}

/* Broad visual treatment for every internal panel that is not a top header. */
body:not(.landing):not(.auth) .glass,
body:not(.landing):not(.auth) .ff-card,
body:not(.landing):not(.auth) .ff-client-summary-card,
body:not(.landing):not(.auth) .ff-metric,
body:not(.landing):not(.auth) .ff-balance,
body:not(.landing):not(.auth) .ff-activity-panel,
body:not(.landing):not(.auth) .ff-activity-remark-card,
body:not(.landing):not(.auth) .ff-profile-hero,
body:not(.landing):not(.auth) .ff-profile-form-card,
body:not(.landing):not(.auth) .profile-settings-card,
body:not(.landing):not(.auth) .sa-table-card,
body:not(.landing):not(.auth) .sa-profile-hero-card,
body:not(.landing):not(.auth) .sa-mini-stat-card,
body:not(.landing):not(.auth) .doc-card,
body:not(.landing):not(.auth) .settings-section-card,
body:not(.landing):not(.auth) .ticket-thread-card,
body:not(.landing):not(.auth) .ticket-side-card,
body:not(.landing):not(.auth) .preview-card,
body:not(.landing):not(.auth) .notification-delete-card{
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:22px !important;
  box-shadow:0 11px 26px rgba(61,118,199,.075) !important;
  backdrop-filter:none !important;
}

/* Client cards and summary cards. */
.ff-client-grid{gap:18px !important;}
.ff-client-card{
  position:relative !important;
  overflow:hidden !important;
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:22px !important;
  box-shadow:0 10px 24px rgba(61,118,199,.07) !important;
}
.ff-client-card::before,
.ff-client-summary-card::before,
.sa-profile-hero-card::before,
.doc-card::before,
.settings-section-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,var(--info-primary) 0 78%,var(--info-secondary) 78% 100%);
}
.ff-client-card:hover{
  border-color:#bfd5f7 !important;
  box-shadow:0 17px 34px rgba(61,118,199,.12) !important;
  transform:translateY(-3px) !important;
}
.ff-client-avatar,
.ff-client-summary-avatar,
.sa-profile-avatar,
.ff-profile-hero-avatar{
  background:linear-gradient(135deg,#4d88e5,#68a4f5) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:0 10px 22px rgba(61,118,199,.18) !important;
}
.ff-client-name,
.ff-client-summary-title,
.sa-profile-hero-name,
.ff-profile-hero-name,
.ff-person-name,
.doc-row-name{
  color:#213650 !important;
  font-weight:600 !important;
}
.ff-client-email,
.ff-client-summary-subtitle,
.sa-profile-hero-email,
.ff-profile-hero-email,
.ff-person-email,
.doc-row-sub{
  color:#6a7c95 !important;
}
.ff-client-state,
.ff-client-info-chip,
.ff-profile-hero-tag,
.sa-profile-chip,
.doc-code-pill,
.ff-project-code-chip{
  background:#eef5ff !important;
  color:var(--info-primary-dark) !important;
  border:1px solid #d8e6fb !important;
  border-radius:999px !important;
  font-weight:600 !important;
}
.ff-client-count,
.doc-count-pill,
.ff-panel-count,
.ff-tab-count{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
  border:1px solid #d8e6fb !important;
  border-radius:999px !important;
}

/* Metric / overview cards. */
.ff-metric,
.sa-overview-card,
.sa-mini-stat-card{
  position:relative !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%) !important;
  border:1px solid var(--info-border) !important;
  border-radius:22px !important;
  box-shadow:0 10px 24px rgba(61,118,199,.07) !important;
}
.ff-metric::after,
.sa-overview-card::after,
.sa-mini-stat-card::after{
  content:"" !important;
  position:absolute !important;
  right:-34px !important;
  bottom:-42px !important;
  width:95px !important;
  height:95px !important;
  border-radius:50% !important;
  background:rgba(81,143,238,.055) !important;
  pointer-events:none !important;
}
.ff-metric-icon,
.sa-overview-icon,
.sa-mini-stat-icon{
  background:linear-gradient(135deg,#eef5ff,#dceafe) !important;
  color:var(--info-primary) !important;
  border:1px solid #d4e4fb !important;
  border-radius:14px !important;
}
.ff-metric-icon.green,
.ff-metric-icon.orange,
.sa-mini-stat-card--share .sa-mini-stat-icon,
.sa-mini-stat-card--download .sa-mini-stat-icon,
.sa-mini-stat-card--send .sa-mini-stat-icon,
.sa-mini-stat-card--people .sa-mini-stat-icon{
  background:linear-gradient(135deg,#eef5ff,#dceafe) !important;
  color:var(--info-primary) !important;
  border-color:#d4e4fb !important;
}
.ff-metric-value,
.sa-overview-value,
.sa-mini-stat-value{color:#1f3450 !important;font-weight:600 !important;}
.ff-metric-label,
.sa-overview-label,
.sa-mini-stat-label{color:#657994 !important;font-weight:500 !important;}
.sa-overview-arrow{color:var(--info-primary) !important;}
.sa-overview-card:hover,
.sa-mini-stat-card:hover,
.ff-metric-link:hover{
  border-color:#bdd4f7 !important;
  box-shadow:0 17px 32px rgba(61,118,199,.11) !important;
}

/* Tables, toolbars, file/document lists. */
.ff-table-card,
.sa-table-card,
.doc-card{
  overflow:hidden !important;
}
.ff-table,
.ff-project-table,
.sa-table-card table,
.doc-list{
  background:#fff !important;
}
.ff-table thead th,
.ff-project-table thead th,
.sa-table-card thead th,
.doc-list-head{
  background:#f3f8ff !important;
  color:#59718e !important;
  border-color:#e3edf9 !important;
  font-weight:600 !important;
}
.ff-table tbody td,
.ff-project-table tbody td,
.sa-table-card tbody td,
.doc-row{
  border-color:#edf2fb !important;
}
.ff-table tbody tr:hover td,
.ff-project-table tbody tr:hover td,
.sa-table-card tbody tr:hover td,
.doc-row:hover{
  background:#fbfdff !important;
}
.ff-file-icon,
.doc-icon-bubble,
.trash-item-icon,
.ticket-thread-head-icon,
.notification-delete-icon{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
  border:1px solid #d9e7fb !important;
  border-radius:13px !important;
}
.ff-type-pill,
.ff-status,
.ticket-status,
.ticket-category-tag,
.doc-payment-pill,
.sa-role-badge{
  border-radius:999px !important;
  font-weight:600 !important;
}
.ff-type-pill{
  background:#eef5ff !important;
  color:var(--info-primary-dark) !important;
  border:1px solid #d8e6fb !important;
}
.ff-status.shared,
.ff-status.downloaded,
.ticket-status.is-resolved,
.ticket-status.resolved,
.badge.text-bg-success,
.doc-payment-pill.is-paid{
  background:#edf9f1 !important;
  color:#278653 !important;
  border:1px solid #ccebd8 !important;
}
.ff-status.pending,
.ticket-status.is-open,
.ticket-status.open,
.badge.text-bg-warning,
.doc-payment-pill.is-pending{
  background:#fff8e5 !important;
  color:#9a7100 !important;
  border:1px solid #f4df9b !important;
}
.ff-status.expired,
.ticket-status.is-closed,
.ticket-status.closed,
.badge.text-bg-danger{
  background:#fff1ef !important;
  color:#c75547 !important;
  border:1px solid #f0cec8 !important;
}
.sa-table-toolbar,
.sa-compact-filter-row,
.ff-files-actions,
.ff-clients-toolbar,
.doc-toolbar,
.trash-toolbar{
  background:#fff !important;
  border-color:#e5edf8 !important;
}
.sa-filter-chip,
.sa-icon-action-btn,
.ff-action-btn,
.doc-action-btn,
.preview-top-action{
  background:#fff !important;
  border:1px solid #dce8f8 !important;
  color:var(--info-primary) !important;
  border-radius:999px !important;
  box-shadow:none !important;
}
.sa-filter-chip:hover,
.sa-icon-action-btn:hover,
.ff-action-btn:hover,
.doc-action-btn:hover,
.preview-top-action:hover{
  background:#eef5ff !important;
  color:var(--info-primary-dark) !important;
  border-color:#bfd5f7 !important;
}
.ff-action-danger,
.sa-icon-action-btn.text-danger,
.doc-action-btn.text-danger{
  color:#d65b4a !important;
}
.ff-action-danger:hover,
.sa-icon-action-btn.text-danger:hover,
.doc-action-btn.text-danger:hover{
  background:#fff2ef !important;
  border-color:#f0cec8 !important;
}

/* Share / detail tabs mimic InfoClutch navigation pills. */
.ff-share-tabs,
.ff-detail-tabs,
.settings-subnav{
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:18px !important;
  box-shadow:0 8px 20px rgba(61,118,199,.06) !important;
}
.ff-share-tabs .nav-link,
.ff-detail-tabs .nav-link,
.settings-subnav-item{
  color:#637895 !important;
  border-radius:14px !important;
  font-weight:500 !important;
}
.ff-share-tabs .nav-link:hover,
.ff-detail-tabs .nav-link:hover,
.settings-subnav-item:hover{
  background:#f3f8ff !important;
  color:var(--info-primary) !important;
}
.ff-share-tabs .nav-link.active,
.ff-detail-tabs .nav-link.active,
.settings-subnav-item.active,
.settings-subnav-item.is-active{
  background:linear-gradient(135deg,#4b87e4,#5f9cf3) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 8px 18px rgba(61,118,199,.18) !important;
}
.ff-share-tabs .nav-link.active .ff-tab-count{
  background:rgba(255,255,255,.18) !important;
  border-color:rgba(255,255,255,.25) !important;
  color:#fff !important;
}

/* Project/activity detail pages. */
.ff-project-table-wrap,
.ff-activity-list,
.ff-balance{
  background:#fff !important;
  border-color:var(--info-border) !important;
}
.ff-balance-bar{background:#edf3fb !important;}
.ff-balance-bar .sent{background:var(--info-primary) !important;}
.ff-balance-bar .received{background:var(--info-secondary) !important;}
.ff-balance-counts .sent strong{color:var(--info-primary) !important;}
.ff-balance-counts .received strong{color:#b78600 !important;}
.ff-activity-panel-head,
.ticket-thread-head{
  background:#f9fbff !important;
  border-bottom:1px solid #e5edf8 !important;
}
.ff-activity-panel-title .bubble,
.ff-activity-panel-title .bubble.green{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
}
.ff-activity-item,
.ff-activity-columns{
  border-color:#edf2fb !important;
}
.ff-activity-item:hover{background:#fbfdff !important;}
.ff-remark-dropzone,
.ticket-dropzone,
.sa-doc-dropzone,
.share-upload-zone{
  background:#f8fbff !important;
  border:1.5px dashed #b8d1f5 !important;
  border-radius:18px !important;
}
.ff-remark-dropzone:hover,
.ticket-dropzone:hover,
.sa-doc-dropzone:hover,
.share-upload-zone:hover{
  background:#f1f7ff !important;
  border-color:#7eadef !important;
}
.ff-remark-dropzone-icon,
.ticket-dropzone-icon{
  color:var(--info-primary) !important;
  background:#eaf3ff !important;
}

/* Issue / ticket pages. */
.ticket-row:hover{background:#fbfdff !important;}
.ticket-subject-cell{color:#243952 !important;font-weight:600 !important;}
.ticket-category-tag{
  background:#eef5ff !important;
  color:var(--info-primary-dark) !important;
  border:1px solid #d8e6fb !important;
}
.ticket-detail-wrap{gap:20px !important;}
.ticket-thread-body{
  background:#f8fbff !important;
  border-color:#e5edf8 !important;
}
.ticket-msg-bubble{
  border-radius:18px !important;
  border:1px solid #e1eaf7 !important;
  background:#fff !important;
  color:#34465e !important;
  box-shadow:0 6px 16px rgba(61,118,199,.05) !important;
}
.ticket-msg.is-mine .ticket-msg-bubble{
  background:linear-gradient(135deg,#4f8ae7,#5d99f0) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.ticket-msg.is-mine .ticket-msg-bubble *{color:inherit !important;}
.ticket-composer{
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:22px !important;
}
.ticket-composer-input{
  background:#f8fbff !important;
  border-color:#dce8f8 !important;
}
.ticket-composer-send{
  background:linear-gradient(135deg,#1475cf,#518fee) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:999px !important;
}
.ticket-side-card-primary{
  background:linear-gradient(180deg,#fff,#f8fbff) !important;
}
.ticket-info-icon{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
}
.ticket-status-option:hover{background:#eef5ff !important;}

/* Settings and notifications. */
.settings-layout,
.profile-settings-row{gap:20px !important;}
.settings-section-card{
  position:relative !important;
  overflow:hidden !important;
}
.settings-section-icon{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
  border:1px solid #d8e6fb !important;
}
.settings-section-title,
.settings-subsection-title,
.client-notif-label{color:#233a55 !important;font-weight:600 !important;}
.settings-section-sub,
.settings-subsection-sub,
.client-notif-desc{color:#6a7c95 !important;}
.client-notif-list{
  background:#fff !important;
  border:1px solid #e1eaf7 !important;
  border-radius:18px !important;
  overflow:hidden !important;
}
.client-notif-head{
  background:#f3f8ff !important;
  color:#58718e !important;
  border-color:#e1eaf7 !important;
}
.client-notif-row{border-color:#edf2fb !important;}
.client-notif-row:hover{background:#fbfdff !important;}
.client-notif-switch:checked,
.form-check-input:checked{
  background-color:var(--info-primary) !important;
  border-color:var(--info-primary) !important;
}
.notification-row-main{
  border:1px solid #e1eaf7 !important;
  background:#fff !important;
  border-radius:18px !important;
  box-shadow:0 6px 16px rgba(61,118,199,.04) !important;
}
.notification-row-main:hover{background:#fbfdff !important;border-color:#cfe0f7 !important;}
.page-notification-icon{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
  border:1px solid #d8e6fb !important;
}
.notification-delete-btn{color:#cf5a4a !important;}
.notification-delete-btn:hover{background:#fff2ef !important;}

/* Preview / download / folder / search result pages. */
.preview-card,
.preview-scroll-area,
.preview-image-scroll,
.preview-text-scroll,
.preview-table-scroll,
.preview-list-scroll{
  background:#fff !important;
  border-color:var(--info-border) !important;
}
.preview-scroll-area,
.preview-image-scroll,
.preview-text-scroll,
.preview-table-scroll,
.preview-list-scroll{border-radius:18px !important;}
.preview-file-name{color:#24405e !important;font-weight:600 !important;}
.preview-pdf-frame{background:#f8fbff !important;}

/* Empty states get a very light InfoClutch-blue wash. */
.ticket-empty,
.dashboard-side-empty,
.ff-project-table-empty,
.doc-empty,
[data-filter-empty]{
  color:#70839b !important;
}
.doc-empty,
.ff-project-table-empty,
.ticket-empty{
  background:#f8fbff !important;
  border-color:#dfeafa !important;
  border-radius:18px !important;
}

/* Auth, signup, verification and public share-error cards. */
body.auth .app-shell{
  background:
    radial-gradient(circle at 12% 18%,rgba(81,143,238,.12) 0 92px,transparent 93px),
    radial-gradient(circle at 92% 88%,rgba(238,179,8,.09) 0 110px,transparent 111px),
    linear-gradient(180deg,#edf5ff 0%,#f8fbff 48%,#fff 100%) !important;
}
body.auth .card.glass,
body.auth .auth-signup-card,
body.auth .row.justify-content-center > [class*="col-"] > .card,
body.auth .row.justify-content-center.align-items-center > [class*="col-"] > .card{
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:28px !important;
  box-shadow:0 22px 46px rgba(61,118,199,.12) !important;
}
body.auth .auth-signup-card h1,
body.auth .auth-signup-card h2,
body.auth .card.glass h1,
body.auth .card.glass h2{color:#203650 !important;font-weight:600 !important;}
body.auth .form-label{color:#496078 !important;font-weight:500 !important;}
body.auth .td-login-brand-mark--combined{
  height:52px !important;
}
body.auth .td-login-brand-mark--combined img{max-width:210px !important;}
body.auth .td-password-toggle,
body.auth .td-back-login{color:var(--info-primary) !important;}
body.auth .td-auth-message{
  border-radius:15px !important;
  border-color:#d8e6fb !important;
  background:#f5f9ff !important;
}

/* Landing page: mimic the InfoClutch blue/white marketing site without
   changing the existing sections or card count. */
body.landing{
  background:#fff !important;
}
body.landing .app-shell{padding-top:76px !important;}
body.landing .sg-section--no-top-gap{
  position:relative;
  overflow:hidden;
  padding-top:72px !important;
  padding-bottom:72px !important;
  background:
    radial-gradient(circle at 15% 28%,rgba(255,255,255,.12) 0 10px,transparent 11px),
    radial-gradient(circle at 84% 18%,rgba(255,255,255,.10) 0 14px,transparent 15px),
    linear-gradient(135deg,#4a86e3 0%,#5d99f0 100%) !important;
}
body.landing .ready-card{
  position:relative;
  background:#fff !important;
  border:0 !important;
  border-radius:28px !important;
  box-shadow:0 20px 46px rgba(31,78,152,.22) !important;
}
body.landing .ready-card::before{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:0;
  width:92px;
  height:5px;
  border-radius:0 0 999px 999px;
  background:var(--info-secondary);
}
body.landing .sg-h2{color:#1f3450 !important;font-weight:600 !important;}
body.landing .sg-section--no-top-gap .sg-label{color:var(--info-primary) !important;}
body.landing .sg-section--no-top-gap .text-muted{color:#657994 !important;}
body.landing #features{
  background:#fff !important;
  padding-top:78px !important;
}
body.landing #features > .container > .text-center .sg-label{color:var(--info-primary) !important;}
body.landing .sg-card{
  position:relative;
  overflow:hidden;
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:24px !important;
  box-shadow:0 12px 28px rgba(61,118,199,.08) !important;
}
body.landing .sg-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,var(--info-primary),#73aafb 80%,var(--info-secondary) 80%);
}
body.landing .sg-card:hover{
  transform:translateY(-5px) !important;
  border-color:#bfd5f7 !important;
  box-shadow:0 18px 38px rgba(61,118,199,.13) !important;
}
body.landing .sg-card .sg-ic{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
  border:1px solid #d8e6fb !important;
}
body.landing .sg-card h3{color:#233a55 !important;font-weight:600 !important;}
body.landing .sg-card p{color:#657994 !important;}
body.landing .btn-outline-dark{
  color:var(--info-primary) !important;
  background:#fff !important;
  border-color:#bdd4f7 !important;
  border-radius:999px !important;
}
body.landing .btn-outline-dark:hover{background:#eef5ff !important;color:var(--info-primary-dark) !important;}
body.landing .btn-primary{border-radius:999px !important;}

/* Legal/contact pages use a marketing-style blue hero and crisp white cards. */
body.td-footer-page{
  background:linear-gradient(180deg,#eef6ff 0%,#f8fbff 38%,#fff 100%) !important;
}
.td-legal-page{max-width:1180px !important;}
.td-page-back{
  background:#fff !important;
  color:var(--info-primary) !important;
  border:1px solid #d8e6fb !important;
  box-shadow:0 8px 20px rgba(61,118,199,.09) !important;
}
.td-legal-hero{
  position:relative !important;
  overflow:hidden !important;
  background:linear-gradient(135deg,#4a86e3,#5d99f0) !important;
  border:0 !important;
  border-radius:28px !important;
  box-shadow:0 16px 36px rgba(61,118,199,.16) !important;
  color:#fff !important;
}
.td-legal-hero::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  border-radius:50%;
  right:-54px;
  top:-76px;
  background:rgba(255,255,255,.13);
}
.td-legal-hero h1{color:#fff !important;font-weight:600 !important;}
.td-legal-hero p{color:rgba(255,255,255,.84) !important;}
.td-legal-kicker{color:#fff2ba !important;font-weight:600 !important;letter-spacing:.15em !important;}
.td-legal-nav,
.td-legal-content,
.td-contact-card{
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:22px !important;
  box-shadow:0 10px 25px rgba(61,118,199,.07) !important;
}
.td-legal-nav a:hover{background:#eef5ff !important;color:var(--info-primary) !important;}
.td-legal-content h2,
.td-contact-card h2{color:#233a55 !important;font-weight:600 !important;}
.td-contact-icon{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
  border:1px solid #d8e6fb !important;
}
.td-contact-card::before{background:linear-gradient(90deg,var(--info-primary),var(--info-secondary)) !important;}
.td-contact-card a{color:var(--info-primary) !important;}
.td-contact-card a:hover{color:var(--info-primary-dark) !important;}

/* Modal dialogs and dropdown menus should look like the website contact form. */
.modal-content{
  background:#fff !important;
  border:1px solid #d8e6fb !important;
  border-radius:24px !important;
  box-shadow:0 24px 55px rgba(31,78,152,.20) !important;
}
.modal-header{
  background:#f7faff !important;
  border-bottom:1px solid #e3edf9 !important;
  border-radius:24px 24px 0 0 !important;
}
.modal-footer{
  background:#fbfdff !important;
  border-top:1px solid #e3edf9 !important;
  border-radius:0 0 24px 24px !important;
}
.share-modal-title-icon{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
  border:1px solid #d8e6fb !important;
}
.dropdown-menu{
  background:#fff !important;
  border:1px solid #dce8f8 !important;
  border-radius:18px !important;
  box-shadow:0 16px 34px rgba(61,118,199,.14) !important;
}
.dropdown-item{border-radius:12px !important;color:#4f647d !important;}
.dropdown-item:hover,
.dropdown-item:focus{background:#eef5ff !important;color:var(--info-primary-dark) !important;}

/* Footer is quieter like InfoClutch lower sections. */
.dashboard-footer,
.footer{
  background:rgba(255,255,255,.72) !important;
  border-top:1px solid rgba(81,143,238,.15) !important;
  backdrop-filter:none !important;
}
.dashboard-footer-brand,
.footer{color:#5f7390 !important;}
.dashboard-footer-links a,
.footer a{color:#405b79 !important;font-weight:500 !important;}
.dashboard-footer-links a:hover,
.footer a:hover{color:var(--info-primary) !important;}

/* Consistent thin blue scrollbars inside tables/panels. */
body *{scrollbar-color:#9fc1f3 #eef5ff;scrollbar-width:thin;}
body *::-webkit-scrollbar{width:7px;height:7px;}
body *::-webkit-scrollbar-track{background:#eef5ff;border-radius:999px;}
body *::-webkit-scrollbar-thumb{background:#9fc1f3;border-radius:999px;}
body *::-webkit-scrollbar-thumb:hover{background:#7faeec;}

/* Responsive polish. */
@media (max-width:1199.98px){
  .dash-sidebar{width:238px !important;}
}
@media (max-width:991.98px){
  body:not(.landing):not(.auth) .workspace-topbar,
  body:not(.landing):not(.auth) .ff-client-head,
  body:not(.landing):not(.auth) .ff-topbar,
  body:not(.landing):not(.auth) .sa-page-header{
    border-radius:21px !important;
    padding:16px 17px !important;
  }
  .dash-offcanvas .offcanvas-header{border-bottom:1px solid rgba(255,255,255,.17) !important;}
  .dash-offcanvas .btn-close{filter:brightness(0) invert(1);}
  .td-contact-card-grid{grid-template-columns:1fr !important;}
}
@media (max-width:767.98px){
  body:not(.landing):not(.auth) .workspace-topbar,
  body:not(.landing):not(.auth) .ff-client-head,
  body:not(.landing):not(.auth) .ff-topbar,
  body:not(.landing):not(.auth) .sa-page-header{
    border-radius:18px !important;
  }
  body:not(.landing):not(.auth) .workspace-topbar::after,
  body:not(.landing):not(.auth) .ff-client-head::after,
  body:not(.landing):not(.auth) .ff-topbar::after,
  body:not(.landing):not(.auth) .sa-page-header::after{left:17px !important;width:58px !important;}
  .ff-client-card,
  .ff-card,
  .sa-table-card,
  .doc-card,
  .ticket-side-card,
  .ticket-thread-card{border-radius:18px !important;}
}

/* ======================================================================
   INFOCLUTCH COMPACT REFINEMENT PASS
   User-requested fixes: smaller branding, exact o/C favicon asset, no orange
   hover feedback, flatter one-action toolbars, clearer account dropdown,
   compact notifications, stacked issue categories and tighter spacing.
   ====================================================================== */

/* Brand scale: keep the wordmark present but much less dominant. */
.sg-brandmark.sg-brandmark--wide{
  height:34px !important;
}
.sg-brandmark.sg-brandmark--wide img{
  max-width:148px !important;
}
.dash-sidebar .dash-logo.dash-logo--combined,
.dash-offcanvas .dash-logo.dash-logo--combined{
  height:40px !important;
}
.dash-sidebar .dash-logo.dash-logo--combined img,
.dash-offcanvas .dash-logo.dash-logo--combined img{
  max-width:148px !important;
}
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  height:34px !important;
}
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined img{
  max-width:72px !important;
}

/* Login branding: smaller logo with the tagline directly underneath. */
body.auth .td-login-brand{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:3px !important;
  margin-bottom:16px !important;
}
body.auth .td-login-brand-mark--combined{
  height:36px !important;
}
body.auth .td-login-brand-mark--combined img{
  max-width:148px !important;
}
body.auth .td-login-brand-copy--tagline-only{
  display:block !important;
  margin:0 !important;
  line-height:1.2 !important;
}
body.auth .td-login-brand-copy--tagline-only small{
  display:block !important;
  margin:1px 0 0 !important;
  color:#718096 !important;
  font-size:.72rem !important;
  font-weight:500 !important;
}
body.auth .td-forgot-link{
  color:#6b7d95 !important;
  text-decoration:none !important;
}
body.auth .td-forgot-link:hover,
body.auth .td-forgot-link:focus{
  color:var(--info-primary) !important;
  text-decoration:underline !important;
  text-underline-offset:3px;
}
body.auth .td-form-group .form-control:focus{
  border-color:#8ab5f4 !important;
  box-shadow:0 0 0 3px rgba(81,143,238,.12) !important;
}

/* Sidebar collapse toggle must always sit at the physical center of the rail. */
.dash-sidebar .sidebar-toggle,
.dash-sidebar.is-collapsed .sidebar-toggle{
  position:absolute !important;
  top:50% !important;
  right:-14px !important;
  left:auto !important;
  bottom:auto !important;
  transform:translateY(-50%) !important;
  margin:0 !important;
  width:28px !important;
  height:28px !important;
  z-index:80 !important;
}

/* No orange/coral hover feedback. Interactive hover is blue/soft-blue only. */
body a:hover,
body a:focus-visible{
  color:var(--info-primary-dark) !important;
}
body .btn:not(.btn-danger):not(.btn-outline-danger):hover,
body .btn:not(.btn-danger):not(.btn-outline-danger):focus-visible,
body .ff-primary-btn:hover,
body .ff-primary-btn:focus-visible,
body .ff-secondary-btn:hover,
body .ff-secondary-btn:focus-visible,
body .ff-action-btn:hover,
body .sa-action-view:hover,
body .dashboard-view-all:hover,
body .dashboard-recent-action:hover,
body .dashboard-client-action:hover,
body .recent-action-btn:hover,
body .page-back-icon:hover,
body .ff-client-view:hover,
body .ff-panel-share-btn:hover{
  border-color:#bfd5f7 !important;
  background:#eef5ff !important;
  color:var(--info-primary-dark) !important;
  box-shadow:none !important;
}
body .btn-primary:hover,
body .btn-primary:focus-visible,
body .ff-primary-btn:hover,
body .ff-primary-btn:focus-visible{
  background:#467fce !important;
  border-color:#467fce !important;
  color:#fff !important;
}
.ff-client-card:hover,
.action-card:hover,
.sa-overview-card:hover,
.doc-card:hover,
.settings-section-card:hover{
  border-color:#bfd5f7 !important;
  box-shadow:0 12px 26px rgba(61,118,199,.10) !important;
}
.ff-client-card:hover::before,
.sa-overview-card:hover::before,
.doc-card:hover::before,
.settings-section-card:hover::before,
.td-contact-card:hover::before{
  background:var(--info-primary) !important;
}

/* Flatter one-action/count toolbars: no extra white row/card behind them. */
.ff-clients-toolbar,
.trash-toolbar{
  min-height:0 !important;
  padding:0 !important;
  margin:0 0 10px !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.ff-clients-toolbar .ff-client-count{
  color:#62748b !important;
  font-size:.78rem !important;
  font-weight:600 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
}
.ff-clients-toolbar .ff-primary-btn,
.trash-toolbar .btn{
  min-height:36px !important;
  padding:7px 13px !important;
  border-radius:999px !important;
}

/* Profile dropdown: explicit, visible Account block and tighter menu. */
.compact-profile-dropdown{
  min-width:176px !important;
  width:176px !important;
  padding:5px !important;
  border-radius:14px !important;
}
.compact-profile-account{
  padding:8px 9px 7px !important;
  color:#334a64 !important;
  background:#f7faff !important;
  border:1px solid #e4edf9 !important;
  border-radius:10px !important;
}
.compact-profile-account-title{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  color:#29425e !important;
  font-size:.79rem !important;
  font-weight:600 !important;
  line-height:1.2 !important;
}
.compact-profile-account-title i{color:var(--info-primary) !important;}
.compact-profile-role,
.compact-profile-as{
  display:block !important;
  margin-top:3px !important;
  color:#718096 !important;
  font-size:.68rem !important;
  font-weight:500 !important;
  line-height:1.25 !important;
  white-space:normal !important;
}
.compact-profile-dropdown .dropdown-divider{margin:5px 2px !important;border-color:#e7edf7 !important;}
.compact-profile-dropdown .dropdown-item{
  min-height:31px !important;
  padding:6px 8px !important;
  font-size:.76rem !important;
}

/* Notification drawer: compact rows, all event accents blue, no card-within-card look. */
.notification-panel{
  width:min(390px,100vw) !important;
  border-left:1px solid #dce8f8 !important;
  box-shadow:-12px 0 34px rgba(61,118,199,.13) !important;
}
.notification-panel-head{
  min-height:54px !important;
  padding:0 14px 0 16px !important;
}
.notification-panel-title{font-size:.94rem !important;color:#2b425d !important;}
.notification-panel-tabs{
  min-height:36px !important;
  gap:13px !important;
  padding:0 16px !important;
}
.notification-panel-tab{font-size:.72rem !important;}
.notification-panel-tab::after{background:var(--info-primary) !important;}
.notification-panel-tab.is-active{color:var(--info-primary) !important;}
.notification-panel-item{
  gap:9px !important;
  padding:9px 12px 9px 16px !important;
  background:#fff !important;
  border-bottom:1px solid #edf2fa !important;
}
.notification-panel-item:hover{background:#f8fbff !important;}
.notification-panel-item.is-unread{background:#f5f9ff !important;}
.notification-panel-item.is-unread::before{background:var(--info-primary) !important;}
.notification-item-icon,
.notification-item-icon.is-invite,
.notification-item-icon.is-download,
.notification-item-icon.is-info,
.page-notification-icon,
.page-notification-icon.is-download,
.page-notification-icon.is-share,
.page-notification-icon.is-file{
  width:32px !important;
  height:32px !important;
  flex-basis:32px !important;
  border-radius:9px !important;
  background:#eef5ff !important;
  color:var(--info-primary) !important;
  border:1px solid #d8e6fb !important;
  box-shadow:none !important;
}
.notification-trigger-badge{
  background:var(--info-primary) !important;
  box-shadow:0 4px 10px rgba(61,118,199,.24) !important;
}
.notification-item-title{font-size:.75rem !important;}
.notification-item-message{font-size:.70rem !important;}
.notification-item-time{font-size:.64rem !important;}
.notification-mark-read:hover,
.notification-panel-close:hover{background:#eef5ff !important;color:var(--info-primary-dark) !important;}
.notification-panel-status{background:#f5f9ff !important;color:#4b6482 !important;}

/* Full notifications page: one simple compact shell, not an oversized nested card. */
.notification-list-shell{
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  background:#fff !important;
  border:1px solid var(--info-border) !important;
  border-radius:16px !important;
  box-shadow:0 7px 18px rgba(61,118,199,.05) !important;
  overflow:hidden !important;
}
.notification-list-shell > .border-bottom,
.notification-list-shell > .border-top{
  padding:9px 13px !important;
  border-color:#e8eff8 !important;
}
.notification-row{
  padding:9px 13px !important;
  background:#fff !important;
  border-left:0 !important;
  border-color:#edf2fa !important;
}
.notification-row:hover{background:#f8fbff !important;}
.notification-row.notification-unread{
  background:#f5f9ff !important;
  border-left:3px solid var(--info-primary) !important;
}
.notification-row.notification-unread:hover{background:#eef5ff !important;}
.notification-delete-btn:hover{background:#f3f7fc !important;color:#64748b !important;}

/* Issues: categories are a dedicated column and every category gets its own row. */
.ticket-category-cell{min-width:120px !important;vertical-align:top !important;}
.ticket-category-stack{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:4px !important;
}
.ticket-category-stack .ticket-category-tag{
  display:inline-flex !important;
  margin:0 !important;
  max-width:180px !important;
  line-height:1.2 !important;
  white-space:normal !important;
}

/* Compact the whole workspace without changing logic or content structure. */
body:not(.landing):not(.auth) .dash-main{
  padding:16px 18px 0 !important;
}
body:not(.landing):not(.auth) .dash-content{min-width:0 !important;}
.ff-shell{
  padding:0 0 18px !important;
}
body:not(.landing):not(.auth) .workspace-topbar,
body:not(.landing):not(.auth) .ff-client-head,
body:not(.landing):not(.auth) .ff-topbar,
body:not(.landing):not(.auth) .sa-page-header{
  margin-bottom:13px !important;
  padding:13px 17px !important;
  border-radius:20px !important;
}
body:not(.landing):not(.auth) .workspace-topbar::after,
body:not(.landing):not(.auth) .ff-client-head::after,
body:not(.landing):not(.auth) .ff-topbar::after,
body:not(.landing):not(.auth) .sa-page-header::after{
  left:17px !important;
  width:60px !important;
  height:4px !important;
}
.page-heading-row{gap:8px !important;}
.page-heading-icon{
  width:34px !important;
  height:34px !important;
  flex:0 0 34px !important;
  border-radius:10px !important;
}
.page-heading-subtitle{margin-top:2px !important;font-size:.74rem !important;}
.ff-top-actions,
.sa-top-actions,
.page-header-actions{gap:7px !important;}
.ff-search{min-height:36px !important;}
.ff-search .form-control{min-height:34px !important;font-size:.76rem !important;}
.ff-icon-btn,
.compact-profile-btn{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
}
.ff-card,
.sa-table-card,
.glass,
.doc-card,
.settings-section-card,
.ticket-side-card,
.ticket-thread-card{
  border-radius:16px !important;
}
.ff-client-grid{gap:12px !important;}
.ff-client-card{border-radius:16px !important;}
.dash-stats-compact{margin-bottom:13px !important;}
body.dashboard-view .dash-stats-compact .action-card,
body.dashboard-view .stat-card.action-card{
  min-height:122px !important;
  border-radius:16px !important;
}
body .table > :not(caption) > * > *{
  padding:9px 11px !important;
}
body .table thead th{font-size:.69rem !important;}
body .table tbody td{font-size:.76rem !important;}
.settings-layout,
.profile-settings-row{gap:13px !important;}
.modal-header,
.modal-footer{padding:11px 14px !important;}
.modal-body{padding:14px !important;}
.dashboard-footer{
  margin-top:18px !important;
  padding:11px 0 !important;
  font-size:.74rem !important;
}

@media (max-width:991.98px){
  body:not(.landing):not(.auth) .dash-main{padding:12px 12px 0 !important;}
  body:not(.landing):not(.auth) .workspace-topbar,
  body:not(.landing):not(.auth) .ff-client-head,
  body:not(.landing):not(.auth) .ff-topbar,
  body:not(.landing):not(.auth) .sa-page-header{padding:12px 14px !important;border-radius:17px !important;}
}
@media (max-width:575.98px){
  body:not(.landing):not(.auth) .dash-main{padding:10px 10px 0 !important;}
  .ff-clients-toolbar{align-items:center !important;flex-direction:row !important;}
  .notification-panel{width:100vw !important;}
}


/* ======================================================================
   INFOCLUTCH REFINEMENT V5
   Notification accents, compact account menu, collapsed favicon,
   full-width settings, legal/contact cleanup, table typography and
   blue confirmation treatment.
   ====================================================================== */

/* Notification empty-state icons are always InfoClutch blue, never legacy teal. */
.notification-panel-empty i,
.notification-panel-empty .bi,
.notification-list-shell .page-notification-icon,
.notification-delete-icon,
.notification-confirm-icon{
  color:var(--info-primary) !important;
}
.notification-panel-empty i{
  opacity:.72 !important;
}
.notification-item-icon,
.notification-item-icon.is-invite,
.notification-item-icon.is-download,
.notification-item-icon.is-info,
.page-notification-icon,
.page-notification-icon.is-download,
.page-notification-icon.is-share,
.page-notification-icon.is-file{
  background:#eef5ff !important;
  border-color:#d8e6fb !important;
  color:var(--info-primary) !important;
}

/* Unread-count badge intentionally uses the secondary InfoClutch yellow so it
   is immediately distinct from the blue bell/profile controls. */
.notification-trigger-badge,
.notif-badge,
#notifBadge{
  background:var(--info-secondary) !important;
  color:#3d3515 !important;
  border-color:#fff !important;
  box-shadow:0 4px 10px rgba(238,179,8,.28) !important;
  font-weight:700 !important;
}

/* One-line account label in the profile dropdown. */
.compact-profile-account{
  padding:8px 9px !important;
}
.compact-profile-account-title{
  white-space:nowrap !important;
  font-size:.75rem !important;
  line-height:1.2 !important;
}
.compact-profile-role,
.compact-profile-as{
  display:none !important;
}

/* Collapsed desktop sidebar: use the InfoClutch o/C favicon instead of the
   full wordmark. The 28px collapse control straddles the rail edge exactly. */
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  width:36px !important;
  min-width:36px !important;
  height:36px !important;
  flex:0 0 36px !important;
  background:url('../img/favicon.svg') center/30px 30px no-repeat !important;
  border:0 !important;
  border-radius:10px !important;
}
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined img{
  opacity:0 !important;
  width:36px !important;
  height:36px !important;
  max-width:36px !important;
}
.dash-sidebar .sidebar-toggle,
.dash-sidebar.is-collapsed .sidebar-toggle{
  top:50% !important;
  right:-14px !important;
  left:auto !important;
  transform:translateY(-50%) !important;
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  min-height:28px !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  line-height:1 !important;
}
.dash-sidebar .sidebar-toggle i,
.dash-sidebar.is-collapsed .sidebar-toggle i{
  display:block !important;
  margin:0 !important;
  line-height:1 !important;
  transform:none !important;
}

/* Settings content should use the available workspace width. */
.super-admin-page .settings-shell{
  width:100% !important;
  max-width:none !important;
  gap:14px !important;
}
.super-admin-page .settings-layout{
  width:100% !important;
  max-width:none !important;
  flex:1 1 0 !important;
}
.super-admin-page .settings-section-card,
#clientNotifSettingsCard,
.subuser-card{
  width:100% !important;
  max-width:none !important;
}
.super-admin-page .settings-subnav{
  flex-basis:170px !important;
}

/* Super Admin client-detail section titles and table contents: consistent
   hierarchy, spacing, casing and alignment. */
.super-admin-page .card.glass{
  padding:14px 16px !important;
  border-radius:18px !important;
}
.super-admin-page .card.glass > h2.h6,
.super-admin-page .card.glass > .d-flex h2.h6{
  margin:0 0 4px !important;
  color:#203a58 !important;
  font-size:.92rem !important;
  font-weight:600 !important;
  line-height:1.3 !important;
  letter-spacing:-.01em !important;
  text-transform:none !important;
}
.super-admin-page .card.glass > .d-flex{
  margin-bottom:10px !important;
}
.super-admin-page .card.glass > .d-flex .small.text-muted{
  margin-top:1px !important;
  font-size:.70rem !important;
  line-height:1.45 !important;
  color:#70819a !important;
}
.super-admin-page .card.glass .table{
  width:100% !important;
  table-layout:auto !important;
  font-size:.75rem !important;
  line-height:1.35 !important;
}
.super-admin-page .card.glass .table thead th{
  padding:8px 10px !important;
  color:#536b89 !important;
  font-size:.64rem !important;
  font-weight:600 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  vertical-align:middle !important;
}
.super-admin-page .card.glass .table tbody td{
  padding:9px 10px !important;
  vertical-align:middle !important;
  color:#2d4058 !important;
}
.super-admin-page .card.glass .table tbody td.fw-semibold,
.super-admin-page .card.glass .table .sa-file-link{
  color:#203a58 !important;
  font-weight:600 !important;
}
.super-admin-page .card.glass .table .badge{
  white-space:nowrap !important;
  font-size:.63rem !important;
  font-weight:600 !important;
  padding:5px 8px !important;
}

/* Apply the same clean title/table rhythm across non-super-admin cards too. */
body:not(.landing):not(.auth) .card.glass > h2,
body:not(.landing):not(.auth) .ff-activity-panel-title,
body:not(.landing):not(.auth) .dashboard-reference-head h2{
  color:#203a58 !important;
  font-weight:600 !important;
}
body:not(.landing):not(.auth) .table thead th{
  vertical-align:middle !important;
}
body:not(.landing):not(.auth) .table tbody td{
  vertical-align:middle !important;
}

/* Legal/privacy/contact pages follow the same compact InfoClutch visual system. */
body.td-footer-page .td-legal-page{
  width:100% !important;
  max-width:1240px !important;
  padding:14px 18px 24px !important;
}
body.td-footer-page .td-legal-hero{
  padding:18px 20px !important;
  margin-bottom:14px !important;
  border-radius:18px !important;
  background:linear-gradient(135deg,#4f89e4 0%,#5e9bf2 100%) !important;
  border:0 !important;
  box-shadow:0 10px 24px rgba(61,118,199,.12) !important;
}
body.td-footer-page .td-legal-hero h1{
  font-size:1.45rem !important;
  line-height:1.25 !important;
}
body.td-footer-page .td-legal-hero p{
  margin-top:4px !important;
  font-size:.78rem !important;
  line-height:1.5 !important;
}
body.td-footer-page .td-legal-grid{
  gap:14px !important;
}
body.td-footer-page .td-legal-nav,
body.td-footer-page .td-legal-content,
body.td-footer-page .td-contact-card{
  border-color:#dce8f8 !important;
  border-radius:16px !important;
  box-shadow:0 7px 18px rgba(61,118,199,.06) !important;
}
body.td-footer-page .td-legal-content section{
  padding:16px 0 !important;
}
body.td-footer-page .td-legal-content h2,
body.td-footer-page .td-contact-card h2{
  color:#203a58 !important;
  font-size:.92rem !important;
  font-weight:600 !important;
}
body.td-footer-page .td-legal-content p,
body.td-footer-page .td-contact-card p,
body.td-footer-page .td-contact-inline{
  color:#526a86 !important;
  font-size:.77rem !important;
  line-height:1.65 !important;
}
body.td-footer-page .td-contact-card-grid{
  gap:12px !important;
}
body.td-footer-page .td-contact-card{
  padding:16px !important;
}
body.td-footer-page .td-contact-help{
  display:none !important;
}

/* Logout confirmation is blue/InfoClutch, not destructive red. */
.logout-card{
  position:relative !important;
  overflow:hidden !important;
  border:1px solid #d8e6fb !important;
  border-radius:18px !important;
  box-shadow:0 18px 40px rgba(61,118,199,.16) !important;
}
.logout-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:linear-gradient(90deg,var(--info-primary),#72a9f5) !important;
}
.logout-card h6{
  color:#203a58 !important;
  font-weight:600 !important;
}
.logout-card .text-muted{
  color:#5f7188 !important;
}
.logout-card .logout-confirm-primary{
  background:var(--info-primary) !important;
  border-color:var(--info-primary) !important;
  color:#fff !important;
}
.logout-card .logout-confirm-primary:hover,
.logout-card .logout-confirm-primary:focus{
  background:var(--info-primary-dark) !important;
  border-color:var(--info-primary-dark) !important;
  color:#fff !important;
}
.logout-card .btn-outline-secondary{
  border-color:#bfd5f7 !important;
  color:var(--info-primary) !important;
  background:#fff !important;
}

/* Keep the final pass dense without crowding. */
body:not(.landing):not(.auth) .mb-4{margin-bottom:14px !important;}
body:not(.landing):not(.auth) .mb-3{margin-bottom:10px !important;}
body:not(.landing):not(.auth) .g-4{--bs-gutter-x:14px;--bs-gutter-y:14px;}
body:not(.landing):not(.auth) .g-3{--bs-gutter-x:12px;--bs-gutter-y:12px;}

/* Profile menu actions stay neutral/blue; only confirmation dialogs carry action emphasis. */
.compact-profile-dropdown .dropdown-item.text-danger{
  color:#526a86 !important;
}
.compact-profile-dropdown .dropdown-item.text-danger:hover,
.compact-profile-dropdown .dropdown-item.text-danger:focus{
  color:var(--info-primary-dark) !important;
  background:#eef5ff !important;
}
.notification-mark-read{
  color:#54708f !important;
}
.notification-mark-read i{
  color:var(--info-primary) !important;
}


/* ======================================================================
   INFOCLUTCH REFINEMENT V6
   Active-state contrast, exact heading alignment, client-detail table
   rhythm, footer rebrand, compact sidebar and blue-only interactions.
   ====================================================================== */

/* Settings: active icon follows the active white label. */
.settings-subnav-item.is-active,
.settings-subnav-item.active{
  color:#fff !important;
}
.settings-subnav-item.is-active i,
.settings-subnav-item.active i,
.settings-subnav-item.is-active span,
.settings-subnav-item.active span{
  color:#fff !important;
  opacity:1 !important;
}

/* Super Admin detail tabs: when a tab is blue, every child stays white. */
.super-admin-page .nav.nav-pills .nav-link.active,
.super-admin-page .nav.nav-pills .nav-link.active:hover,
.super-admin-page .nav.nav-pills .nav-link.active:focus{
  background:linear-gradient(135deg,#4b87e4,#5f9cf3) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 7px 16px rgba(61,118,199,.17) !important;
}
.super-admin-page .nav.nav-pills .nav-link.active *,
.super-admin-page .nav.nav-pills .nav-link.active i,
.super-admin-page .nav.nav-pills .nav-link.active span{
  color:#fff !important;
  opacity:1 !important;
}
.super-admin-page .nav.nav-pills .nav-link:not(.active):hover{
  background:#eef5ff !important;
  color:var(--info-primary-dark) !important;
}

/* Profile dropdown: a little wider without becoming a large card. */
.compact-profile-dropdown{
  min-width:210px !important;
  width:210px !important;
}
.compact-profile-account-title{
  justify-content:flex-start !important;
  white-space:nowrap !important;
}

/* All standard page subtitles start exactly where the title text starts.
   :has() limits the offset to headings that actually contain the icon/back
   controls, while nested detail headings already align themselves. */
.page-section-header:has(> .page-heading-row > .page-heading-icon):not(.page-section-header--with-back) > .page-heading-subtitle{
  margin-left:42px !important; /* 34px icon + 8px row gap */
  padding-left:0 !important;
}
.page-section-header--with-back:has(> .page-heading-row > .page-back-icon):has(> .page-heading-row > .page-heading-icon) > .page-heading-subtitle{
  margin-left:80px !important; /* 30px back + 8 + 34px icon + 8 */
  padding-left:0 !important;
}
.sa-detail-heading-copy > .page-heading-subtitle,
.ticket-detail-heading-copy > .page-heading-subtitle{
  margin-left:0 !important;
  padding-left:0 !important;
}

/* Client detail: both table cards use one alignment system. */
.super-admin-page .sa-client-detail-table-card{
  padding:0 !important;
  overflow:hidden !important;
  border-radius:18px !important;
}
.super-admin-page .sa-client-detail-card-head{
  min-height:58px !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  margin:0 !important;
  padding:13px 16px 10px !important;
  border-bottom:0 !important;
}
.super-admin-page .sa-client-detail-card-head--single{
  min-height:50px !important;
  align-items:center !important;
}
.super-admin-page .sa-client-detail-heading{
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
}
.super-admin-page .sa-client-detail-title-row{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  min-height:24px !important;
}
.super-admin-page .sa-client-detail-title-row > i{
  width:18px !important;
  min-width:18px !important;
  display:inline-grid !important;
  place-items:center !important;
  color:var(--info-primary) !important;
  font-size:.88rem !important;
  line-height:1 !important;
}
.super-admin-page .sa-client-detail-title-row > h2{
  margin:0 !important;
  color:#203a58 !important;
  font-size:.91rem !important;
  font-weight:600 !important;
  line-height:1.25 !important;
  letter-spacing:-.012em !important;
}
.super-admin-page .sa-client-detail-subtitle{
  margin:2px 0 0 25px !important; /* aligns under title text, not icon */
  padding:0 !important;
  color:#6a7d95 !important;
  font-size:.69rem !important;
  line-height:1.35 !important;
}
.super-admin-page .sa-client-detail-count{
  flex:0 0 auto !important;
  margin-top:1px !important;
  background:#eef5ff !important;
  color:var(--info-primary-dark) !important;
  border:1px solid #d8e6fb !important;
}
.super-admin-page .sa-client-detail-table-wrap{
  width:100% !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  overflow-x:auto !important;
}
.super-admin-page .sa-client-detail-table{
  width:100% !important;
  margin:0 !important;
  table-layout:fixed !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
}
.super-admin-page .sa-client-detail-table thead th{
  height:34px !important;
  padding:7px 10px !important;
  background:#f5f8fe !important;
  border-top:1px solid #e8eff9 !important;
  border-bottom:1px solid #dfe9f7 !important;
  color:#526b89 !important;
  font-size:.64rem !important;
  line-height:1.15 !important;
  font-weight:600 !important;
  letter-spacing:.055em !important;
  text-transform:uppercase !important;
  vertical-align:middle !important;
}
.super-admin-page .sa-client-detail-table tbody td{
  min-height:42px !important;
  padding:9px 10px !important;
  border-bottom:1px solid #edf2fa !important;
  color:#2d4058 !important;
  font-size:.74rem !important;
  line-height:1.35 !important;
  vertical-align:middle !important;
}
.super-admin-page .sa-client-detail-table th:first-child,
.super-admin-page .sa-client-detail-table td:first-child{padding-left:16px !important;}
.super-admin-page .sa-client-detail-table th:last-child,
.super-admin-page .sa-client-detail-table td:last-child{padding-right:16px !important;}
.super-admin-page .sa-client-detail-table tbody tr:last-child td{border-bottom:0 !important;}
.super-admin-page .sa-client-projects-table th:nth-child(1),
.super-admin-page .sa-client-projects-table td:nth-child(1){width:22%;}
.super-admin-page .sa-client-projects-table th:nth-child(2),
.super-admin-page .sa-client-projects-table td:nth-child(2){width:18%;}
.super-admin-page .sa-client-projects-table th:nth-child(3),
.super-admin-page .sa-client-projects-table td:nth-child(3){width:18%;}
.super-admin-page .sa-client-projects-table th:nth-child(4),
.super-admin-page .sa-client-projects-table td:nth-child(4){width:21%;}
.super-admin-page .sa-client-projects-table th:nth-child(5),
.super-admin-page .sa-client-projects-table td:nth-child(5){width:21%;}
.super-admin-page .sa-client-activity-table th:nth-child(1),
.super-admin-page .sa-client-activity-table td:nth-child(1){width:31%;}
.super-admin-page .sa-client-activity-table th:nth-child(2),
.super-admin-page .sa-client-activity-table td:nth-child(2){width:20%;}
.super-admin-page .sa-client-activity-table th:nth-child(3),
.super-admin-page .sa-client-activity-table td:nth-child(3){width:19%;}
.super-admin-page .sa-client-activity-table th:nth-child(4),
.super-admin-page .sa-client-activity-table td:nth-child(4){width:14%;}
.super-admin-page .sa-client-activity-table th:nth-child(5),
.super-admin-page .sa-client-activity-table td:nth-child(5){width:16%;}
.super-admin-page .sa-client-detail-table .badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:22px !important;
  padding:4px 8px !important;
  line-height:1 !important;
  vertical-align:middle !important;
}

/* Footer brand now points to InfoClutch and visually matches footer links. */
.footer-brand-link{
  color:var(--info-primary) !important;
  font-weight:600 !important;
  text-decoration:none !important;
}
.footer-brand-link:hover,
.footer-brand-link:focus{
  color:var(--info-primary-dark) !important;
  text-decoration:none !important;
}

/* Sidebar: slightly larger wordmark, tighter item rhythm. */
.dash-sidebar .dash-logo.dash-logo--combined,
.dash-offcanvas .dash-logo.dash-logo--combined{
  height:44px !important;
}
.dash-sidebar .dash-logo.dash-logo--combined img,
.dash-offcanvas .dash-logo.dash-logo--combined img{
  max-width:162px !important;
}
.sidebar-nav{
  gap:4px !important;
}
.sidebar-nav .nav-item{
  min-height:43px !important;
  padding:8px 12px !important;
  border-radius:14px !important;
}

/* The toggle lives relative to the sidebar itself, not the brand block.
   This keeps it at the true vertical centre of the sidebar end line. */
.dash-sidebar .dash-brand{
  position:static !important;
}
.dash-sidebar{
  position:sticky !important;
}
.dash-sidebar .sidebar-toggle,
.dash-sidebar.is-collapsed .sidebar-toggle{
  position:absolute !important;
  top:50% !important;
  right:-14px !important;
  bottom:auto !important;
  left:auto !important;
  transform:translateY(-50%) !important;
  margin:0 !important;
  width:28px !important;
  height:28px !important;
  z-index:100 !important;
}

/* Preserve the favicon-only collapsed brand after the expanded-logo bump. */
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  width:36px !important;
  min-width:36px !important;
  height:36px !important;
  background:url('../img/favicon.svg') center/30px 30px no-repeat !important;
}
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined img{
  opacity:0 !important;
  width:36px !important;
  height:36px !important;
  max-width:36px !important;
}

/* Eliminate remaining legacy coral/orange interaction feedback. */
.ff-activity-remark-btn:hover,
.ff-activity-remark-btn:focus,
body.dashboard-view .dashboard-recent-card .dashboard-view-all:hover,
body.dashboard-view .dashboard-recent-card .dashboard-view-all:focus,
body.dashboard-view .dashboard-recent-action[title="Download"]:hover,
body.dashboard-view .dashboard-client-action[title="Download"]:hover,
.ff-action-btn[title="Download"]:hover,
.ff-activity-action-btn[title^="Download"]:hover{
  background:var(--info-primary) !important;
  border-color:var(--info-primary) !important;
  color:#fff !important;
  box-shadow:0 7px 16px rgba(61,118,199,.18) !important;
}
body.dashboard-view .dashboard-recent-action[title="Download"],
body.dashboard-view .dashboard-client-action[title="Download"],
.ff-action-btn[title="Download"],
.ff-activity-action-btn[title^="Download"],
.ff-activity-remark-btn{
  background:#eef5ff !important;
  border-color:#d5e4f8 !important;
  color:var(--info-primary) !important;
}
body.dashboard-view .action-card:hover .icon-bubble,
body.dashboard-view .dash-stats-compact > div:nth-child(n) .action-card:hover .icon-bubble{
  background:var(--info-primary) !important;
  border-color:var(--info-primary) !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(61,118,199,.18) !important;
}
body.dashboard-view .action-card:hover::after{
  background:var(--info-primary) !important;
}
body.dashboard-view .dashboard-client-row:hover{
  box-shadow:inset 3px 0 0 var(--info-primary) !important;
}
.super-admin-page .sa-overview-card:hover::before{
  background:var(--info-primary) !important;
}
.super-admin-page .sa-overview-card:hover .sa-overview-icon,
.super-admin-page .sa-overview-card:hover .sa-overview-arrow{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
}

@media (max-width:767.98px){
  .compact-profile-dropdown{
    min-width:198px !important;
    width:198px !important;
  }
  .super-admin-page .sa-client-detail-table{
    min-width:680px !important;
  }
}

/* Final blue-only interaction cleanup for legacy high-specificity rules. */
body.dashboard-view .dashboard-client-action,
body.dashboard-view .dashboard-client-action[title="Download"]{
  background:#eef5ff !important;
  border-color:#d5e4f8 !important;
  color:var(--info-primary) !important;
  box-shadow:none !important;
}
body.dashboard-view .dashboard-client-action:hover,
body.dashboard-view .dashboard-client-action:focus-visible,
body.dashboard-view .dashboard-client-action[title="Download"]:hover,
body.dashboard-view .dashboard-client-action[title="Download"]:focus-visible{
  background:var(--info-primary) !important;
  border-color:var(--info-primary) !important;
  color:#fff !important;
  box-shadow:0 6px 14px rgba(61,118,199,.18) !important;
}
.super-admin-page .sa-mini-stat-card:hover .sa-mini-stat-icon{
  background:#eef5ff !important;
  border-color:#d5e4f8 !important;
  color:var(--info-primary) !important;
}
.td-contact-card:hover .td-contact-icon{
  background:#eef5ff !important;
  color:var(--info-primary) !important;
}
.td-legal-nav a:hover,
.td-contact-card a:hover{
  color:var(--info-primary-dark) !important;
}

/* ======================================================================
   V9 sidebar brand spacing refinement
   - equal left/right logo spacing
   - actual site favicon in collapsed rail
   ====================================================================== */
.dash-sidebar .dash-brand,
.dash-offcanvas .offcanvas-header{
  padding-left:14px !important;
  padding-right:14px !important;
}
.dash-sidebar .dash-brand{
  justify-content:center !important;
}
.dash-sidebar .dash-brand-link{
  width:100% !important;
  justify-content:center !important;
  margin:0 !important;
  padding:0 !important;
}
.dash-sidebar .dash-logo.dash-logo--combined,
.dash-sidebar .dash-logo.dash-logo--combined img{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Collapsed rail: use the exact favicon asset already used in <head>. */
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  width:40px !important;
  min-width:40px !important;
  height:40px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background-color:transparent !important;
  background-image:url('../img/favicon.svg') !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:34px auto !important;
}

.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined img{
  opacity:0 !important;
  visibility:hidden !important;
}

/* ======================================================================
   V10 collapsed sidebar brand asset
   - use a separate transparent favicon mark for the collapsed sidebar
   ====================================================================== */
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  background-image:url('../img/favicon-collapse.svg') !important;
  background-color:transparent !important;
}

/* ======================================================================
   V11 collapsed sidebar icon
   Exact derivative of the current favicon artwork; only the favicon blue
   background is removed. This keeps the sidebar symbol identical to the
   browser favicon glyph rather than using a separately drawn mark.
   ====================================================================== */
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  background-image:url('../img/sidebar-collapse-favicon-exact.png?v=11') !important;
  background-color:transparent !important;
  background-size:34px auto !important;
}



/* ======================================================================
   V13 collapsed favicon correction
   Same corrected glyph is used for the browser favicon and collapsed rail.
   The left loop has a full rounded edge instead of the clipped/flat edge.
   ====================================================================== */
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  background-image:url('../img/sidebar-collapse-favicon-corrected.png?v=13') !important;
  background-position:center center !important;
  background-size:36px auto !important;
  background-repeat:no-repeat !important;
  background-color:transparent !important;
}

/* ======================================================================
   V14 All Files & Folders toolbar
   Remove the full-width background row; keep only the action buttons.
   ====================================================================== */
.ff-files-page .ff-files-actions{
  min-height:0 !important;
  padding:0 !important;
  margin:0 0 10px !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.ff-files-page .ff-files-actions-right{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
}


/* ======================================================================
   V15 sidebar state refinement
   - All Files & Folders is not a Clients-nav state
   - slightly larger collapsed InfoClutch favicon mark
   ====================================================================== */
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  background-size:40px auto !important;
}

/* ======================================================================
   V16 project row spacing
   Give the project-code rows and related table cells more breathing room.
   ====================================================================== */
.ff-project-table tbody td{
  padding:15px 18px !important;
}
.ff-project-code-cell{
  padding-top:16px !important;
  padding-bottom:16px !important;
}
.ff-project-code-chip{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:6px 12px !important;
  min-height:34px !important;
}

/* ======================================================================
   V17 empty-state centering + larger collapsed brand mark
   - empty/no-data messages sit in the visual center of their panel
   - collapsed sidebar mark is larger without affecting expanded branding
   ====================================================================== */

/* Dashboard/list empty states: keep the column header, center the message in
   the remaining body area instead of pinning it near the top. */
.dashboard-client-list > .dashboard-side-empty,
.dashboard-received-list > .dashboard-side-empty,
.dashboard-reference-card .dashboard-side-empty{
  min-height:150px !important;
  padding:18px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  width:100% !important;
}
.dashboard-side-empty.d-none{display:none !important;}

/* Empty rows in tables should occupy enough body height to read as a true
   centered empty state. */
table tbody td[colspan].text-center,
table tbody td[colspan].ff-muted,
table tbody td.ff-project-table-empty,
table tbody td.dashboard-side-empty{
  height:150px !important;
  min-height:150px !important;
  vertical-align:middle !important;
  text-align:center !important;
  padding:20px !important;
}

/* Non-table empty states across tickets, documents, sub-users, filters and
   compact overview panels. */
.ticket-empty,
.doc-empty,
.subuser-empty,
.fs-empty,
.cd-tl-empty,
[data-filter-empty]:not(.d-none),
.notification-panel-empty{
  min-height:150px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  padding:20px !important;
}

/* Standalone no-data blocks used on simple list pages. */
.ff-card > .text-center.text-muted.py-5,
.sa-table-card > .text-center.text-muted.py-4,
.sa-table-card > .text-center.text-muted.py-5,
.dashboard-reference-card > .text-center.text-muted,
.ff-activity-panel .text-center.ff-muted.py-5{
  min-height:150px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
}

/* Larger collapsed InfoClutch mark. Increase the brand box too so the artwork
   never clips while remaining centered in the rail. */
.dash-sidebar.is-collapsed .dash-logo.dash-logo--combined{
  width:50px !important;
  min-width:50px !important;
  height:50px !important;
  background-size:46px auto !important;
  background-position:center center !important;
}

/* ======================================================================
   V18 document pages empty-state visibility fix
   The global centering rule must not force Bootstrap .d-none placeholders
   (such as "No matches") to show by default.
   ====================================================================== */
.doc-empty.d-none,
.ticket-empty.d-none,
.subuser-empty.d-none,
.fs-empty.d-none,
.cd-tl-empty.d-none,
.notification-panel-empty.d-none,
[data-filter-empty].d-none,
#docNoMatches.d-none{
  display:none !important;
}

/* Keep document empty-state and no-match blocks aligned cleanly within the
   document list area. */
.doc-list > .doc-empty{
  width:100% !important;
  box-sizing:border-box !important;
}

/* ======================================================================
   V19 Invoice / Order Forms header-line fix
   The .doc-card accent pseudo-element was absolutely positioned without a
   positioned card, so it appeared above the page title bar. These document
   pages do not need that accent line.
   ====================================================================== */
.doc-card{
  position:relative !important;
}
.doc-card::before{
  content:none !important;
  display:none !important;
}

/* ======================================================================
   V20 GLOBAL WORKSPACE TYPOGRAPHY SYSTEM
   One consistent font hierarchy across every authenticated workspace page.
   Page-specific Bootstrap h3/h4/small/fw-* utilities are intentionally
   normalized here so screens such as List Purchase, Invoices, Order Forms,
   Issues, Settings, Clients and Super Admin all render with the same scale.
   ====================================================================== */
body:not(.landing):not(.auth){
  font-family:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:13px !important;
  font-weight:400 !important;
  line-height:1.5 !important;
}

/* Main blue-header page titles */
body:not(.landing):not(.auth) .ff-topbar h1,
body:not(.landing):not(.auth) .ff-topbar .h1,
body:not(.landing):not(.auth) .ff-topbar .h2,
body:not(.landing):not(.auth) .ff-topbar .h3,
body:not(.landing):not(.auth) .ff-topbar .h4,
body:not(.landing):not(.auth) .sa-page-header h1,
body:not(.landing):not(.auth) .sa-page-header .h1,
body:not(.landing):not(.auth) .sa-page-header .h2,
body:not(.landing):not(.auth) .sa-page-header .h3,
body:not(.landing):not(.auth) .sa-page-header .h4,
body:not(.landing):not(.auth) .workspace-topbar h1,
body:not(.landing):not(.auth) .ff-client-head h1,
body:not(.landing):not(.auth) .page-heading-row h1,
body:not(.landing):not(.auth) .dash-title,
body:not(.landing):not(.auth) .ff-page-title{
  font-family:"Poppins",sans-serif !important;
  font-size:22px !important;
  line-height:1.2 !important;
  font-weight:600 !important;
  letter-spacing:-.02em !important;
}

/* Header subtitles */
body:not(.landing):not(.auth) .page-heading-subtitle,
body:not(.landing):not(.auth) .dash-subtitle,
body:not(.landing):not(.auth) .ff-topbar .small,
body:not(.landing):not(.auth) .sa-page-header .small,
body:not(.landing):not(.auth) .workspace-topbar .small,
body:not(.landing):not(.auth) .ff-client-head .small{
  font-family:"Poppins",sans-serif !important;
  font-size:12px !important;
  line-height:1.4 !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
}

/* Card / panel section titles */
body:not(.landing):not(.auth) .card-title,
body:not(.landing):not(.auth) .ff-section-title,
body:not(.landing):not(.auth) .ff-activity-panel-title,
body:not(.landing):not(.auth) .dashboard-reference-label,
body:not(.landing):not(.auth) .dashboard-side-heading,
body:not(.landing):not(.auth) .settings-section-title,
body:not(.landing):not(.auth) .settings-subsection-title,
body:not(.landing):not(.auth) .sa-client-detail-title-row h2,
body:not(.landing):not(.auth) .doc-toolbar-label,
body:not(.landing):not(.auth) .ticket-thread-head,
body:not(.landing):not(.auth) .ticket-side-card h2,
body:not(.landing):not(.auth) .ticket-side-card h3{
  font-family:"Poppins",sans-serif !important;
  font-size:14px !important;
  line-height:1.35 !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
}

/* Supporting card text */
body:not(.landing):not(.auth) .card-subtitle,
body:not(.landing):not(.auth) .ff-muted,
body:not(.landing):not(.auth) .settings-section-sub,
body:not(.landing):not(.auth) .settings-subsection-sub,
body:not(.landing):not(.auth) .doc-row-sub,
body:not(.landing):not(.auth) .sa-overview-caption{
  font-size:12px !important;
  line-height:1.45 !important;
  font-weight:400 !important;
}

/* Table/list column headings — same on every table implementation */
body:not(.landing):not(.auth) .table thead th,
body:not(.landing):not(.auth) .ff-table thead th,
body:not(.landing):not(.auth) .ff-project-table thead th,
body:not(.landing):not(.auth) .sa-table-card table thead th,
body:not(.landing):not(.auth) .dashboard-recent-table thead th,
body:not(.landing):not(.auth) .doc-list-head,
body:not(.landing):not(.auth) .doc-list-head > span,
body:not(.landing):not(.auth) .dashboard-client-columns,
body:not(.landing):not(.auth) .dashboard-client-columns > span{
  font-family:"Poppins",sans-serif !important;
  font-size:11px !important;
  line-height:1.3 !important;
  font-weight:600 !important;
  letter-spacing:.04em !important;
}

/* Table/list row content */
body:not(.landing):not(.auth) .table tbody td,
body:not(.landing):not(.auth) .ff-table tbody td,
body:not(.landing):not(.auth) .ff-project-table tbody td,
body:not(.landing):not(.auth) .sa-table-card table tbody td,
body:not(.landing):not(.auth) .dashboard-recent-table tbody td,
body:not(.landing):not(.auth) .doc-row,
body:not(.landing):not(.auth) .dashboard-client-row{
  font-family:"Poppins",sans-serif !important;
  font-size:12.5px !important;
  line-height:1.45 !important;
  font-weight:400 !important;
}
body:not(.landing):not(.auth) .ff-file-name,
body:not(.landing):not(.auth) .doc-row-name,
body:not(.landing):not(.auth) .dashboard-recent-name,
body:not(.landing):not(.auth) .dashboard-client-name,
body:not(.landing):not(.auth) .ff-person-name{
  font-size:12.5px !important;
  font-weight:600 !important;
  line-height:1.4 !important;
}

/* Buttons, tabs and compact controls */
body:not(.landing):not(.auth) .btn,
body:not(.landing):not(.auth) button,
body:not(.landing):not(.auth) .nav-link,
body:not(.landing):not(.auth) .ff-action-btn,
body:not(.landing):not(.auth) .ff-icon-btn,
body:not(.landing):not(.auth) .doc-action-btn,
body:not(.landing):not(.auth) .sa-action-view,
body:not(.landing):not(.auth) .dashboard-view-all{
  font-family:"Poppins",sans-serif !important;
  font-size:12.5px !important;
  font-weight:600 !important;
  line-height:1.35 !important;
}

/* Inputs/search */
body:not(.landing):not(.auth) .form-control,
body:not(.landing):not(.auth) .form-select,
body:not(.landing):not(.auth) input,
body:not(.landing):not(.auth) select,
body:not(.landing):not(.auth) textarea{
  font-family:"Poppins",sans-serif !important;
  font-size:12.5px !important;
  font-weight:400 !important;
  line-height:1.4 !important;
}
body:not(.landing):not(.auth) .form-label{
  font-size:12px !important;
  font-weight:500 !important;
}

/* Pills / badges / status labels */
body:not(.landing):not(.auth) .badge,
body:not(.landing):not(.auth) .ff-status,
body:not(.landing):not(.auth) .ff-type-pill,
body:not(.landing):not(.auth) .doc-code-pill,
body:not(.landing):not(.auth) .doc-payment-pill,
body:not(.landing):not(.auth) .ticket-category-tag,
body:not(.landing):not(.auth) .nav-item-badge{
  font-family:"Poppins",sans-serif !important;
  font-size:11px !important;
  line-height:1.25 !important;
  font-weight:600 !important;
}

/* Empty/no-data messages */
body:not(.landing):not(.auth) .doc-empty,
body:not(.landing):not(.auth) .dashboard-side-empty,
body:not(.landing):not(.auth) .ticket-empty,
body:not(.landing):not(.auth) .ff-project-table-empty,
body:not(.landing):not(.auth) [data-filter-empty]{
  font-size:13px !important;
  font-weight:400 !important;
  line-height:1.5 !important;
}
body:not(.landing):not(.auth) .doc-empty .fw-semibold,
body:not(.landing):not(.auth) .ticket-empty .fw-semibold,
body:not(.landing):not(.auth) [data-filter-empty] .fw-semibold{
  font-size:14px !important;
  font-weight:600 !important;
}

/* Sidebar stays slightly stronger, but identical across roles/pages. */
body:not(.landing):not(.auth) .sidebar-nav .nav-item,
body:not(.landing):not(.auth) .sidebar-nav .nav-item span{
  font-family:"Poppins",sans-serif !important;
  font-size:14px !important;
  line-height:1.3 !important;
  font-weight:600 !important;
}

/* Modal hierarchy */
body:not(.landing):not(.auth) .modal-title,
body:not(.landing):not(.auth) .modal h6{
  font-size:15px !important;
  line-height:1.35 !important;
  font-weight:600 !important;
}
body:not(.landing):not(.auth) .modal-body{
  font-size:13px !important;
  line-height:1.5 !important;
  font-weight:400 !important;
}

/* ======================================================================
   V21 uniform empty-table typography
   Empty/no-data copy must use the exact same typography as normal table
   body content. This keeps messages such as "No invoices uploaded yet"
   and "No received shares yet." visually identical across pages.
   ====================================================================== */
body:not(.landing):not(.auth) .doc-empty,
body:not(.landing):not(.auth) .doc-empty .fw-semibold,
body:not(.landing):not(.auth) .dashboard-side-empty,
body:not(.landing):not(.auth) .ticket-empty,
body:not(.landing):not(.auth) .ticket-empty .fw-semibold,
body:not(.landing):not(.auth) .ff-project-table-empty,
body:not(.landing):not(.auth) [data-filter-empty],
body:not(.landing):not(.auth) [data-filter-empty] .fw-semibold,
body:not(.landing):not(.auth) table tbody td[colspan].text-center,
body:not(.landing):not(.auth) table tbody td[colspan].ff-muted,
body:not(.landing):not(.auth) .table tbody td[colspan],
body:not(.landing):not(.auth) .ff-table tbody td[colspan],
body:not(.landing):not(.auth) .sa-table-card table tbody td[colspan],
body:not(.landing):not(.auth) .doc-list > .doc-empty{
  font-family:"Poppins",sans-serif !important;
  font-size:12.5px !important;
  line-height:1.45 !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
}

/* Secondary helper text inside an empty state is deliberately the same size
   and weight as the primary empty message so every empty table reads as one
   consistent body-text treatment. */
body:not(.landing):not(.auth) .doc-empty .small,
body:not(.landing):not(.auth) .ticket-empty .small,
body:not(.landing):not(.auth) [data-filter-empty] .small{
  font-size:12.5px !important;
  line-height:1.45 !important;
  font-weight:400 !important;
}

/* ======================================================================
   ACCOUNT DETAILS DASHBOARD - reference-inspired layout
   Keeps all existing account/project/share behavior while presenting the
   page as a compact dashboard: profile rail, summary metrics, upload,
   activity overview, projects, and sent/received files.
   ====================================================================== */
.ff-client-detail-page .ff-account-dashboard-grid{
  display:grid;
  grid-template-columns:minmax(245px, .82fr) repeat(3, minmax(0, 1fr));
  grid-template-areas:
    "profile metrics metrics metrics"
    "profile upload activity activity"
    "projects projects files files";
  gap:16px;
  align-items:stretch;
}

/* Profile rail */
.ff-client-detail-page .ff-account-dashboard-grid > .ff-client-summary-card{
  grid-area:profile;
  margin:0 !important;
  padding:24px 20px 20px !important;
  min-height:100%;
  overflow:visible;
}
.ff-client-detail-page .ff-client-summary-main{
  height:100%;
  flex-direction:column;
  align-items:stretch;
  gap:14px;
}
.ff-client-detail-page .ff-client-summary-avatar{
  width:112px;
  height:112px;
  flex:0 0 112px;
  margin:8px auto 0;
  font-size:2rem;
  border-color:#cfe0f7;
  background:linear-gradient(145deg,#eef6ff 0%,#e8f6f2 100%);
  box-shadow:0 10px 28px rgba(45,103,170,.08);
}
.ff-client-detail-page .ff-client-summary-copy{
  width:100%;
  text-align:center;
}
.ff-client-detail-page .ff-client-summary-title{
  justify-content:center;
  font-size:1.18rem !important;
  font-weight:700 !important;
  color:#14213d !important;
}
.ff-client-detail-page .ff-client-summary-subtitle{
  justify-content:center;
  margin-top:5px;
  font-size:.73rem !important;
  color:#748096 !important;
}
.ff-client-detail-page .ff-client-summary-chips{
  display:grid;
  grid-template-columns:1fr;
  gap:9px;
  margin-top:18px;
  text-align:left;
}
.ff-client-detail-page .ff-client-info-chip,
.ff-client-detail-page .ff-client-custom-chip.is-half,
.ff-client-detail-page .ff-client-custom-chip.is-full{
  width:100%;
  min-height:38px;
  padding:8px 11px;
  border-radius:10px;
  background:#fff;
  justify-content:flex-start;
  border-color:#e0e8f2;
}
.ff-client-detail-page .ff-client-summary-edit-btn{
  top:16px !important;
  right:16px !important;
  left:auto !important;
  margin-left:auto;
  background:#fff !important;
  border-color:#dbe5f1 !important;
  box-shadow:0 4px 12px rgba(25,69,118,.05);
}
.ff-client-detail-page .ff-client-summary-edit-btn:hover,
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-edit-btn{
  background:var(--info-primary) !important;
  border-color:var(--info-primary) !important;
  color:#fff !important;
}
.ff-client-detail-page .ff-client-summary-card:not(.is-editing) .ff-client-edit-only{
  display:none !important;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-view-only{
  display:none !important;
}
.ff-client-detail-page .ff-client-inline-title,
.ff-client-detail-page .ff-client-inline-subtitle{
  width:100%;
}
.ff-client-detail-page .ff-client-chip-input,
.ff-client-detail-page .ff-client-url-chip .ff-client-chip-input,
.ff-client-detail-page .ff-client-chip-input-short,
.ff-client-detail-page .ff-client-chip-select{
  width:100%;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-location-chip{
  display:grid !important;
  grid-template-columns:auto 1fr auto 1fr;
}
.ff-client-detail-page .ff-client-custom-editor{
  text-align:left;
}
.ff-client-detail-page .ff-client-custom-edit-row{
  grid-template-columns:1fr;
}
.ff-client-detail-page .ff-client-custom-save,
.ff-client-detail-page .ff-client-custom-remove{
  display:inline-flex;
}
/* When profile editing is active, focus the page on the form so fields have room. */
.ff-client-detail-page .ff-account-dashboard-grid > .ff-client-summary-card.is-editing{
  grid-column:1 / -1;
  grid-row:1;
  min-height:0;
}
.ff-client-detail-page .ff-account-dashboard-grid > .ff-client-summary-card.is-editing ~ *{
  display:none !important;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-main{
  flex-direction:row;
  align-items:flex-start;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-copy{
  text-align:left;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-title,
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-subtitle{
  justify-content:flex-start;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-chips{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-custom-edit-row{
  grid-template-columns:minmax(135px,.8fr) minmax(165px,1.15fr) 34px 34px;
}

/* Summary metrics */
.ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid{
  grid-area:metrics;
  margin:0;
  gap:16px;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric{
  min-height:118px;
  padding:20px 22px !important;
  border-radius:14px !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-label{
  font-size:.78rem !important;
  color:#39465f !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-value{
  margin-top:7px;
  font-size:1.65rem !important;
  color:#102044 !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-icon{
  width:42px;
  height:42px;
  font-size:1.05rem;
  border-radius:12px !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-sub{
  margin-top:8px;
  font-size:.64rem;
}

/* Upload card */
.ff-client-detail-page .ff-account-upload-card{
  grid-area:upload;
  min-height:306px;
  padding:20px;
  display:flex;
  flex-direction:column;
  margin:0;
}
.ff-client-detail-page .ff-account-card-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.ff-client-detail-page .ff-account-card-heading h2{
  margin:0;
  color:#17233f;
  font-size:1rem;
  font-weight:700;
}
.ff-client-detail-page .ff-account-card-heading p{
  margin:4px 0 0;
  color:#778299;
  font-size:.7rem;
}
.ff-client-detail-page .ff-account-heading-icon{
  width:36px;height:36px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  background:#edf8fb;color:#10a9bf;border:1px solid #d7eef3;
}
.ff-client-detail-page .ff-account-upload-dropzone{
  flex:1;
  width:100%;
  min-height:184px;
  border:1.5px dashed #9fc6ef;
  border-radius:12px;
  background:#fbfdff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:#66748d;
  cursor:pointer;
  transition:.16s ease;
}
.ff-client-detail-page .ff-account-upload-dropzone:hover{
  background:#f3f9ff;
  border-color:var(--info-primary);
  transform:translateY(-1px);
}
.ff-client-detail-page .ff-account-upload-cloud{
  color:var(--info-primary);
  font-size:2rem;
  line-height:1;
}
.ff-client-detail-page .ff-account-upload-dropzone strong{
  color:#1f2a44;
  font-size:.8rem;
}
.ff-client-detail-page .ff-account-upload-dropzone > span:not(.ff-account-upload-cloud):not(.ff-account-upload-cta){
  font-size:.67rem;
}
.ff-client-detail-page .ff-account-upload-cta{
  margin-top:4px;
  min-height:36px;
  padding:0 17px;
  border-radius:8px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  background:var(--info-primary);
  color:#fff;
  font-size:.75rem;
  font-weight:700;
  box-shadow:0 8px 18px rgba(29,137,167,.16);
}
.ff-client-detail-page .ff-account-upload-note{
  margin-top:12px;
  text-align:center;
  color:#8a95aa;
  font-size:.64rem;
}
.ff-client-detail-page .ff-account-upload-note i{margin-right:5px;color:#617590;}

/* Activity overview */
.ff-client-detail-page .ff-account-activity-overview{
  grid-area:activity;
  min-height:306px;
  margin:0;
  padding:20px 22px;
  display:flex;
  flex-direction:column;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-head{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:18px;
  margin:0;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-title{
  font-size:1rem !important;
  color:#17233f !important;
  font-weight:700 !important;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-sub{
  margin-top:4px;
  font-size:.7rem !important;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-counts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  text-align:center;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-counts > div{
  min-height:132px;
  border:1px solid #dce8f5;
  border-radius:12px;
  background:linear-gradient(180deg,#f8fbff 0%,#f2f8ff 100%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:14px;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-counts > .received{
  border-color:#d8ebdf;
  background:linear-gradient(180deg,#fbfffc 0%,#f2faf5 100%);
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-counts strong{
  font-size:2.35rem;
  line-height:1;
  font-weight:700;
  color:#102044 !important;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-counts span{
  margin-top:8px;
  font-size:.72rem;
  font-weight:600;
  color:#627087;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-bar{
  height:9px;
  margin-top:auto;
  border-radius:999px;
  background:#eaf0f6 !important;
  box-shadow:inset 0 0 0 1px rgba(30,67,105,.03);
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-bar .sent{
  background:#159fbd !important;
}
.ff-client-detail-page .ff-account-activity-overview .ff-balance-bar .received{
  background:#43b95c !important;
}

/* Projects + recent file activity */
.ff-client-detail-page .ff-account-projects-card{
  grid-area:projects;
  margin:0 !important;
  min-height:314px;
  overflow:hidden;
}
.ff-client-detail-page .ff-account-file-columns{
  grid-area:files;
  margin:0;
  gap:14px;
  grid-template-columns:1fr 1fr;
  min-width:0;
}
.ff-client-detail-page .ff-account-file-columns > .ff-activity-panel{
  min-width:0;
  min-height:314px;
  overflow:hidden;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-panel-head{
  padding:14px 14px 12px;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-panel-title{
  min-width:0;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-panel-title small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:180px;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-list{
  max-height:252px;
  overflow:auto;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-item{
  padding:11px 12px;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-state{
  grid-column:2;
  grid-row:1;
  min-width:0;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-actions{
  grid-column:2;
  grid-row:2;
  justify-content:flex-end;
  padding-left:0;
}

/* Admin detail edit button: pin to the far-right edge of the profile card. */
.super-admin-page .sa-profile-hero-actions--edit-only{
  left:auto !important;
  right:18px !important;
  justify-content:flex-end;
}

@media (max-width:1199.98px){
  .ff-client-detail-page .ff-account-dashboard-grid{
    grid-template-columns:250px repeat(2,minmax(0,1fr));
    grid-template-areas:
      "profile metrics metrics"
      "profile upload activity"
      "projects projects projects"
      "files files files";
  }
  .ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .ff-client-detail-page .ff-account-file-columns > .ff-activity-panel{min-height:280px;}
}

@media (max-width:899.98px){
  .ff-client-detail-page .ff-account-dashboard-grid{
    grid-template-columns:1fr;
    grid-template-areas:
      "profile"
      "metrics"
      "upload"
      "activity"
      "projects"
      "files";
  }
  .ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-main{
    flex-direction:column;
  }
  .ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-chips{
    grid-template-columns:1fr;
  }
}

@media (max-width:699.98px){
  .ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid,
  .ff-client-detail-page .ff-account-file-columns,
  .ff-client-detail-page .ff-account-activity-overview .ff-balance-counts{
    grid-template-columns:1fr;
  }
  .ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-custom-edit-row{
    grid-template-columns:1fr 1fr;
  }
}

/* ======================================================================
   ACCOUNT DETAILS DASHBOARD - reference match refinement (2026-08-31)
   ====================================================================== */
.ff-client-detail-page{
  background:#f7f9fc !important;
}
.ff-client-detail-page .ff-shell{
  max-width:none !important;
}
.ff-client-detail-page .ff-account-dashboard-grid{
  grid-template-columns:300px minmax(390px,.95fr) minmax(0,1.7fr) !important;
  grid-template-areas:
    "profile metrics metrics"
    "profile upload activity"
    "projects projects files" !important;
  gap:16px !important;
  align-items:stretch !important;
}

/* Profile - cleaner neutral rail like the supplied reference. */
.ff-client-detail-page .ff-account-dashboard-grid > .ff-client-summary-card{
  padding:24px 22px 20px !important;
  border-radius:15px !important;
  background:#fff !important;
  border:1px solid #e5eaf1 !important;
  box-shadow:0 8px 24px rgba(31,55,86,.055) !important;
}
.ff-client-detail-page .ff-client-summary-avatar{
  width:108px !important;
  height:108px !important;
  flex-basis:108px !important;
  margin:8px auto 2px !important;
  color:#2267d8 !important;
  background:linear-gradient(145deg,#f1f7ff 0%,#e9f3ff 100%) !important;
  border:1px solid #d6e5f8 !important;
  box-shadow:none !important;
}
.ff-client-detail-page .ff-client-summary-title{
  margin-top:2px !important;
  font-size:1.16rem !important;
}
.ff-client-detail-page .ff-client-summary-subtitle{
  font-size:.71rem !important;
  color:#758198 !important;
}
.ff-client-detail-page .ff-client-summary-chips{
  position:relative;
  gap:0 !important;
  margin-top:20px !important;
  padding-top:15px;
  border-top:1px solid #edf1f5;
}
.ff-client-detail-page .ff-client-info-chip,
.ff-client-detail-page .ff-client-custom-chip.is-half,
.ff-client-detail-page .ff-client-custom-chip.is-full{
  width:100% !important;
  min-height:38px !important;
  padding:8px 5px !important;
  border:0 !important;
  border-radius:7px !important;
  background:#fff !important;
  box-shadow:none !important;
  color:#596780 !important;
}
.ff-client-detail-page .ff-client-info-chip + .ff-client-info-chip,
.ff-client-detail-page .ff-client-custom-chip + .ff-client-custom-chip{
  margin-top:2px;
}
.ff-client-detail-page .ff-client-info-chip i{
  width:22px;
  color:#1d6fe9 !important;
  text-align:center;
}
.ff-client-detail-page .ff-client-summary-edit-btn{
  top:16px !important;
  right:16px !important;
  left:auto !important;
  width:34px !important;
  height:34px !important;
  border-radius:8px !important;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-info-chip{
  border:1px solid #e2e8f0 !important;
  padding:7px 10px !important;
}

/* Four compact summary cards across the top. */
.ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:16px !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric{
  position:relative;
  min-height:118px !important;
  padding:18px 18px !important;
  border:1px solid #e5eaf1 !important;
  border-radius:15px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(31,55,86,.045) !important;
  overflow:hidden;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric::after{
  display:none !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-label{
  color:#2d394f !important;
  font-size:.76rem !important;
  font-weight:500 !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-value{
  margin-top:6px !important;
  color:#0e2146 !important;
  font-size:1.58rem !important;
  line-height:1.15 !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-value-date{
  font-size:1.2rem !important;
  white-space:nowrap;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-icon{
  position:absolute !important;
  top:16px !important;
  right:16px !important;
  width:42px !important;
  height:42px !important;
  color:#2874e8 !important;
  background:#eef5ff !important;
  border:1px solid #dbe8fb !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric:nth-child(2) .ff-metric-icon{
  color:#12a8b9 !important;
  background:#edfafa !important;
  border-color:#d4f0f2 !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric:nth-child(3) .ff-metric-icon{
  color:#3c9c26 !important;
  background:#f1faee !important;
  border-color:#ddf0d8 !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-icon-purple{
  color:#6657e8 !important;
  background:#f3f1ff !important;
  border-color:#e6e0ff !important;
}
.ff-client-detail-page .ff-account-dashboard-grid .ff-metric-sub{
  margin-top:7px !important;
  color:#8290a4 !important;
  font-size:.62rem !important;
  white-space:normal;
}

/* Upload card dimensions and density. */
.ff-client-detail-page .ff-account-upload-card{
  min-height:330px !important;
  padding:20px 20px 16px !important;
  border:1px solid #e5eaf1 !important;
  border-radius:15px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(31,55,86,.045) !important;
}
.ff-client-detail-page .ff-account-card-heading{
  margin-bottom:13px !important;
}
.ff-client-detail-page .ff-account-card-heading h2{
  font-size:.98rem !important;
}
.ff-client-detail-page .ff-account-card-heading p{
  font-size:.69rem !important;
}
.ff-client-detail-page .ff-account-heading-icon{
  display:none !important;
}
.ff-client-detail-page .ff-account-upload-dropzone{
  min-height:190px !important;
  border-radius:11px !important;
  border:1.5px dashed #9ec8f8 !important;
  background:#fcfdff !important;
}
.ff-client-detail-page .ff-account-upload-cloud{
  font-size:2.2rem !important;
  color:#176fe8 !important;
}
.ff-client-detail-page .ff-account-upload-cta{
  min-height:38px !important;
  padding:0 18px !important;
  border-radius:7px !important;
  background:#176fe8 !important;
  box-shadow:0 7px 16px rgba(23,111,232,.15) !important;
}
.ff-client-detail-page .ff-account-upload-note{
  margin-top:11px !important;
}

/* Activity overview: filterable counters plus a date-range-aware chart. */
.ff-client-detail-page .ff-account-activity-overview{
  grid-area:activity;
  min-height:330px !important;
  margin:0 !important;
  padding:18px 20px 14px !important;
  display:flex !important;
  flex-direction:column !important;
  border:1px solid #e5eaf1 !important;
  border-radius:15px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(31,55,86,.045) !important;
}
.ff-client-detail-page .ff-account-activity-titlebar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}
.ff-client-detail-page .ff-account-activity-titlebar h2{
  margin:0;
  color:#17233f;
  font-size:.98rem;
  font-weight:700;
}
.ff-client-detail-page .ff-account-activity-titlebar p{
  margin:3px 0 0;
  color:#7c879b;
  font-size:.68rem;
}
.ff-client-detail-page .ff-account-range-select{
  min-width:112px;
  height:34px;
  padding:0 28px 0 10px;
  border:1px solid #dfe6ef;
  border-radius:8px;
  background:#fff;
  color:#4d5a71;
  font-size:.68rem;
  opacity:1 !important;
  -webkit-text-fill-color:#4d5a71;
}
.ff-client-detail-page .ff-account-activity-stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(180px,280px));
  justify-content:center;
  gap:16px;
  margin:2px auto 10px;
}
.ff-client-detail-page .ff-account-activity-stat{
  min-height:82px;
  border:1px solid #cfe0f7;
  border-radius:10px;
  background:linear-gradient(180deg,#f8fbff 0%,#f2f7ff 100%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  text-align:center;
}
.ff-client-detail-page .ff-account-activity-stat.received{
  border-color:#d4e9dc;
  background:linear-gradient(180deg,#fbfefc 0%,#f3faf5 100%);
}
.ff-client-detail-page .ff-account-activity-stat-label{
  color:#1e365d;
  font-size:.68rem;
  font-weight:600;
}
.ff-client-detail-page .ff-account-activity-stat.received .ff-account-activity-stat-label{
  color:#278840;
}
.ff-client-detail-page .ff-account-activity-stat strong{
  margin-top:3px;
  color:#102044;
  font-size:1.75rem;
  line-height:1;
  font-weight:700;
}
.ff-client-detail-page .ff-account-activity-stat-copy{
  margin-top:4px;
  color:#65748b;
  font-size:.62rem;
}
.ff-client-detail-page .ff-account-chart-shell{
  margin-top:auto;
}
.ff-client-detail-page .ff-account-activity-chart{
  display:block;
  width:100%;
  height:82px;
  overflow:visible;
}
.ff-client-detail-page .ff-account-chart-grid line{
  stroke:#e9eef5;
  stroke-width:1;
  stroke-dasharray:3 4;
}
.ff-client-detail-page .ff-account-chart-line{
  fill:none;
  stroke-width:2.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.ff-client-detail-page .ff-account-chart-line.sent{stroke:#176fe8;}
.ff-client-detail-page .ff-account-chart-line.received{stroke:#26a75a;}
.ff-client-detail-page .ff-account-chart-area.sent{fill:rgba(23,111,232,.075);}
.ff-client-detail-page .ff-account-chart-area.received{fill:rgba(38,167,90,.055);}
.ff-client-detail-page .ff-account-chart-dots.sent circle{fill:#176fe8;}
.ff-client-detail-page .ff-account-chart-dots.received circle{fill:#26a75a;}
.ff-client-detail-page .ff-account-chart-labels{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  padding-left:30px;
  color:#8995a8;
  font-size:.57rem;
}
.ff-client-detail-page .ff-account-chart-labels span{text-align:center;}
.ff-client-detail-page .ff-account-chart-labels span:first-child{text-align:left;}
.ff-client-detail-page .ff-account-chart-labels span:last-child{text-align:right;}
.ff-client-detail-page .ff-account-chart-legend{
  display:flex;
  justify-content:center;
  gap:22px;
  margin-top:4px;
  color:#647188;
  font-size:.62rem;
}
.ff-client-detail-page .ff-account-chart-legend span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.ff-client-detail-page .ff-account-chart-legend i{
  width:7px;
  height:7px;
  border-radius:50%;
  display:inline-block;
}
.ff-client-detail-page .ff-account-chart-legend i.sent{background:#176fe8;}
.ff-client-detail-page .ff-account-chart-legend i.received{background:#26a75a;}

/* Bottom row: projects on the left, sent/received stacked on the right. */
.ff-client-detail-page .ff-account-projects-card{
  grid-area:projects !important;
  min-height:316px !important;
  border:1px solid #e5eaf1 !important;
  border-radius:15px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(31,55,86,.045) !important;
}
.ff-client-detail-page .ff-account-file-columns{
  grid-area:files !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  grid-template-rows:repeat(2,minmax(0,1fr)) !important;
  gap:14px !important;
}
.ff-client-detail-page .ff-account-file-columns > .ff-activity-panel{
  min-height:151px !important;
  height:auto !important;
  border:1px solid #e5eaf1 !important;
  border-radius:15px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(31,55,86,.045) !important;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-panel-head{
  min-height:54px;
  padding:12px 14px 10px !important;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-panel-title small{
  max-width:none !important;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-list{
  max-height:104px !important;
  overflow:auto !important;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-item{
  padding:9px 12px !important;
  grid-template-columns:minmax(0,1fr) auto auto !important;
  column-gap:22px !important;
  row-gap:9px !important;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-state{
  grid-column:2 !important;
  grid-row:1 !important;
}
.ff-client-detail-page .ff-account-file-columns .ff-activity-actions{
  grid-column:3 !important;
  grid-row:1 !important;
  align-self:center;
  justify-self:end;
  margin-left:8px;
}
.ff-client-detail-page .ff-project-table-wrap{
  min-height:250px;
}
.ff-client-detail-page .ff-project-table th{
  background:#fbfcfe !important;
}

/* Keep the admin-detail edit control locked to the far right. */
.super-admin-page .sa-profile-hero-card{
  position:relative;
}
.super-admin-page .sa-profile-hero-actions--edit-only{
  position:absolute !important;
  top:18px !important;
  right:18px !important;
  left:auto !important;
  width:auto !important;
  z-index:4;
  justify-content:flex-end !important;
}

@media (max-width:1399.98px){
  .ff-client-detail-page .ff-account-dashboard-grid{
    grid-template-columns:270px minmax(340px,.95fr) minmax(0,1.55fr) !important;
  }
  .ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid{
    gap:12px !important;
  }
  .ff-client-detail-page .ff-account-dashboard-grid .ff-metric{
    padding:16px !important;
  }
}

@media (max-width:1199.98px){
  .ff-client-detail-page .ff-account-dashboard-grid{
    grid-template-columns:260px minmax(0,1fr) !important;
    grid-template-areas:
      "profile metrics"
      "profile upload"
      "activity activity"
      "projects projects"
      "files files" !important;
  }
  .ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .ff-client-detail-page .ff-account-file-columns{
    grid-template-columns:1fr 1fr !important;
    grid-template-rows:1fr !important;
  }
}

@media (max-width:899.98px){
  .ff-client-detail-page .ff-account-dashboard-grid{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "profile"
      "metrics"
      "upload"
      "activity"
      "projects"
      "files" !important;
  }
  .ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .ff-client-detail-page .ff-account-file-columns{
    grid-template-columns:1fr !important;
    grid-template-rows:auto !important;
  }
}

@media (max-width:599.98px){
  .ff-client-detail-page .ff-account-dashboard-grid > .ff-metric-grid,
  .ff-client-detail-page .ff-account-activity-stats{
    grid-template-columns:1fr !important;
  }
  .ff-client-detail-page .ff-account-chart-labels span:nth-child(2),
  .ff-client-detail-page .ff-account-chart-labels span:nth-child(4){
    display:none;
  }
  .ff-client-detail-page .ff-account-chart-labels{
    grid-template-columns:repeat(4,1fr);
  }
}


/* Account details polish: activity title icon + compact profile edit fields. */
.ff-client-detail-page .ff-account-activity-heading-copy{
  display:flex;
  align-items:flex-start;
  gap:10px;
  min-width:0;
}
.ff-client-detail-page .ff-account-activity-heading-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#eef5ff;
  border:1px solid #d8e6fb;
  color:#176fe8;
  font-size:.9rem;
  line-height:1;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-inline-title,
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-inline-subtitle{
  width:min(520px,100%) !important;
  max-width:520px;
}
@media (max-width:700px){
  .ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-inline-title,
  .ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-inline-subtitle{
    width:100% !important;
    max-width:none;
  }
}

/* Client profile edit layout: two fields per row with clear spacing. */
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-copy{
  display:block;
  width:100%;
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-title,
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-subtitle,
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-summary-chips{
  display:none !important;
}
.ff-client-detail-page .ff-client-profile-edit-grid{
  width:min(100%,920px);
  max-width:920px;
  display:flex !important;
  flex-direction:column;
  gap:14px;
  margin-top:4px;
}
.ff-client-detail-page .ff-client-edit-row{
  width:100%;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}
.ff-client-detail-page .ff-client-edit-field{
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  min-width:0;
  margin:0;
}
.ff-client-detail-page .ff-client-edit-field > i{
  position:absolute;
  left:13px;
  z-index:2;
  color:#1d6fe9;
  font-size:.82rem;
  pointer-events:none;
}
.ff-client-detail-page .ff-client-edit-field > i + .form-control,
.ff-client-detail-page .ff-client-edit-field > i + .form-select{
  padding-left:46px;
}

.ff-client-detail-page .ff-client-location-field > i{
  left:16px;
  width:18px;
  text-align:center;
}
.ff-client-detail-page .ff-client-location-field > .form-select{
  padding-left:54px !important;
}
/* app.js converts country/state selects into searchable text inputs.
   Style the generated visible control, not only the hidden native select. */
.ff-client-detail-page .ff-client-location-field > .geo-search-select{
  width:100% !important;
  min-width:0 !important;
}
.ff-client-detail-page .ff-client-location-field > .geo-search-select .geo-search-input{
  width:100% !important;
  min-width:0 !important;
  height:42px !important;
  min-height:42px !important;
  padding-left:54px !important;
  padding-right:36px !important;
  border:1px solid #dbe5f1 !important;
  border-radius:10px !important;
  background:#fff !important;
  color:#40506a !important;
  font-size:.82rem !important;
  box-shadow:none !important;
}
.ff-client-detail-page .ff-client-location-field > .geo-search-select::after{
  right:14px !important;
}

.ff-client-detail-page .ff-client-edit-field .form-control,
.ff-client-detail-page .ff-client-edit-field .form-select{
  width:100%;
  min-width:0;
  height:42px;
  margin:0;
  border:1px solid #dbe5f1;
  border-radius:10px;
  background:#fff;
  color:#40506a;
  font-size:.82rem;
  box-shadow:none;
}
.ff-client-detail-page .ff-client-edit-field .form-control:focus,
.ff-client-detail-page .ff-client-edit-field .form-select:focus{
  border-color:#8db8f4;
  box-shadow:0 0 0 3px rgba(29,111,233,.08);
}
.ff-client-detail-page .ff-client-summary-card.is-editing .ff-client-custom-editor{
  margin-top:18px;
}
@media (max-width: 760px){
  .ff-client-detail-page .ff-client-edit-row{
    grid-template-columns:1fr;
    gap:12px;
  }
}