/* IFP Hub professional visual system — v1.41.0 */
:root{
  --pro-violet:#5b2bbf;
  --pro-violet-dark:#3f1a87;
  --pro-violet-edge:#35146f;
  --pro-ink:#211b2d;
  --pro-muted:#6d6578;
  --pro-line:#ded8e7;
  --pro-surface:#fff;
  --pro-soft:#f7f4fb;
  --pro-shadow:0 1px 2px rgba(34,19,57,.06),0 12px 30px rgba(34,19,57,.08);
  --pro-shadow-hover:0 2px 3px rgba(34,19,57,.07),0 18px 38px rgba(34,19,57,.12);
}

html{background:#f3f1f7}
body{
  color:var(--pro-ink);
  background:
    radial-gradient(circle at 86% 4%,rgba(115,73,199,.09),transparent 25rem),
    linear-gradient(180deg,#fbfafd 0,#f5f3f8 24rem,#f3f1f6 100%);
}

/* Navigation and top bar */
body>aside{
  background:
    radial-gradient(circle at 35% -8%,rgba(143,96,232,.28),transparent 18rem),
    linear-gradient(180deg,#171028 0,#21133d 58%,#28154b 100%);
  border-right:1px solid rgba(255,255,255,.07);
  box-shadow:12px 0 42px rgba(22,12,40,.13);
}
.brand img.brand-logo{box-shadow:0 3px 0 rgba(0,0,0,.22),0 12px 24px rgba(0,0,0,.24)}
body>aside nav a{
  border:1px solid transparent;
  font-weight:700;
  letter-spacing:-.01em;
}
body>aside nav a:hover{
  border-color:rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.06));
  box-shadow:0 2px 0 rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.08);
}
body>aside nav a.active{
  border-color:rgba(255,255,255,.14);
  background:linear-gradient(180deg,rgba(131,83,222,.48),rgba(91,43,191,.3));
  box-shadow:0 3px 0 rgba(8,3,17,.22),0 8px 18px rgba(8,3,17,.12),inset 0 1px 0 rgba(255,255,255,.13);
}
header{border-bottom-color:rgba(72,48,99,.12)}
header h1{font-weight:850}

/* Elevated surfaces */
.panel,.stats article,.task-stat,.chart-card,.client-card,.stock-card,.lms-course-card,.messages-shell,.form-settings,.builder-preview{
  border-color:var(--pro-line);
  background:linear-gradient(180deg,#fff 0,#fefeff 74%,#fbf9fd 100%);
  box-shadow:var(--pro-shadow);
}
.panel,.stats article,.task-stat,.chart-card,.client-card,.stock-card,.lms-course-card{
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.stats article:hover,.task-stat:hover,.chart-card:hover,.client-card:hover,.stock-card:hover,.lms-course-card:hover{
  border-color:#cbbde0;
  box-shadow:var(--pro-shadow-hover);
  transform:translateY(-2px);
}
.hero,.dashboard-intro,.procurement-hero,.inspection-intro,.employee-profile-hero,.integration-hero{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.2);
  background:
    radial-gradient(circle at 93% 10%,rgba(110,153,255,.32),transparent 18rem),
    linear-gradient(128deg,#241441 0,#5426b4 58%,#6737ca 100%);
  box-shadow:0 4px 0 #321474,0 22px 52px rgba(63,26,135,.22),inset 0 1px 0 rgba(255,255,255,.19);
}
.hero::after,.dashboard-intro::after,.procurement-hero::after,.inspection-intro::after,.integration-hero::after{
  content:"";
  position:absolute;
  right:-4rem;
  bottom:-6rem;
  width:16rem;
  height:16rem;
  border:1px solid rgba(255,255,255,.09);
  border-radius:50%;
  pointer-events:none;
}
.hero>*,.dashboard-intro>*,.procurement-hero>*,.inspection-intro>*,.integration-hero>*{position:relative;z-index:1}

/* Tactile action buttons */
.button,.primary,
button[type="submit"]:not(.secondary):not(.danger):not(.document-delete),
.box form button,
.builder-actions .primary,.empty-builder button:not(.secondary),.canvas-tabs #fieldMenuButton,
.new-chat-button,.message-composer>.primary,.inspection-submit{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  border:1px solid #4d23a3;
  border-radius:11px;
  background:linear-gradient(180deg,#7445d2 0,#5b2bbf 58%,#4a21a2 100%);
  color:#fff!important;
  text-decoration:none;
  text-shadow:0 1px 1px rgba(34,14,74,.35);
  box-shadow:0 3px 0 var(--pro-violet-edge),0 8px 18px rgba(68,28,143,.24),inset 0 1px 0 rgba(255,255,255,.28);
  transition:transform .14s ease,box-shadow .14s ease,filter .14s ease,border-color .14s ease;
}
.button:hover,.primary:hover,
button[type="submit"]:not(.secondary):not(.danger):not(.document-delete):hover,
.box form button:hover,
.builder-actions .primary:hover,.empty-builder button:not(.secondary):hover,.canvas-tabs #fieldMenuButton:hover,
.new-chat-button:hover,.message-composer>.primary:hover,.inspection-submit:hover{
  background:linear-gradient(180deg,#8050dc 0,#6330c8 58%,#4d22a7 100%);
  box-shadow:0 4px 0 var(--pro-violet-edge),0 12px 24px rgba(68,28,143,.27),inset 0 1px 0 rgba(255,255,255,.34);
  filter:saturate(1.04);
  transform:translateY(-1px);
}
.button:active,.primary:active,
button[type="submit"]:not(.secondary):not(.danger):not(.document-delete):active,
.box form button:active,
.builder-actions .primary:active,.empty-builder button:not(.secondary):active,.canvas-tabs #fieldMenuButton:active,
.new-chat-button:active,.message-composer>.primary:active,.inspection-submit:active{
  box-shadow:0 1px 0 var(--pro-violet-edge),0 4px 9px rgba(68,28,143,.2),inset 0 1px 4px rgba(32,10,72,.2);
  transform:translateY(2px);
}
.button:disabled,.primary:disabled,button[type="submit"]:disabled{
  box-shadow:0 1px 0 #a8a1b2!important;
  transform:none!important;
}

/* Secondary, light and semantic buttons */
.button.secondary,.secondary,.builder-actions button:not(.primary),.property-actions button,.messages-home,.thread-home,.back-to-chats,.camera-actions .button{
  border:1px solid #cfc4df;
  background:linear-gradient(180deg,#fff 0,#f7f4fb 62%,#eee9f5 100%);
  color:#4f278f!important;
  text-shadow:none;
  box-shadow:0 3px 0 #c4b9d3,0 7px 15px rgba(39,22,64,.11),inset 0 1px 0 #fff;
}
.button.secondary:hover,.secondary:hover,.builder-actions button:not(.primary):hover,.property-actions button:hover,.messages-home:hover,.thread-home:hover,.back-to-chats:hover,.camera-actions .button:hover{
  border-color:#b9a5d6;
  background:linear-gradient(180deg,#fff,#eee7f8);
  box-shadow:0 4px 0 #baaecd,0 10px 20px rgba(39,22,64,.13),inset 0 1px 0 #fff!important;
}
.button.danger,.document-delete,.client-delete-button,.deletion-request .button.danger{
  border:1px solid #d46a7a!important;
  background:linear-gradient(180deg,#fff7f8,#ffe6e9)!important;
  color:#a61d36!important;
  text-shadow:none;
  box-shadow:0 3px 0 #e3a2ac,0 7px 15px rgba(157,30,51,.11),inset 0 1px 0 #fff!important;
}
.button.danger:hover,.document-delete:hover,.client-delete-button:hover,.deletion-request .button.danger:hover{
  background:linear-gradient(180deg,#c53b51,#a91f37)!important;
  border-color:#951a30!important;
  color:#fff!important;
  box-shadow:0 3px 0 #781426,0 9px 18px rgba(157,30,51,.22),inset 0 1px 0 rgba(255,255,255,.2)!important;
}
.hero .button,.procurement-hero .button,.procurement-hero .procurement-new-request,.lms-hero-action{
  border-color:#e6def1!important;
  background:linear-gradient(180deg,#fff,#f5f1fa)!important;
  color:#5124a6!important;
  text-shadow:none;
  box-shadow:0 3px 0 #c9bdd8,0 10px 22px rgba(22,10,46,.24),inset 0 1px 0 #fff!important;
}
.attendance-main-action,.next-site-action{
  border:1px solid transparent;
  border-radius:12px;
  color:#fff;
  text-shadow:0 1px 1px rgba(0,0,0,.25);
  transition:transform .14s ease,box-shadow .14s ease,filter .14s ease;
}
.attendance-main-action.checkin-action{
  border-color:#06472a;
  background:linear-gradient(180deg,#137a49,#0a5734)!important;
  box-shadow:0 4px 0 #03331e,0 10px 20px rgba(5,78,45,.28),inset 0 1px 0 rgba(255,255,255,.22);
}
.attendance-main-action.checkout-action{
  border-color:#761421;
  background:linear-gradient(180deg,#b32739,#891b29)!important;
  box-shadow:0 4px 0 #59101a,0 10px 20px rgba(111,18,33,.29),inset 0 1px 0 rgba(255,255,255,.2);
}
.next-site-action{
  border-color:#4b219e;
  background:linear-gradient(180deg,#7142cc,#5829b5)!important;
  box-shadow:0 4px 0 #3b177e,0 10px 20px rgba(67,29,137,.22),inset 0 1px 0 rgba(255,255,255,.25);
}
.attendance-main-action:hover,.next-site-action:hover{filter:brightness(1.05);transform:translateY(-1px)}
.attendance-main-action:active,.next-site-action:active{box-shadow:0 1px 0 rgba(0,0,0,.35),0 4px 9px rgba(0,0,0,.16);transform:translateY(2px)}

/* Dashboard shortcuts */
.quick a,.shortcut-card{
  position:relative;
  border:1px solid #d9d1e4;
  background:linear-gradient(145deg,#fff,#f8f5fc);
  box-shadow:0 3px 0 #d5cde0,0 9px 21px rgba(35,18,60,.09),inset 0 1px 0 #fff;
  text-decoration:none!important;
}
.quick a:hover,.shortcut-card:hover{
  border-color:#bca8d8;
  box-shadow:0 4px 0 #c8bdd7,0 14px 28px rgba(35,18,60,.13),inset 0 1px 0 #fff;
  transform:translateY(-2px);
}
.quick a:active,.shortcut-card:active{box-shadow:0 1px 0 #c8bdd7,0 5px 12px rgba(35,18,60,.1);transform:translateY(1px)}
.quick a *,.shortcut-card *{text-decoration:none!important}

/* Form controls and data presentation */
input,select,textarea{
  border-color:#d6cfdf;
  background:linear-gradient(180deg,#fcfbfd,#fff 35%);
  box-shadow:inset 0 1px 2px rgba(35,18,60,.055),0 1px 0 #fff;
}
input:focus,select:focus,textarea:focus{
  border-color:#7141c8;
  background:#fff;
  box-shadow:0 0 0 4px rgba(113,65,200,.14),inset 0 1px 2px rgba(35,18,60,.04);
}
.table-wrap{border-color:#dcd5e5;box-shadow:0 6px 18px rgba(33,20,62,.05)}
th{background:linear-gradient(180deg,#faf8fc,#f2eef7);color:#5d5269;font-weight:850}
tbody tr:hover{background:#faf7ff}
.pill,.status,.attendance-mode,.procurement-status,.inspection-result{
  border:1px solid rgba(83,42,156,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
dialog,.field-picker-dialog,.template-dialog{
  border:1px solid #ded6e8;
  box-shadow:0 5px 0 rgba(41,20,78,.1),0 34px 90px rgba(23,10,45,.36);
}
.notification-trigger{
  border-color:#d4ccdf;
  background:linear-gradient(180deg,#fff,#f3eff8);
  box-shadow:0 3px 0 #c8bfd3,0 9px 19px rgba(40,23,68,.11),inset 0 1px 0 #fff;
}
.notification-trigger:hover{box-shadow:0 4px 0 #bfb2cf,0 12px 23px rgba(40,23,68,.15),inset 0 1px 0 #fff;transform:translateY(-1px)}
.notification-trigger:active{box-shadow:0 1px 0 #bfb2cf,0 4px 10px rgba(40,23,68,.1);transform:translateY(2px)}

/* Form builder */
.builder-body{background:linear-gradient(180deg,#f0eef4,#eae7ef)}
.builder-header{border-bottom-color:#d8d0e1;box-shadow:0 4px 0 rgba(52,28,86,.05),0 14px 30px rgba(35,18,60,.08)}
.canvas-tabs{border-color:#d7cfdf;background:rgba(240,237,244,.93);box-shadow:0 3px 0 #d8d1df,0 10px 24px rgba(35,18,60,.08)}
.canvas-tabs button.active,.device-switch button.active{box-shadow:0 2px 0 #d1c7dc,0 6px 14px rgba(35,18,60,.09),inset 0 1px 0 #fff}
.drop-zone{border-color:#cdbfdd;background-color:#f9f7fc}
.canvas-field,.palette-field,.template-grid button{
  border-color:#d9d1e3;
  box-shadow:0 3px 0 #d7d0df,0 8px 18px rgba(35,18,60,.07),inset 0 1px 0 #fff;
}
.canvas-field:hover,.palette-field:hover,.template-grid button:hover{
  border-color:#aa91ce;
  box-shadow:0 4px 0 #c5b9d3,0 13px 25px rgba(35,18,60,.12),inset 0 1px 0 #fff;
}
.canvas-field.selected{border-color:#6933c5;box-shadow:0 3px 0 #51249f,0 12px 26px rgba(82,36,159,.18),inset 0 1px 0 #fff}

/* Sign-in and installer */
.login{background:radial-gradient(circle at 80% 8%,#d8c8f5 0,transparent 34%),linear-gradient(145deg,#faf8fd,#ece8f2)}
.login-card,.box{
  border:1px solid #ddd5e7;
  background:linear-gradient(180deg,#fff,#fcfafd);
  box-shadow:0 5px 0 rgba(67,37,101,.08),0 30px 78px rgba(44,24,75,.17);
}

@media(max-width:900px){
  body>aside{box-shadow:18px 0 58px rgba(18,8,34,.38)}
  header{background:rgba(249,248,251,.9);box-shadow:0 8px 24px rgba(35,18,60,.07)}
  .hero,.dashboard-intro,.procurement-hero,.inspection-intro,.employee-profile-hero,.integration-hero{box-shadow:0 3px 0 #321474,0 16px 36px rgba(63,26,135,.18),inset 0 1px 0 rgba(255,255,255,.17)}
}
@media(max-width:520px){
  .panel,.stats article,.task-stat,.chart-card,.client-card,.stock-card,.lms-course-card{box-shadow:0 1px 2px rgba(34,19,57,.06),0 7px 18px rgba(34,19,57,.07)}
  .button,.primary,button[type="submit"]:not(.secondary):not(.danger):not(.document-delete){box-shadow:0 3px 0 var(--pro-violet-edge),0 6px 13px rgba(68,28,143,.2),inset 0 1px 0 rgba(255,255,255,.28)}
  .quick a,.shortcut-card{box-shadow:0 3px 0 #d5cde0,0 7px 14px rgba(35,18,60,.08),inset 0 1px 0 #fff}
}
@media(prefers-reduced-motion:reduce){
  .button,.primary,button,.panel,.stats article,.task-stat,.chart-card,.client-card,.stock-card,.lms-course-card,.quick a,.shortcut-card,.canvas-field,.palette-field{transition:none!important}
}
