/* ============================================================
   BuniSoft — global stylesheet
   Ported verbatim from bunisoft-handoff/project/BuniSoft Website.dc.html
   (the <style> block) and extended with the hover/focus states the
   prototype expressed via style-hover / style-focus attributes.
   Design tokens live in :root; layout/colour stay inline in the
   Blade views so the markup matches the prototype pixel-for-pixel.
   ============================================================ */

/* ---------- design tokens ---------- */
:root{
  /* brand */
  --bs-teal:#34e3c4;
  --bs-teal-2:#22c3d6;
  --bs-teal-soft:#2ddfc0;
  --bs-grad:linear-gradient(135deg,#34e3c4,#22c3d6);
  --bs-teal-ink:#062019;        /* text on teal buttons */
  --bs-teal-text:#12a98c;       /* eyebrow / link teal on light */
  --bs-teal-text-2:#0c6f5c;
  --bs-teal-glow:#7ff0db;

  /* navy / ink */
  --bs-navy:#081834;
  --bs-navy-2:#0a2048;
  --bs-navy-3:#0f2b58;
  --bs-ink:#0e1b33;
  --bs-foot:#06122a;

  /* dashboards */
  --bs-dash-bg:#0a1124;
  --bs-dash-card:#0f1830;

  /* light surfaces */
  --bs-bg:#ffffff;
  --bs-surface:#f5f8fc;
  --bs-border:#e3eaf4;
  --bs-border-2:#e9eff6;
  --bs-field-border:#d8e1ee;

  /* muted text (light) */
  --bs-muted:#50617d;
  --bs-muted-2:#5b6b85;
  --bs-muted-3:#3c4d68;
  --bs-muted-4:#7a8aa4;

  /* muted text (dark) */
  --bs-d-text:#aebfdb;
  --bs-d-muted:#8ea3c6;
  --bs-d-muted-2:#7e93b8;
  --bs-d-muted-3:#9fb2d0;
  --bs-d-nav:#c6d4ea;

  /* fonts */
  --bs-head:'Sora',sans-serif;
  --bs-body:'Manrope',sans-serif;
}

/* ---------- base (verbatim from design) ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--bs-body);color:#0e1b33;background:#ffffff;-webkit-font-smoothing:antialiased}
::selection{background:#34e3c4;color:#081834}
a{text-decoration:none}

/* ---------- keyframes (verbatim) ---------- */
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes floaty2{0%,100%{transform:translateY(0)}50%{transform:translateY(10px)}}
@keyframes pulseGlow{0%,100%{opacity:.55}50%{opacity:.9}}
@keyframes barGrow{from{transform:scaleY(.2)}to{transform:scaleY(1)}}
@keyframes dash{to{stroke-dashoffset:0}}
@keyframes spinSlow{to{transform:rotate(360deg)}}

/* ============================================================
   HOVER / FOCUS — the prototype declared these inline via
   style-hover="" / style-focus="". Recreated here as real CSS,
   keyed to the data-fx / class hooks placed in the Blade markup.
   ============================================================ */

/* nav links (dark header) */
.bs-navlink{transition:color .15s,background .15s}
.bs-navlink:hover{color:#fff;background:rgba(120,160,220,.12)}
.bs-login-link{transition:color .15s}
.bs-login-link:hover{color:#fff}
.bs-mobile-navlink:hover{background:rgba(120,160,220,.12)}

/* primary teal button — lifts on hover */
.bs-btn-primary{transition:transform .15s,box-shadow .15s}
.bs-btn-primary:hover{transform:translateY(-2px)}
.bs-btn-primary-lift:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(40,210,190,.45)}

/* secondary / ghost button on dark */
.bs-btn-ghost{transition:background .15s}
.bs-btn-ghost:hover{background:rgba(255,255,255,.12)}

/* about feature card (light) */
.bs-lift{transition:transform .18s,box-shadow .18s}
.bs-lift:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(14,27,51,.08)}

/* service card */
.bs-svc-card{transition:transform .2s,box-shadow .2s,border-color .2s}
.bs-svc-card:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(14,27,51,.1);border-color:#bfe9df}

/* why-card (dark) */
.bs-why-card{transition:background .18s,border-color .18s}
.bs-why-card:hover{background:rgba(52,227,196,.06);border-color:rgba(52,227,196,.3)}

/* project card */
.bs-proj-card{transition:transform .2s,box-shadow .2s}
.bs-proj-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(14,27,51,.12)}

/* footer links */
.bs-foot-link{transition:color .15s}
.bs-foot-link:hover{color:#34e3c4}

/* social buttons */
.bs-social{transition:background .15s,color .15s}
.bs-social:hover{background:#34e3c4;color:#062019}

/* faq row */
.bs-faq{transition:border-color .15s}
.bs-faq:hover{border-color:#cfe7e0}

/* support-page underline links */
.bs-uline:hover{color:#34e3c4}

/* upload dropzone */
.bs-dropzone{transition:border-color .15s,background .15s}
.bs-dropzone:hover{border-color:#34e3c4;background:#f3fdfa}

/* dashboard rows */
.bs-row:hover{background:rgba(120,160,220,.06)!important}

/* ---------- inputs: light form fields ---------- */
.bs-field{transition:border-color .15s,box-shadow .15s}
.bs-field:focus{border-color:#34e3c4;box-shadow:0 0 0 3px rgba(52,227,196,.18)}
/* dark dashboard fields */
.bs-field-dark:focus{border-color:#34e3c4}

/* faq chevron rotate handled inline via Alpine */

/* ============================================================
   RESPONSIVE — verbatim from the design's media queries.
   The same data-* hooks are present in the Blade markup.
   ============================================================ */
@media (max-width:1000px){
  [data-hero-grid]{grid-template-columns:1fr !important;gap:48px !important;padding-top:64px !important;padding-bottom:72px !important}
  [data-two-col]{grid-template-columns:1fr !important;gap:40px !important}
  [data-svc-grid],[data-why-grid],[data-proj-grid]{grid-template-columns:1fr 1fr !important}
  [data-process-grid]{grid-template-columns:1fr 1fr 1fr !important;gap:34px 14px !important}
  [data-process-line]{display:none !important}
  [data-dash-grid],[data-admin-grid],[data-conv-grid]{grid-template-columns:1fr !important}
  [data-dash-side]{display:flex;flex-wrap:wrap;gap:6px}
  [data-foot-grid]{grid-template-columns:1fr 1fr !important;gap:32px !important}
  [data-admin-detail]{position:static !important}
}
@media (max-width:760px){
  [data-nav-desktop],[data-login-link]{display:none !important}
  [data-burger]{display:flex !important}
  [data-svc-grid],[data-why-grid],[data-proj-grid],[data-cstat],[data-astat],[data-process-grid]{grid-template-columns:1fr 1fr !important}
  [data-status-form]{grid-template-columns:1fr !important}
  [data-admin-table]{overflow-x:auto !important}
  [data-admin-thead],[data-admin-row]{min-width:540px}
  h1{font-size:38px !important}
}
@media (max-width:520px){
  [data-svc-grid],[data-why-grid],[data-proj-grid],[data-cstat],[data-astat],[data-process-grid],[data-foot-grid]{grid-template-columns:1fr !important}
  section{padding-left:18px !important;padding-right:18px !important}
  h1{font-size:32px !important}
  h2{font-size:28px !important}
}

/* anchor scroll offset under the 72px sticky header */
section[id]{scroll-margin-top:84px}
[x-cloak]{display:none!important}

/* ============================================================
   LIGHT PANEL THEME — admin & client dashboards (white)
   ============================================================ */
.pnl-body{margin:0;background:#f5f8fc;color:#0e1b33;font-family:var(--bs-body)}
.pnl-layout{min-height:100vh}

/* sidebar */
.pnl-side{position:fixed;top:0;left:0;width:256px;height:100vh;background:#fff;border-right:1px solid #e6edf6;display:flex;flex-direction:column;z-index:60;transition:transform .2s}
.pnl-brand{display:flex;align-items:center;gap:11px;padding:20px 20px 16px;text-decoration:none}
.pnl-brand img{width:36px;height:36px;border-radius:10px}
.pnl-brand span{font-family:var(--bs-head);font-weight:700;font-size:19px;color:#0e1b33}
.pnl-navwrap{flex:1;overflow-y:auto;padding:8px 12px}
.pnl-navhead{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#9aabc6;padding:14px 12px 6px}
.pnl-link{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;font-size:14px;font-weight:600;color:#50617d;text-decoration:none;margin-bottom:2px;transition:background .14s,color .14s}
.pnl-link svg{width:18px;height:18px;flex:none;color:#9aabc6}
.pnl-link:hover{background:#f3f7fc;color:#0e1b33}
.pnl-link.active{background:#e7faf5;color:#0c9a7d}
.pnl-link.active svg{color:#12a98c}
.pnl-link .pnl-count{margin-left:auto;font-size:11px;font-weight:700;background:#eef2f8;color:#5b6b85;padding:2px 8px;border-radius:100px}
.pnl-link.active .pnl-count{background:#cdeee5;color:#0c6f5c}
.pnl-side-foot{border-top:1px solid #eef2f8;padding:12px}
.pnl-userchip{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px}
.pnl-avatar{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#34e3c4,#22c3d6);display:flex;align-items:center;justify-content:center;font-family:var(--bs-head);font-weight:800;color:#062019;font-size:13px;flex:none}

/* main + topbar */
.pnl-main{margin-left:256px;min-height:100vh;display:flex;flex-direction:column}
.pnl-top{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.85);backdrop-filter:blur(10px);border-bottom:1px solid #e9eff6;height:64px;display:flex;align-items:center;gap:14px;padding:0 26px}
.pnl-top h1{font-family:var(--bs-head);font-weight:700;font-size:19px;color:#0e1b33;margin:0}
.pnl-top .sub{font-size:12.5px;color:#7e93b8}
.pnl-burger{display:none;background:#f3f7fc;border:1px solid #e3eaf4;width:40px;height:40px;border-radius:10px;cursor:pointer;color:#0e1b33;align-items:center;justify-content:center}
.pnl-content{padding:26px;max-width:1320px;width:100%}
.pnl-overlay{display:none}

/* cards / tables / stats */
.pnl-card{background:#fff;border:1px solid #e6edf6;border-radius:16px;box-shadow:0 1px 2px rgba(14,27,51,.03)}
.pnl-card-pad{padding:22px}
.pnl-card-head{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid #eef2f8}
.pnl-card-title{font-family:var(--bs-head);font-weight:700;font-size:15.5px;color:#0e1b33}
.pnl-stat{background:#fff;border:1px solid #e6edf6;border-radius:16px;padding:18px 20px}
.pnl-stat .lbl{font-size:13px;color:#7a8aa4;display:flex;align-items:center;gap:8px;margin-bottom:10px}
.pnl-stat .ico{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center}
.pnl-stat .val{font-family:var(--bs-head);font-weight:700;font-size:28px;color:#0e1b33}
.pnl-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pnl-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pnl-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}

.pnl-table{width:100%;border-collapse:collapse}
.pnl-table thead th{text-align:left;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#9aabc6;padding:12px 20px;border-bottom:1px solid #eef2f8;background:#fafcff}
.pnl-table tbody td{padding:14px 20px;border-bottom:1px solid #f0f4f9;font-size:14px;color:#3c4d68;vertical-align:middle}
.pnl-table tbody tr{transition:background .12s}
.pnl-table tbody tr:hover{background:#fafcff}
.pnl-row-link{cursor:pointer}

/* badges (reuse status colours via inline) */
.pnl-badge{font-size:11.5px;font-weight:700;padding:4px 11px;border-radius:100px;display:inline-block;white-space:nowrap}

/* buttons */
.pnl-btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:#062019;background:linear-gradient(135deg,#34e3c4,#22c3d6);padding:10px 18px;border:none;border-radius:10px;cursor:pointer;text-decoration:none;transition:transform .15s}
.pnl-btn:hover{transform:translateY(-1px)}
.pnl-btn-sm{padding:8px 14px;font-size:13px;border-radius:9px}
.pnl-btn-ghost{background:#fff;border:1px solid #d8e1ee;color:#3c4d68}
.pnl-btn-ghost:hover{background:#f5f8fc;transform:none}
.pnl-btn-danger{background:none;border:none;color:#c0392b;font-weight:600;font-size:13px;cursor:pointer;padding:0}
.pnl-link-teal{color:#12a98c;font-weight:600;font-size:13px;text-decoration:none;cursor:pointer}

/* forms */
.pnl-label{display:block;font-size:12.5px;font-weight:600;color:#3c4d68;margin-bottom:7px}
.pnl-input,.pnl-select,.pnl-textarea{width:100%;padding:11px 13px;border:1px solid #d8e1ee;border-radius:10px;font-family:inherit;font-size:14px;color:#0e1b33;outline:none;background:#fff;transition:border-color .15s,box-shadow .15s}
.pnl-input:focus,.pnl-select:focus,.pnl-textarea:focus{border-color:#34e3c4;box-shadow:0 0 0 3px rgba(52,227,196,.16)}
.pnl-textarea{resize:vertical}
.pnl-field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.pnl-note{background:#e7faf5;border:1px solid #c4ece2;color:#0c6f5c;border-radius:12px;padding:12px 16px;font-size:13.5px;font-weight:600;margin-bottom:18px}
.pnl-err{background:#fde8e6;border:1px solid #f6c9c4;color:#c0392b;border-radius:12px;padding:12px 16px;font-size:13.5px;margin-bottom:18px}

/* responsive */
@media (max-width:900px){
  .pnl-side{transform:translateX(-100%)}
  .pnl-side.open{transform:translateX(0)}
  .pnl-main{margin-left:0}
  .pnl-burger{display:flex}
  .pnl-overlay.show{display:block;position:fixed;inset:0;background:rgba(8,24,52,.4);z-index:50}
  .pnl-grid-4{grid-template-columns:1fr 1fr}
  .pnl-grid-3{grid-template-columns:1fr}
  .pnl-grid-2{grid-template-columns:1fr}
}
@media (max-width:560px){
  .pnl-grid-4{grid-template-columns:1fr}
  .pnl-content{padding:18px}
}

/* ============================================================
   PANEL UI V2 — shared admin + client workspace
   ============================================================ */
:root{
  --pnl-accent:#20d5b5;
  --pnl-accent-strong:#0aa98d;
  --pnl-blue:#2797ff;
  --pnl-bg:#f3f7fb;
  --pnl-ink:#10203a;
  --pnl-muted:#71819a;
  --pnl-line:#e3ebf4;
  --pnl-side:#07152f;
  --pnl-side-2:#0b2146;
}
.pnl-body{background:var(--pnl-bg);color:var(--pnl-ink)}
.pnl-layout{background:radial-gradient(900px 520px at 92% -10%,rgba(32,213,181,.08),transparent 58%),var(--pnl-bg)}
.pnl-skip{position:fixed;left:16px;top:-60px;z-index:1000;background:#fff;color:#0a6f60;padding:10px 15px;border-radius:10px;box-shadow:0 10px 30px rgba(5,18,42,.2);font-weight:700;transition:top .15s}
.pnl-skip:focus{top:14px}

/* shell */
.pnl-side{width:272px;background:radial-gradient(320px 260px at 10% 0%,rgba(32,213,181,.14),transparent 65%),linear-gradient(180deg,var(--pnl-side),#081a38 68%,#061329);border-right:1px solid rgba(149,180,224,.11);box-shadow:18px 0 48px rgba(7,21,47,.08)}
.pnl-main{margin-left:272px}
.pnl-brand{padding:22px 22px 14px;color:#fff}
.pnl-brand img{width:38px;height:38px;border-radius:12px;box-shadow:0 10px 28px rgba(0,0,0,.28)}
.pnl-brand span{color:#fff!important;font-size:19px}
.pnl-workspace{margin:4px 16px 12px;padding:10px 12px;border:1px solid rgba(124,163,219,.13);background:rgba(255,255,255,.045);border-radius:12px;display:flex;align-items:center;gap:10px;color:#dce9fb}
.pnl-workspace-dot{width:8px;height:8px;border-radius:50%;background:var(--pnl-accent);box-shadow:0 0 0 5px rgba(32,213,181,.1)}
.pnl-workspace small{display:block;color:#7890b6;font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;font-weight:800;margin-bottom:2px}
.pnl-workspace strong{display:block;font-size:12.5px;font-weight:700}
.pnl-navwrap{padding:4px 14px 16px}
.pnl-navhead{font-size:10px;letter-spacing:.12em;color:#607ba7;padding:17px 11px 7px}
.pnl-link{position:relative;color:#9eb2d0;margin-bottom:4px;padding:10.5px 12px;border-radius:11px;font-size:13.5px}
.pnl-link svg{color:#7890b6;width:18px;height:18px}
.pnl-link:hover{background:rgba(255,255,255,.055);color:#fff;transform:translateX(2px)}
.pnl-link.active{background:linear-gradient(90deg,rgba(32,213,181,.17),rgba(39,151,255,.08));color:#fff;box-shadow:inset 0 0 0 1px rgba(66,227,200,.12)}
.pnl-link.active:before{content:"";position:absolute;left:-14px;top:8px;bottom:8px;width:3px;border-radius:0 4px 4px 0;background:linear-gradient(180deg,#34e3c4,#22c3d6);box-shadow:0 0 14px rgba(52,227,196,.6)}
.pnl-link.active svg{color:#55e7ce}
.pnl-count{background:rgba(255,255,255,.09)!important;color:#bcd0eb!important;min-width:23px;text-align:center}
.pnl-link.active .pnl-count{background:#29d5b7!important;color:#05221d!important}
.pnl-side-foot{border-top:1px solid rgba(139,172,220,.11);padding:12px 14px 15px}
.pnl-userchip{padding:9px;border-radius:13px;background:rgba(255,255,255,.045)}
.pnl-userchip .pnl-user-name{color:#eef5ff!important}
.pnl-userchip .pnl-user-role{color:#718bb4!important}
.pnl-avatar{background:linear-gradient(135deg,#33e0c2,#27a8ec);box-shadow:0 8px 18px rgba(32,213,181,.15)}

.pnl-top{height:76px;padding:0 30px;background:rgba(255,255,255,.86);border-bottom:1px solid rgba(218,229,241,.92);box-shadow:0 8px 30px rgba(16,32,58,.025)}
.pnl-top h1{font-size:19px;letter-spacing:-.02em;color:var(--pnl-ink)}
.pnl-top .sub{font-size:12px;color:#8392a9;margin-top:2px}
.pnl-top-actions{display:flex;align-items:center;gap:10px}
.pnl-top-site{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid var(--pnl-line);background:#fff;border-radius:10px;color:#50627d;font-size:12.5px;font-weight:700;box-shadow:0 2px 7px rgba(16,32,58,.03)}
.pnl-top-site:hover{border-color:#b9e9df;color:#087964;background:#f8fffd}
.pnl-top-avatar{display:flex;align-items:center;gap:9px;padding:5px 8px 5px 5px;border-radius:12px;background:#edf4fa;border:1px solid #e2ebf4}
.pnl-top-avatar .pnl-avatar{width:32px;height:32px;border-radius:9px;font-size:11px}
.pnl-top-avatar span{font-size:12px;color:#52647e;font-weight:700;max-width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pnl-burger{border-color:var(--pnl-line);background:#fff}
.pnl-content{padding:30px;max-width:1480px}

/* hierarchy + surfaces */
.pnl-card{border:1px solid rgba(221,231,241,.95);border-radius:18px;box-shadow:0 8px 28px rgba(16,32,58,.045);overflow:hidden}
.pnl-card-head{padding:18px 20px;border-color:#edf2f7}
.pnl-card-title{font-size:15px;letter-spacing:-.01em}
.pnl-card-kicker{font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8393ab;margin-bottom:5px}
.pnl-card-sub{font-size:12.5px;color:#8291a8;margin-top:3px}
.pnl-card-pad{padding:22px}
.pnl-stat{position:relative;overflow:hidden;border:1px solid #e0e9f3;border-radius:17px;padding:19px 20px;box-shadow:0 8px 24px rgba(16,32,58,.035);transition:transform .18s,box-shadow .18s,border-color .18s}
.pnl-stat:after{content:"";position:absolute;width:84px;height:84px;border-radius:50%;right:-30px;top:-30px;background:var(--stat-glow,rgba(32,213,181,.08));pointer-events:none}
.pnl-stat:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(16,32,58,.075);border-color:#cde4df}
.pnl-stat .lbl{font-size:12.5px;font-weight:650;color:#71819a;margin-bottom:13px}
.pnl-stat .ico{width:34px;height:34px;border-radius:10px}
.pnl-stat .val{font-size:30px;letter-spacing:-.04em}
.pnl-stat-note{font-size:11.5px;color:#96a4b7;margin-top:5px}
.pnl-grid-4{gap:18px}
.pnl-grid-2{gap:22px}

.pnl-welcome{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px;padding:25px 28px;border-radius:20px;background:radial-gradient(360px 180px at 90% 10%,rgba(52,227,196,.24),transparent 70%),linear-gradient(125deg,#0a2148,#103568);box-shadow:0 18px 42px rgba(8,33,72,.2);color:#fff}
.pnl-welcome:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(140,180,240,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(140,180,240,.055) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(90deg,transparent,#000);pointer-events:none}
.pnl-welcome-copy,.pnl-welcome-actions{position:relative;z-index:1}
.pnl-welcome-eyebrow{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#69ecd4;margin-bottom:8px}
.pnl-welcome h2{font:700 23px/1.2 var(--bs-head);margin:0 0 7px;letter-spacing:-.025em}
.pnl-welcome p{margin:0;color:#aebfdb;font-size:13.5px;line-height:1.5}
.pnl-welcome-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.pnl-welcome .pnl-btn-ghost{background:rgba(255,255,255,.075);border-color:rgba(210,230,255,.2);color:#e9f3ff}
.pnl-welcome .pnl-btn-ghost:hover{background:rgba(255,255,255,.12)}

/* controls + data */
.pnl-btn{border-radius:11px;padding:10px 17px;box-shadow:0 8px 18px rgba(23,195,164,.15);transition:transform .16s,box-shadow .16s,filter .16s}
.pnl-btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(23,195,164,.23);filter:saturate(1.05)}
.pnl-btn-ghost{box-shadow:none;border-color:#dce6f0}
.pnl-btn-ghost:hover{box-shadow:none}
.pnl-link-teal{color:#0a9b81}
.pnl-link-teal:hover{color:#06715f}
.pnl-input,.pnl-select,.pnl-textarea{border-color:#dbe5ef;border-radius:11px;padding:11.5px 13px;background:#fbfdff}
.pnl-input:hover,.pnl-select:hover,.pnl-textarea:hover{border-color:#c8d7e6}
.pnl-label{color:#52627b;font-weight:700}
.pnl-table{background:#fff}
.pnl-table thead th{padding:12px 20px;background:#f8fafc;color:#8695aa;border-color:#eaf0f6;font-size:10.5px;letter-spacing:.075em}
.pnl-table tbody td{padding:15px 20px;border-color:#eef3f7}
.pnl-table tbody tr:hover{background:#f7fbfc}
.pnl-row-link{transition:background .12s,box-shadow .12s}
.pnl-row-link:hover{box-shadow:inset 3px 0 #27cdb0}
.pnl-badge{padding:4px 10px;border-radius:8px;font-size:10.5px;letter-spacing:.015em}
.pnl-empty{padding:48px 24px;text-align:center}
.pnl-empty-icon{width:52px;height:52px;margin:0 auto 13px;border-radius:15px;background:linear-gradient(135deg,#e4faf5,#e7f2ff);color:#0ba78d;display:flex;align-items:center;justify-content:center}
.pnl-empty-title{font:700 15px var(--bs-head);color:#253752;margin-bottom:5px}
.pnl-empty-text{font-size:13px;color:#8392a7;max-width:360px;margin:0 auto 15px;line-height:1.5}
.pnl-note,.pnl-err{border-radius:12px;box-shadow:0 8px 24px rgba(16,32,58,.04)}

@media (max-width:1100px){
  .pnl-top-avatar span{display:none}
  .pnl-welcome{align-items:flex-start}
}
@media (max-width:900px){
  .pnl-side{width:272px;box-shadow:20px 0 60px rgba(3,13,31,.32)}
  .pnl-main{margin-left:0}
  .pnl-top{padding:0 20px}
  .pnl-content{padding:22px}
  .pnl-grid-2{grid-template-columns:1fr!important}
}
@media (max-width:700px){
  .pnl-top-site span,.pnl-top-avatar{display:none}
  .pnl-welcome{flex-direction:column;padding:22px}
  .pnl-welcome-actions{justify-content:flex-start}
  .pnl-card{overflow-x:auto}
  .pnl-table{min-width:650px}
  .pnl-field-row{grid-template-columns:1fr}
  .pnl-form-grid-3,.pnl-form-grid-4{grid-template-columns:1fr!important}
  .pnl-user-row{grid-template-columns:auto 1fr!important}
  .pnl-user-row>:nth-child(n+3){grid-column:2}
  .pnl-lead-row{grid-template-columns:1fr!important}
  .pnl-lead-row>:last-child{align-items:flex-start!important}
  .pnl-settings-fields,.pnl-settings-grid{grid-template-columns:1fr!important}
}
@media (max-width:520px){
  .pnl-top{height:68px;padding:0 15px}
  .pnl-top h1{font-size:17px}
  .pnl-top .sub{display:none}
  .pnl-top-site{display:none}
  .pnl-content{padding:16px}
  .pnl-welcome{border-radius:17px;margin-bottom:17px}
  .pnl-welcome h2{font-size:20px}
  .pnl-welcome-actions{width:100%}
  .pnl-welcome-actions .pnl-btn{flex:1;justify-content:center}
  .pnl-grid-4{grid-template-columns:1fr 1fr;gap:12px}
  .pnl-stat{padding:15px}
  .pnl-stat .lbl{align-items:flex-start;flex-direction:column;gap:8px}
  .pnl-stat .val{font-size:26px}
}