@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@600;700;800&display=swap');

/* AuraMind PRO v13 — Premium Software UI v2
   Presentation-only override. No functional selectors, routes, permissions or JS behavior changed. */

:root{
  --am-bg:#f2f6fd;
  --am-surface:#ffffff;
  --am-surface-soft:#f8fbff;
  --am-ink:#12213f;
  --am-muted:#6f7f9a;
  --am-line:#dbe5f2;
  --am-blue:#2377f2;
  --am-indigo:#6558e8;
  --am-cyan:#18a7d9;
  --am-teal:#13a97c;
  --am-green:#16a76f;
  --am-amber:#e99a20;
  --am-rose:#df5b73;
  --am-violet:#8259dc;
  --am-shadow:0 14px 36px rgba(32,65,115,.09);
  --am-shadow-strong:0 20px 55px rgba(32,65,115,.14);
  --am-radius:18px;
}

html{background:var(--am-bg)}
body{
  font-family:'Inter','Segoe UI Variable Text','Aptos','Segoe UI',system-ui,sans-serif!important;
  color:var(--am-ink);
  background:
    radial-gradient(circle at 15% 8%,rgba(35,119,242,.075),transparent 27%),
    radial-gradient(circle at 88% 14%,rgba(101,88,232,.07),transparent 25%),
    linear-gradient(180deg,#f8fbff 0%,#f1f6fd 100%)!important;
}
h1,h2,h3,h4,h5,h6,.portal-brand,.metric-value,.stat-value,.form-heading h2,.story-copy h1{
  font-family:'Plus Jakarta Sans','Segoe UI Variable Display','Segoe UI',sans-serif!important;
  letter-spacing:-.025em;
}
button,input,select,textarea{font-family:inherit}

/* ===== Software shell ===== */
.portal-side{
  background:
    radial-gradient(circle at 30% -10%,rgba(72,121,255,.28),transparent 36%),
    linear-gradient(180deg,#0f2349 0%,#132d58 52%,#102543 100%)!important;
  border-right:1px solid rgba(255,255,255,.07)!important;
  box-shadow:12px 0 40px rgba(11,31,67,.16)!important;
}
.portal-brand{color:#fff!important}
.portal-brand-mark{
  background:linear-gradient(145deg,#44a8ff,#7964f5)!important;
  box-shadow:0 10px 28px rgba(61,126,255,.38)!important;
}
.workspace-chip{
  background:linear-gradient(135deg,rgba(65,130,255,.18),rgba(123,89,235,.17))!important;
  border-color:rgba(174,202,255,.15)!important;
  color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.workspace-chip small{color:#9fb5d9!important}
.workspace-chip strong{color:#f8fbff!important}
.portal-nav-label{color:#7894bf!important}
.portal-nav a{
  color:#b8c8e2!important;
  border:1px solid transparent;
  position:relative;
  overflow:hidden;
}
.portal-nav a:hover{
  color:#fff!important;
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(255,255,255,.06);
  transform:translateX(2px);
}
.portal-nav a.active{
  color:#fff!important;
  background:linear-gradient(100deg,rgba(48,126,255,.26),rgba(112,79,236,.20))!important;
  border-color:rgba(126,173,255,.17)!important;
  box-shadow:inset 3px 0 #55a9ff,0 8px 24px rgba(4,20,51,.16)!important;
}
.nav-ico{
  width:26px!important;height:26px!important;border-radius:8px!important;
  background:rgba(255,255,255,.075)!important;
  color:#a9c7f3!important;
  border:1px solid rgba(255,255,255,.06);
  font-size:10px!important;font-weight:800;
}
.portal-nav a.active .nav-ico{
  color:#fff!important;
  background:linear-gradient(145deg,#278bf7,#725bec)!important;
  border-color:transparent!important;
  box-shadow:0 5px 14px rgba(54,114,241,.28);
}
.portal-side-footer{color:#7992b7!important;border-top-color:rgba(255,255,255,.08)!important}

.portal-topbar{
  background:rgba(250,252,255,.91)!important;
  border-bottom:1px solid #dbe6f4!important;
  box-shadow:0 7px 24px rgba(34,65,111,.055);
}
.portal-topbar:after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:linear-gradient(90deg,#2684f5 0%,#6d5be8 38%,#22acd6 68%,transparent 100%);
  opacity:.68;
}
.portal-breadcrumb small{color:#8595af!important}
.portal-breadcrumb strong{color:#142745!important;font-weight:800!important}
.role-chip{
  background:linear-gradient(135deg,#eaf3ff,#f0edff)!important;
  color:#455d93!important;border-color:#d6e2f3!important;
}
.avatar{
  background:linear-gradient(145deg,#2c88f4,#735de7)!important;
  color:#fff!important;border-color:#fff!important;
  box-shadow:0 7px 18px rgba(59,103,205,.23)!important;
}

/* ===== Page composition ===== */
.portal-content{padding:30px!important}
.page-head{
  padding:25px 26px!important;
  background:
    radial-gradient(circle at 91% 20%,rgba(107,86,232,.13),transparent 24%),
    radial-gradient(circle at 75% 130%,rgba(28,168,215,.11),transparent 30%),
    linear-gradient(115deg,#ffffff 0%,#f6f9ff 56%,#f2f4ff 100%)!important;
  border:1px solid #d7e4f3!important;
  box-shadow:var(--am-shadow)!important;
}
.page-head:before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(180deg,#2585f3,#6c5be8,#22a8d8);
}
.page-head h1{color:#102442!important;font-weight:800!important}
.page-head p{color:#71819a!important}
.eyebrow{color:#5277ac!important}

/* ===== Colorful software cards ===== */
.panel,.card,.box,.prod-panel,.fin-panel,.fs-panel,.pp-panel{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%)!important;
  border:1px solid #dce6f2!important;
  border-radius:var(--am-radius)!important;
  box-shadow:var(--am-shadow)!important;
}
.panel,.card,.prod-panel,.fin-panel,.fs-panel,.pp-panel{position:relative;overflow:hidden}
.panel:before,.prod-panel:before,.fin-panel:before,.fs-panel:before,.pp-panel:before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,#2684f5,#6d5be8 45%,#20acd4 72%,#20b982);
  opacity:.76;
}
.panel-head h2,.prod-panel-head h2,.fin-head h2,.fs-head h2,.pp-head h2{color:#172a49!important}

.metric-grid,.stat-grid,.cp2-metrics{gap:15px!important}
.metric-card,.stat-card,.status-card,.prod-kpi,.fin-kpi,.pay-kpi,.pr-kpi,.ai-kpi{
  border:1px solid #dce6f2!important;
  box-shadow:0 10px 27px rgba(37,69,116,.075)!important;
  background:linear-gradient(150deg,#fff 0%,#f9fbff 100%)!important;
  position:relative;overflow:hidden;
}
.metric-card:after,.stat-card:after,.prod-kpi:after,.fin-kpi:after,.pay-kpi:after,.pr-kpi:after,.ai-kpi:after{
  content:"";position:absolute;width:92px;height:92px;border-radius:50%;right:-30px;top:-35px;
  background:radial-gradient(circle,rgba(52,132,244,.12),transparent 68%);pointer-events:none;
}
.metric-grid>*:nth-child(4n+1),.stat-grid>*:nth-child(4n+1){border-top:3px solid #2d83f2!important}
.metric-grid>*:nth-child(4n+2),.stat-grid>*:nth-child(4n+2){border-top:3px solid #705de8!important}
.metric-grid>*:nth-child(4n+3),.stat-grid>*:nth-child(4n+3){border-top:3px solid #19a985!important}
.metric-grid>*:nth-child(4n),.stat-grid>*:nth-child(4n){border-top:3px solid #e99a20!important}
.metric-icon{
  background:linear-gradient(145deg,#e8f3ff,#edf0ff)!important;
  border:1px solid #d9e7fa;color:#3771c8!important;
  box-shadow:inset 0 1px 0 #fff;
}
.metric-value{color:#172a4d!important}

/* module tiles */
.module-tile{
  background:linear-gradient(145deg,#fbfdff,#f4f8fe)!important;
  border-color:#dce7f3!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.module-tile:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(32,72,126,.08);border-color:#bfd4ef!important}
.module-tile.enabled{
  background:linear-gradient(145deg,#f1fff9,#edf9ff)!important;
  border-color:#bfe8d7!important;
}

/* ===== Tables ===== */
.table-wrap{
  border-color:#d9e5f2!important;border-radius:15px!important;
  box-shadow:0 7px 22px rgba(36,69,117,.05);overflow:auto;
}
.table-wrap th{
  background:linear-gradient(180deg,#f6f9fd,#eef4fb)!important;
  color:#587094!important;font-weight:800!important;
  border-bottom:1px solid #dce6f2;
}
.table-wrap td{color:#354d70!important}
.table-wrap tbody tr:nth-child(even) td{background:#fcfdff}
.table-wrap tr:hover td{background:#f4f8ff!important}
.table-meta{color:#7688a4!important}

/* ===== Forms ===== */
.field input,.field select,.field textarea,.live-field input,.live-field select,
.input-wrap input,.input-wrap select,input[type="text"],input[type="email"],input[type="password"],
input[type="number"],input[type="date"],input[type="datetime-local"],select,textarea{
  border-color:#d3e0ef!important;
  background:#fbfdff!important;
  color:#1b3153!important;
  border-radius:11px!important;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.field input:focus,.field select:focus,.field textarea:focus,.live-field input:focus,.live-field select:focus,
.input-wrap input:focus,input:focus,select:focus,textarea:focus{
  border-color:#77a9ee!important;
  background:#fff!important;
  box-shadow:0 0 0 4px rgba(39,121,235,.105)!important;
  outline:none!important;
}
.field>span,.field label,.live-field>span,label{color:#516987}

/* ===== Buttons ===== */
.primary-btn,.primary-action,.secondary-action,.btn.primary{
  background:linear-gradient(135deg,#1d7df2 0%,#5868ed 56%,#7258e6 100%)!important;
  border-color:transparent!important;color:#fff!important;
  box-shadow:0 9px 22px rgba(53,100,220,.22)!important;
}
.primary-btn:hover,.primary-action:hover,.secondary-action:hover,.btn.primary:hover{
  transform:translateY(-1px);
  box-shadow:0 13px 28px rgba(53,100,220,.28)!important;
}
.ghost-btn,.btn:not(.primary){
  background:#fff!important;border-color:#d5e1ef!important;color:#3d587e!important;
}
.ghost-btn:hover,.btn:not(.primary):hover{
  color:#176bdc!important;border-color:#abc8ee!important;background:#f7fbff!important;
}
.danger-btn{background:#fff4f6!important;border-color:#f4ced5!important;color:#bd4254!important}

/* ===== Status language ===== */
.badge,.pill,.code-pill,.live-pill{
  border-radius:999px!important;font-weight:800!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}
.badge.green,.green{background:#e8faf3!important;color:#0d875d!important;border-color:#c2ead8!important}
.badge.blue,.blue{background:#eaf3ff!important;color:#1d65c8!important;border-color:#cfE1f8!important}
.badge.amber,.amber{background:#fff6e4!important;color:#9a6813!important;border-color:#f2dda9!important}
.badge.danger,.danger{background:#fff0f3!important;color:#b43d51!important;border-color:#f2ccd4!important}

/* ===== Empty states & notices ===== */
.empty,.empty-state{
  border:1px dashed #cad9ea!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,#fbfdff,#f5f9fe)!important;
  color:#72839d!important;
}
.empty-state-icon{
  background:linear-gradient(145deg,#e9f4ff,#efedff)!important;
  color:#5375c2!important;
}
.notice,.form-success{
  background:linear-gradient(135deg,#edfbf5,#f2fffb)!important;
  border-color:#bee9d7!important;color:#126f50!important;
}
.error-box,.form-errors{background:#fff2f4!important;border-color:#f2cdd4!important;color:#9f3a4b!important}
.alert-info{background:linear-gradient(135deg,#eef6ff,#f5f3ff)!important;border-color:#cfdef2!important}
.alert-warning{background:#fff7e8!important;border-color:#f2dda9!important}

/* ===== Auth / request access ===== */
.auth-story,.access-story{
  background:
    radial-gradient(circle at 74% 16%,rgba(64,185,255,.27),transparent 28%),
    radial-gradient(circle at 15% 86%,rgba(131,89,239,.25),transparent 33%),
    linear-gradient(145deg,#0c234b 0%,#17487a 50%,#4d55b5 100%)!important;
}
.auth-panel,.access-panel{
  background:
    radial-gradient(circle at 78% 12%,rgba(90,130,255,.10),transparent 25%),
    radial-gradient(circle at 14% 84%,rgba(28,176,205,.08),transparent 28%),
    #f7faff!important;
}
.form-shell,.auth-card,.access-form{
  border-color:#d9e5f2!important;
  box-shadow:0 25px 70px rgba(30,67,122,.13)!important;
}
.form-shell{
  position:relative;overflow:hidden;
}
.form-shell:before{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg,#2385f2,#6f5bea,#20abd5,#1bb785);
}
.switch-auth{
  padding:10px 12px;border-radius:10px;background:#f6f9fe;border:1px solid #e3ebf5;
}
.switch-auth a{color:#176ee0!important}

/* ===== Generic module-specific surfaces ===== */
[class*="-kpi"],[class*="metric"],[class*="stat-card"]{transition:transform .16s ease,box-shadow .16s ease}
[class*="-kpi"]:hover,.metric-card:hover,.stat-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(36,69,117,.11)!important}
[class*="-panel"]{border-radius:var(--am-radius)}
[class*="-head"] h2,[class*="-head"] h3{font-family:'Plus Jakarta Sans','Segoe UI',sans-serif}

/* Live monitoring surfaces retain dark operational context but get software polish. */
.live-monitor-shell,.live-shell,.screen-browser,.screen-card{
  box-shadow:0 15px 38px rgba(15,39,77,.12)!important;
}
.screen-card,.screen-browser{border-radius:16px!important;overflow:hidden}

/* Pagination */
.pagination-shell{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.pagination-shell a,.pagination-shell span{
  min-width:34px;min-height:34px;display:inline-grid;place-items:center;
  border:1px solid #d8e3f0;border-radius:9px;background:#fff;color:#476184;
}

/* subtle motion, disabled for reduced-motion users */
@media (prefers-reduced-motion:no-preference){
  .panel,.metric-card,.stat-card,.module-tile,.primary-btn,.ghost-btn{transition:all .17s ease}
}

/* Responsive refinements */
@media(max-width:900px){
  .portal-content{padding:20px!important}
  .page-head{padding:20px!important}
  .top-actions .role-chip{display:none}
}
@media(max-width:600px){
  .portal-content{padding:14px!important}
  .page-head{border-radius:15px!important}
  .panel{border-radius:15px!important}
}
