/* Retter-Portal v1.3.90
   Portal visual language refresh: landing-page DNA transferred carefully into the authenticated UI.
   Intentionally restrained: depth, material, motion and accent light — no playful gimmicks. */

/* --------------------------------------------------------------------------
   Landing login accent: calmer, cooler and less red
   -------------------------------------------------------------------------- */
.rp26-site .rp90-login-card::before{
  height:2px!important;
  opacity:.78!important;
  background:linear-gradient(90deg,
    #64748b 0%,
    #6366f1 28%,
    #8b5cf6 50%,
    #3b82f6 74%,
    #22d3ee 100%)!important;
  background-size:180% 100%!important;
  animation:rp1390LoginLine 9s ease-in-out infinite alternate!important;
}
@keyframes rp1390LoginLine{from{background-position:0 0}to{background-position:100% 0}}

/* --------------------------------------------------------------------------
   Shared authenticated portal materials
   -------------------------------------------------------------------------- */
html body:not(.admin-surface) .app-shell .main .content{
  --rp1390-line:color-mix(in srgb,var(--line-soft) 86%,transparent);
  --rp1390-glow-blue:rgba(59,130,246,.08);
  --rp1390-glow-violet:rgba(139,92,246,.055);
  --rp1390-glow-red:rgba(225,29,72,.055);
}

html body:not(.admin-surface) .app-shell .main .content :is(.page-hero,.rp55-dash-hero){
  isolation:isolate;
  border-color:var(--rp1390-line)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 24px 70px rgba(2,8,23,.16)!important;
}
html body:not(.admin-surface) .app-shell .main .content :is(.page-hero,.rp55-dash-hero)::before{
  opacity:.72;
}
html body:not(.admin-surface) .app-shell .main .content .card{
  position:relative;
  border-color:var(--rp1390-line)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 14px 42px rgba(2,8,23,.095)!important;
}
/* Keep form fields functional and sharp; only modernise focus/contrast. */
html body:not(.admin-surface) .app-shell .main .content :is(input,select,textarea){
  transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease!important;
}
html body:not(.admin-surface) .app-shell .main .content :is(input,select,textarea):focus{
  border-color:color-mix(in srgb,#60a5fa 48%,var(--line-soft))!important;
  box-shadow:0 0 0 3px rgba(59,130,246,.085)!important;
}

/* Buttons: clean tactile response instead of large effects. */
html body:not(.admin-surface) .app-shell .main .content .btn{
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease!important;
}
@media(hover:hover){
  html body:not(.admin-surface) .app-shell .main .content .btn:hover{
    transform:translateY(-1px);
  }
  html body:not(.admin-surface) .app-shell .main .content .btn.primary:hover{
    box-shadow:0 12px 30px rgba(225,29,72,.17)!important;
  }
}

/* --------------------------------------------------------------------------
   Dashboard: same visual language as landing, but intentionally operational
   -------------------------------------------------------------------------- */
html body:not(.admin-surface) .rp55-dashboard{
  gap:20px!important;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-dash-hero{
  background:
    radial-gradient(circle at 8% 12%,rgba(225,29,72,.11),transparent 31%),
    radial-gradient(circle at 88% 4%,rgba(59,130,246,.12),transparent 34%),
    linear-gradient(135deg,#0f1b2f 0%,#101d31 60%,#111827 100%)!important;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-dash-hero::after{
  opacity:.20!important;
  background-size:64px 64px!important;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-dash-copy h1{
  letter-spacing:-.055em!important;
  text-wrap:balance;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-dash-tags span{
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,255,255,.095)!important;
  backdrop-filter:blur(8px);
}

html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-grid{
  gap:12px!important;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card{
  min-height:136px!important;
  overflow:hidden;
  border-radius:22px!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card::before{
  inset:0 auto auto 0!important;
  width:100%!important;
  height:3px!important;
  opacity:.85;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card.red::before{background:linear-gradient(90deg,#e11d48,#fb7185)!important}
html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card.blue::before{background:linear-gradient(90deg,#2563eb,#60a5fa)!important}
html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card.teal::before{background:linear-gradient(90deg,#0f766e,#2dd4bf)!important}
html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card.amber::before{background:linear-gradient(90deg,#b45309,#f59e0b)!important}
html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card.slate::before{background:linear-gradient(90deg,#475569,#94a3b8)!important}
html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card strong{
  margin-top:14px!important;
  font-variant-numeric:tabular-nums;
}
@media(hover:hover){
  html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card:hover{
    transform:translateY(-2px);
    border-color:color-mix(in srgb,#60a5fa 20%,var(--line-soft))!important;
    box-shadow:0 20px 50px rgba(2,8,23,.14)!important;
  }
}

html body:not(.admin-surface) .rp55-dashboard :is(.rp55-focus-grid article,.rp55-own-metrics article){
  border-radius:17px!important;
  transition:border-color .18s ease,background .18s ease!important;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-priority-list a,
html body:not(.admin-surface) .rp55-dashboard .rp55-timeline-list .timeline-item{
  border-radius:16px!important;
  transition:transform .16s ease,border-color .16s ease,background .16s ease!important;
}
html body:not(.admin-surface) .rp55-dashboard .rp55-priority-list i{
  width:5px!important;
  height:38px!important;
  background:linear-gradient(180deg,#fb7185 0%,#8b5cf6 48%,#60a5fa 100%)!important;
}
@media(hover:hover){
  html body:not(.admin-surface) .rp55-dashboard :is(.rp55-priority-list a,.rp55-timeline-list .timeline-item):hover{
    transform:translateY(-1px);
    border-color:color-mix(in srgb,#60a5fa 18%,var(--line-soft))!important;
  }
}

/* Notification strip gets the same restrained atmospheric depth. */
html body:not(.admin-surface) .dashboard-notification-strip{
  background:
    linear-gradient(90deg,rgba(225,29,72,.075),rgba(99,102,241,.055) 48%,rgba(59,130,246,.07))!important;
  border-color:rgba(225,29,72,.25)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 12px 34px rgba(2,8,23,.08)!important;
}

/* Tables are operational UI: make hierarchy clearer, never flashy. */
html body:not(.admin-surface) .app-shell .main .content .table-wrap{
  border-color:var(--rp1390-line)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;
}
html body:not(.admin-surface) .app-shell .main .content table thead th{
  letter-spacing:.085em!important;
}
html body:not(.admin-surface) .app-shell .main .content table tbody tr{
  transition:background-color .14s ease!important;
}
@media(hover:hover){
  html body:not(.admin-surface) .app-shell .main .content table tbody tr:hover{
    background:color-mix(in srgb,#60a5fa 3.5%,transparent)!important;
  }
}

/* Section heads: compact modern hierarchy without changing semantics. */
html body:not(.admin-surface) .app-shell .main .content .card-head{
  gap:14px;
}
html body:not(.admin-surface) .app-shell .main .content .card-head h2{
  letter-spacing:-.025em;
}
html body:not(.admin-surface) .app-shell .main .content .eyebrow{
  letter-spacing:.14em!important;
}

/* Light mode uses the same geometry/material language, not different sizing. */
html body[data-theme="light"]:not(.admin-surface) .app-shell .main .content{
  --rp1390-line:rgba(148,163,184,.28);
  --rp1390-glow-blue:rgba(59,130,246,.065);
  --rp1390-glow-violet:rgba(139,92,246,.035);
  --rp1390-glow-red:rgba(225,29,72,.035);
}
html body[data-theme="light"]:not(.admin-surface) .app-shell .main .content .card{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 14px 36px rgba(71,85,105,.075)!important;
}
html body[data-theme="light"]:not(.admin-surface) .rp55-dashboard .rp55-dash-hero{
  background:
    radial-gradient(circle at 8% 12%,rgba(225,29,72,.045),transparent 31%),
    radial-gradient(circle at 88% 4%,rgba(59,130,246,.055),transparent 34%),
    linear-gradient(135deg,#ffffff 0%,#f8fafc 58%,#f1f5f9 100%)!important;
  color:#0f172a!important;
}
html body[data-theme="light"]:not(.admin-surface) .rp55-dashboard .rp55-dash-copy h1{color:#0f172a!important}
html body[data-theme="light"]:not(.admin-surface) .rp55-dashboard .rp55-dash-copy .muted{color:#52647b!important}
html body[data-theme="light"]:not(.admin-surface) .rp55-dashboard .rp55-dash-tags span{
  background:rgba(255,255,255,.78)!important;
  border-color:rgba(148,163,184,.26)!important;
  color:#334155!important;
}

/* Minimal entrance motion: only one small material settling movement. */
@media(prefers-reduced-motion:no-preference){
  html body:not(.admin-surface) .app-shell .main .content > :is(.rp55-dashboard,.page-hero){
    animation:rp1390PortalIn .28s cubic-bezier(.2,.8,.2,1) both;
  }
  @keyframes rp1390PortalIn{
    from{opacity:.92;transform:translateY(5px)}
    to{opacity:1;transform:none}
  }
}

/* Tablet/mobile: keep geometry stable and disable decorative lift where touch dominates. */
@media(max-width:900px){
  html body:not(.admin-surface) .rp55-dashboard{gap:16px!important}
  html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card{min-height:124px!important}
  html body:not(.admin-surface) .app-shell .main .content .card{
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 10px 28px rgba(2,8,23,.07)!important;
  }
}
@media(max-width:600px){
  html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card::before{height:2px!important}
  html body:not(.admin-surface) .rp55-dashboard .rp55-kpi-card{border-radius:20px!important}
  html body:not(.admin-surface) .app-shell .main .content :is(.page-hero,.card){
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 8px 22px rgba(2,8,23,.06)!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .rp26-site .rp90-login-card::before{animation:none!important}
  html body:not(.admin-surface) .app-shell .main .content *,
  html body:not(.admin-surface) .app-shell .main .content *::before,
  html body:not(.admin-surface) .app-shell .main .content *::after{
    scroll-behavior:auto!important;
  }
}
