/* =========================================================================
   portal.css :: the agency portal in the main site's Ridgeline design.
   Added 2026-10-07.

   WHAT IT IS. The same visual system as https://www.anjedudc.com: a pale
   mist ground, quiet white tiles, Inter headings over Open Sans text, a deep
   ink panel with contour lines (here the sidebar), layered ridges, and a
   small ridge mark over page titles.

   COLOR. Light wears the logo TEAL, dark wears the sky BLUE. No blue in
   light, no teal in dark. In dark, nothing but text is light.

   THE SWITCH. Every rule is gated on html.pt, which an inline script in the
   layout adds before any CSS applies. Remove that class (or this file) and
   the portal returns to plain AdminLTE. Dark mode is html[data-theme="dark"],
   stored in localStorage under eco_theme, the same key the main site uses.

   SPECIFICITY. The layout loads AdminLTE plus two Bootstrap builds, several
   with !important. Rules here start `html.pt body` and use !important only
   where an existing !important rule has to be beaten.
   ========================================================================= */

/* ---------- Fonts (self-hosted, same files as the main site) ---------- */
@font-face{font-family:'Inter';font-style:normal;font-weight:500 800;font-display:swap;src:url('fonts/inter-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:500 800;font-display:swap;src:url('fonts/inter-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('fonts/open-sans-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('fonts/open-sans-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- Tokens (values from the main site's ridgeline.css) -------- */
html.pt{
  --pt-head:"Inter",system-ui,-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif;
  --pt-text:"Open Sans",system-ui,-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif;
  --pt-ground:#eef4f3; --pt-mist:#e1ecea; --pt-tile:#ffffff; --pt-field:#ffffff;
  --pt-ink:#12302f; --pt-body:#35504f; --pt-muted:#56706e;
  --pt-accent:#1c6d73; --pt-accent-2:#2fa3a9; --pt-accent-soft:rgba(28,109,115,.10); --pt-accent-ink:#ffffff;
  --pt-line:#c9dcd9; --pt-line-soft:rgba(18,48,47,.09);
  --pt-panel:#12302f; --pt-panel-2:#0c2322; --pt-panel-ink:#eaf5f3; --pt-panel-muted:#b9d3cf;
  --pt-panel-btn:#7fd6cf; --pt-panel-btn-ink:#0b1f1e;
  --pt-hot:linear-gradient(145deg,#1c6d73 0%,#124a4f 100%); --pt-hot-ink:#eaf6f5; --pt-hot-muted:#d6ede9;
  --pt-ok:#1f7a4d; --pt-ok-soft:rgba(31,122,77,.11);
  --pt-warn:#9a5b00; --pt-warn-soft:rgba(176,108,0,.12);
  --pt-bad:#b3261e; --pt-bad-soft:rgba(179,38,30,.10); --pt-bad-ink:#ffffff;
  --pt-lift:0 1px 2px rgba(18,48,47,.05);
  --pt-lift-hover:0 22px 40px -24px rgba(18,48,47,.38);
  --pt-radius:16px; --pt-radius-sm:10px;
  --pt-ridges:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'><path fill='%23d3e5e2' d='M0 70 L120 40 L230 64 L360 22 L480 58 L610 30 L740 62 L880 26 L1010 60 L1120 36 L1200 50 L1200 120 L0 120Z'/><path fill='%23c0d9d5' d='M0 92 L150 66 L300 88 L450 58 L600 86 L760 60 L920 90 L1060 64 L1200 84 L1200 120 L0 120Z'/><path fill='%23eef4f3' d='M0 108 L200 92 L420 110 L640 94 L860 112 L1060 96 L1200 106 L1200 120 L0 120Z'/></svg>");
  --pt-glyph:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 16'><path d='M1.5 14.5 L10 4 L16 10.5 L22.5 2 L32.5 14.5' fill='none' stroke='black' stroke-width='2.2' stroke-linejoin='round' stroke-linecap='round'/></svg>");
  --pt-contour:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 520 320' fill='none' stroke='white' stroke-opacity='.13' stroke-width='1.4'><path d='M20 250 C120 170 220 210 300 140 S460 90 510 40'/><path d='M40 285 C140 205 240 245 320 175 S480 125 520 80'/><path d='M0 215 C100 135 200 175 280 105 S440 55 500 5'/><path d='M70 315 C170 240 270 280 350 210 S500 160 530 120'/><path d='M-10 180 C90 100 190 140 260 70 S420 20 490 -30'/></svg>");
  --pt-panel-ridges:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'><path fill='%23ffffff' fill-opacity='.05' d='M0 70 L120 40 L230 64 L360 22 L480 58 L610 30 L740 62 L880 26 L1010 60 L1120 36 L1200 50 L1200 120 L0 120Z'/><path fill='%23ffffff' fill-opacity='.05' d='M0 92 L150 66 L300 88 L450 58 L600 86 L760 60 L920 90 L1060 64 L1200 84 L1200 120 L0 120Z'/></svg>");
  color-scheme:light;
}
html.pt[data-theme="dark"]{
  --pt-ground:#0c1a24; --pt-mist:#10222f; --pt-tile:#112331; --pt-field:#0e1f2b;
  --pt-ink:#eaf3fa; --pt-body:#bfd0de; --pt-muted:#8ea5b8;
  --pt-accent:#7ec8ff; --pt-accent-2:#b5dcfa; --pt-accent-soft:rgba(126,200,255,.12); --pt-accent-ink:#0b1a26;
  --pt-line:#223a4e; --pt-line-soft:rgba(126,200,255,.11);
  --pt-panel:#15304a; --pt-panel-2:#0e2233; --pt-panel-ink:#eaf3fa; --pt-panel-muted:#a9c2d6;
  --pt-panel-btn:#7ec8ff; --pt-panel-btn-ink:#0b1a26;
  --pt-hot:linear-gradient(145deg,#2b6aa0 0%,#16324d 100%); --pt-hot-ink:#eef5fb; --pt-hot-muted:#e0ecf7;
  --pt-ok:#7fd8a6; --pt-ok-soft:rgba(127,216,166,.12);
  --pt-warn:#f2c46d; --pt-warn-soft:rgba(242,196,109,.12);
  --pt-bad:#ff9b92; --pt-bad-soft:rgba(255,155,146,.12); --pt-bad-ink:#2a0c09;
  --pt-lift:0 0 0 1px rgba(126,200,255,.06),0 20px 40px -28px rgba(0,0,0,.85);
  --pt-lift-hover:0 0 0 1px rgba(126,200,255,.16),0 26px 46px -24px rgba(0,0,0,.9);
  --pt-ridges:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'><path fill='%23142a3b' d='M0 70 L120 40 L230 64 L360 22 L480 58 L610 30 L740 62 L880 26 L1010 60 L1120 36 L1200 50 L1200 120 L0 120Z'/><path fill='%23183249' d='M0 92 L150 66 L300 88 L450 58 L600 86 L760 60 L920 90 L1060 64 L1200 84 L1200 120 L0 120Z'/><path fill='%230c1a24' d='M0 108 L200 92 L420 110 L640 94 L860 112 L1060 96 L1200 106 L1200 120 L0 120Z'/></svg>");
  color-scheme:dark;
}

/* ---------- Ground and type ------------------------------------------- */
html.pt body{
  background:var(--pt-ground)!important; color:var(--pt-body);
  font-family:var(--pt-text)!important; font-size:15px; line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
html.pt body :is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.card-title,.modal-title,.offcanvas-title){
  font-family:var(--pt-head)!important; color:var(--pt-ink); letter-spacing:-.01em;
}
html.pt body :is(label,.form-label,th,.btn,.nav-link,.badge,.breadcrumb){font-family:var(--pt-head)}
html.pt body a{color:var(--pt-accent)}
/* The penalty calendar page loads its own Bootstrap 5.2, which underlines every link. */
html.pt body :is(.main-sidebar,.main-header,.breadcrumb,.small-box,.dropdown-menu,.fc) a,
html.pt body a.btn,html.pt body a.nav-link,html.pt body a.brand-link{text-decoration:none!important}
html.pt body a:hover{color:var(--pt-accent-2)}
html.pt body :is(.text-muted,small.text-muted){color:var(--pt-muted)!important}
html.pt body .text-danger{color:var(--pt-bad)!important}
html.pt body .text-success{color:var(--pt-ok)!important}
html.pt body :is(.text-dark,.text-body){color:var(--pt-ink)!important}
html.pt body ::selection{background:var(--pt-accent);color:var(--pt-accent-ink)}
html.pt body :focus-visible{outline:2px solid var(--pt-accent);outline-offset:2px}
html.pt[data-theme="dark"] body :is(.bg-white,.bg-light){background:var(--pt-tile)!important;color:var(--pt-body)!important}

/* ---------- Top bar --------------------------------------------------- */
html.pt body .main-header.navbar{
  background:color-mix(in srgb,var(--pt-tile) 92%,transparent)!important;
  -webkit-backdrop-filter:saturate(1.2) blur(10px); backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid var(--pt-line-soft)!important; box-shadow:none!important;
  min-height:62px; padding:0 18px;
}
html.pt body .main-header .nav-link{color:var(--pt-ink)!important;border-radius:var(--pt-radius-sm);height:40px;display:flex;align-items:center;gap:.5rem}
html.pt body .main-header .nav-link:hover{background:var(--pt-accent-soft)}
html.pt body .main-header .dropdown-menu{margin-top:6px}
html.pt body .pt-theme-toggle{
  display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin-right:6px;
  border:1px solid var(--pt-line);border-radius:999px;background:transparent;color:var(--pt-ink);cursor:pointer;
  transition:background .2s,border-color .2s,transform .3s cubic-bezier(.34,1.3,.5,1);
}
html.pt body .pt-theme-toggle:hover{background:var(--pt-accent-soft);border-color:var(--pt-accent)}
html.pt body .pt-theme-toggle:active{transform:scale(.92)}
html.pt body .pt-theme-toggle .pt-ico-sun{display:none}
html.pt[data-theme="dark"] body .pt-theme-toggle .pt-ico-sun{display:inline}
html.pt[data-theme="dark"] body .pt-theme-toggle .pt-ico-moon{display:none}

/* ---------- Sidebar: the deep ink panel ------------------------------- */
html.pt body .main-sidebar{
  background:var(--pt-panel-ridges) left bottom/100% 140px no-repeat,
             var(--pt-contour) right -160px bottom 40px/520px 320px no-repeat,
             linear-gradient(170deg,var(--pt-panel) 0%,var(--pt-panel-2) 100%)!important;
  box-shadow:none!important; border-right:0!important;
}
html.pt body .main-sidebar .sidebar{padding:6px 12px 24px}
html.pt body .main-sidebar .brand-link{
  display:flex!important;align-items:center;gap:12px;height:62px;padding:0 18px!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;color:var(--pt-panel-ink)!important;
}
html.pt body .main-sidebar .brand-link .brand-image{
  float:none!important;margin:0!important;width:36px;height:36px;max-height:none!important;opacity:1!important;
  box-shadow:none!important;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));border-radius:0!important;
}
html.pt body .main-sidebar .pt-brand{display:flex;flex-direction:column;line-height:1.1;overflow:hidden;white-space:nowrap}
html.pt body .main-sidebar .pt-brand b{font-family:var(--pt-head);font-weight:800;font-size:15px;color:var(--pt-panel-ink);letter-spacing:-.01em}
html.pt body .main-sidebar .pt-brand small{font-family:var(--pt-head);font-weight:600;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--pt-panel-muted)}
html.pt body .main-sidebar .nav-sidebar .nav-item{margin-bottom:2px}
html.pt body .main-sidebar .nav-sidebar .nav-link{
  color:var(--pt-panel-muted)!important;border-radius:var(--pt-radius-sm)!important;padding:.62rem .8rem!important;
  font-weight:600;font-size:14px;transition:background .18s,color .18s;
}
html.pt body .main-sidebar .nav-sidebar .nav-link .nav-icon{color:var(--pt-panel-muted);width:1.6rem;font-size:1rem;transition:color .18s}
html.pt body .main-sidebar .nav-sidebar .nav-link:hover{background:rgba(255,255,255,.07)!important;color:var(--pt-panel-ink)!important}
html.pt body .main-sidebar .nav-sidebar .nav-link:hover .nav-icon{color:var(--pt-panel-ink)}
html.pt body .main-sidebar .nav-sidebar .nav-link.active,
html.pt body .main-sidebar .nav-sidebar .menu-open>.nav-link{
  background:var(--pt-panel-btn)!important;color:var(--pt-panel-btn-ink)!important;box-shadow:none!important;
}
html.pt body .main-sidebar .nav-sidebar .nav-link.active .nav-icon,
html.pt body .main-sidebar .nav-sidebar .menu-open>.nav-link .nav-icon{color:var(--pt-panel-btn-ink)}
html.pt body .main-sidebar .nav-treeview{padding-left:.4rem}
html.pt body .main-sidebar .nav-treeview .nav-link{font-weight:500;font-size:13.5px}
html.pt body .main-sidebar .nav-treeview .nav-link.active{background:rgba(255,255,255,.1)!important;color:var(--pt-panel-ink)!important}
html.pt body .main-sidebar .nav-treeview .nav-link.active .nav-icon{color:var(--pt-panel-btn)}
html.pt body .main-sidebar .nav-header{color:var(--pt-panel-muted);font-family:var(--pt-head);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:1rem .8rem .4rem}
html.pt body .main-sidebar .user-panel{border-bottom:1px solid rgba(255,255,255,.08)!important}
html.pt body .main-sidebar .user-panel .info a{color:var(--pt-panel-ink)!important}

/* ---------- Content area and page heads ------------------------------- */
html.pt body .content-wrapper{background:transparent!important;color:var(--pt-body);padding-bottom:30px}
html.pt body .content-header{padding:28px 22px 6px}
html.pt body .content-header h1,
html.pt body .content-wrapper > .content h1:first-child{
  font-size:clamp(1.6rem,1.2rem + 1.2vw,2.15rem)!important;font-weight:800!important;color:var(--pt-ink)!important;
  line-height:1.15;margin:0;
}
html.pt body .content-header h1::before{
  content:"";display:block;width:34px;height:16px;margin-bottom:12px;background:var(--pt-accent);
  -webkit-mask:var(--pt-glyph) center/contain no-repeat; mask:var(--pt-glyph) center/contain no-repeat;
}
/* ---------- Page header component (resources/views/components/page-header.blade.php) */
html.pt body .pt-page-head .breadcrumb{margin-bottom:14px!important}
html.pt body .pt-page-head__row{display:flex;flex-wrap:wrap;gap:14px 20px;align-items:flex-end;justify-content:space-between}
html.pt body .pt-page-head__text{min-width:0;flex:1 1 320px}
html.pt body .pt-page-head__actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
html.pt body .pt-month-picker .form-control{min-width:170px}
html.pt body .pt-person{display:flex;align-items:center;gap:12px;min-width:0}
html.pt body .pt-person small{display:block;line-height:1.3}
html.pt body .pt-num{font-variant-numeric:tabular-nums;font-family:var(--pt-head);font-weight:600;color:var(--pt-ink)}
html.pt body .visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
html.pt body .pt-lead{margin:.5rem 0 0;color:var(--pt-muted);font-size:14.5px;max-width:46rem}
html.pt body .pt-strong{color:var(--pt-ink);font-weight:600}
html.pt body .pt-avatar{width:35px;height:35px;border-radius:50%;object-fit:cover;background:var(--pt-mist)}
html.pt body .pt-doc-links{display:inline-flex;flex-wrap:wrap;gap:.4rem;justify-content:flex-end;align-items:center}
html.pt body .btn-outline-danger{background:transparent!important;border:1px solid var(--pt-line)!important;color:var(--pt-bad)!important}
html.pt body .btn-outline-danger:hover,html.pt body .btn-outline-danger:focus-visible{background:var(--pt-bad)!important;border-color:var(--pt-bad)!important;color:var(--pt-bad-ink)!important}
html.pt body .pt-empty .card-body{text-align:center;padding:56px 24px!important}
html.pt body .pt-empty__icon{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:18px;background:var(--pt-accent-soft);color:var(--pt-accent);font-size:26px;margin-bottom:18px}
html.pt body .pt-empty h2{font-size:1.35rem;font-weight:800;margin:0 0 8px}
html.pt body .pt-empty p{color:var(--pt-muted);max-width:30rem;margin:0 auto 22px}
html.pt body .breadcrumb{background:transparent!important;padding:0!important;margin:0;font-size:13px;font-weight:500}
html.pt body .breadcrumb-item,html.pt body .breadcrumb-item.active{color:var(--pt-muted)!important}
html.pt body .breadcrumb-item+.breadcrumb-item::before{color:var(--pt-line)!important}
html.pt body .breadcrumb-item a{color:var(--pt-accent)!important}
html.pt body .content{padding:10px 22px 0}

/* ---------- Tiles (cards) --------------------------------------------- */
html.pt body :is(.card,.info-box){
  background:var(--pt-tile)!important;color:var(--pt-body);
  border:1px solid var(--pt-line-soft)!important;border-radius:var(--pt-radius)!important;
  box-shadow:var(--pt-lift)!important;
}
html.pt body .card-header{
  background:transparent!important;border-bottom:1px solid var(--pt-line-soft)!important;
  padding:16px 22px!important;border-radius:var(--pt-radius) var(--pt-radius) 0 0!important;
}
html.pt body .card-title{font-weight:700!important;font-size:1.05rem!important;color:var(--pt-ink)!important}
html.pt body .card-body{padding:20px 22px!important;color:var(--pt-body)}
html.pt body .card-footer{background:transparent!important;border-top:1px solid var(--pt-line-soft)!important}

/* ---------- Dashboard stat tiles (AdminLTE small-box) ----------------- */
html.pt body .small-box{
  background:var(--pt-tile)!important;color:var(--pt-body)!important;
  border:1px solid var(--pt-line-soft);border-radius:var(--pt-radius)!important;box-shadow:var(--pt-lift)!important;
  overflow:hidden;transition:transform .25s cubic-bezier(.34,1.3,.5,1),box-shadow .25s;
}
html.pt body .small-box:hover{transform:translateY(-3px);box-shadow:var(--pt-lift-hover)!important}
html.pt body .small-box .inner{padding:22px 22px 18px!important}
html.pt body .small-box .inner h3{font-family:var(--pt-head)!important;font-weight:800!important;font-size:2.4rem!important;color:var(--pt-ink)!important;margin-bottom:.2rem}
html.pt body .small-box .inner p{font-family:var(--pt-head);font-weight:600;color:var(--pt-muted)!important;margin:0}
html.pt body .small-box .pt-tile-sub{display:block;margin-top:.35rem;font-size:12.5px;color:var(--pt-muted)}
html.pt body .row > [class*="col"]:first-child > .small-box .pt-tile-sub{color:var(--pt-hot-muted)}
html.pt body .pt-note{display:flex;align-items:center;gap:.5rem;margin:6px 2px 0;color:var(--pt-muted);font-size:13.5px}
html.pt body .small-box .icon{color:var(--pt-accent)!important;opacity:.16}
html.pt body .small-box .icon>i{top:18px!important;font-size:58px!important}
html.pt body .small-box .small-box-footer{
  background:var(--pt-accent-soft)!important;color:var(--pt-accent)!important;
  font-family:var(--pt-head);font-weight:600;font-size:13px;padding:.55rem 0!important;
}
html.pt body .small-box .small-box-footer:hover{background:var(--pt-accent)!important;color:var(--pt-accent-ink)!important}
/* The first tile is the "hot" one, as on the main site's bento grids. */
html.pt body .row > [class*="col"]:first-child > .small-box{background:var(--pt-hot)!important;border-color:transparent}
html.pt body .row > [class*="col"]:first-child > .small-box :is(h3){color:var(--pt-hot-ink)!important}
html.pt body .row > [class*="col"]:first-child > .small-box p{color:var(--pt-hot-muted)!important}
html.pt body .row > [class*="col"]:first-child > .small-box .icon{color:#fff!important;opacity:.18}
html.pt body .row > [class*="col"]:first-child > .small-box .small-box-footer{background:rgba(0,0,0,.16)!important;color:var(--pt-hot-ink)!important}
html.pt body .row > [class*="col"]:first-child > .small-box .small-box-footer:hover{background:rgba(0,0,0,.28)!important}

/* ---------- Buttons --------------------------------------------------- */
html.pt body .btn{
  border-radius:var(--pt-radius-sm)!important;font-weight:600;letter-spacing:.005em;
  padding:.55rem 1.05rem;transition:background .18s,border-color .18s,color .18s,transform .2s,box-shadow .2s;
}
html.pt body .btn-sm{padding:.32rem .7rem;font-size:13px}
html.pt body .btn:active{transform:translateY(1px)}
html.pt body :is(.btn-primary,.btn-info){background:var(--pt-accent)!important;border-color:var(--pt-accent)!important;color:var(--pt-accent-ink)!important}
html.pt body :is(.btn-primary,.btn-info):hover{background:var(--pt-accent-2)!important;border-color:var(--pt-accent-2)!important;box-shadow:0 10px 22px -14px var(--pt-accent)}
html.pt body .btn-success{background:var(--pt-ok)!important;border-color:var(--pt-ok)!important;color:var(--pt-accent-ink)!important}
html.pt[data-theme="dark"] body .btn-success{color:#0b1a12!important}
html.pt body .btn-danger{background:var(--pt-bad)!important;border-color:var(--pt-bad)!important;color:var(--pt-bad-ink)!important}
html.pt body .btn-warning{background:var(--pt-warn)!important;border-color:var(--pt-warn)!important;color:#fff!important}
html.pt[data-theme="dark"] body .btn-warning{color:#241700!important}
html.pt body :is(.btn-secondary,.btn-default,.btn-light,.btn-dark,.btn-outline-secondary,.dt-buttons .btn,.btn-outline-primary){
  background:transparent!important;border:1px solid var(--pt-line)!important;color:var(--pt-ink)!important;
}
html.pt body :is(.btn-secondary,.btn-default,.btn-light,.btn-dark,.btn-outline-secondary,.dt-buttons .btn,.btn-outline-primary):hover{
  background:var(--pt-accent-soft)!important;border-color:var(--pt-accent)!important;color:var(--pt-accent)!important;
}
html.pt body .btn-close{filter:none;opacity:.6}
html.pt[data-theme="dark"] body .btn-close{filter:invert(1) grayscale(1) brightness(1.6)}

/* ---------- Forms ------------------------------------------------------ */
html.pt body :is(.form-control,.form-select,.custom-select){
  background-color:var(--pt-field)!important;color:var(--pt-ink)!important;
  border:1px solid var(--pt-line)!important;border-radius:var(--pt-radius-sm)!important;
  min-height:44px;font-size:14.5px;box-shadow:none!important;transition:border-color .18s,box-shadow .18s;
}
html.pt body textarea.form-control{min-height:96px}
html.pt body :is(.form-control,.form-select)::placeholder{color:var(--pt-muted);opacity:.85}
html.pt body :is(.form-control,.form-select,.custom-select):focus{
  border-color:var(--pt-accent)!important;box-shadow:0 0 0 4px var(--pt-accent-soft)!important;
}
html.pt body :is(.form-control,.form-select)[readonly],html.pt body :is(.form-control,.form-select):disabled{
  background-color:var(--pt-mist)!important;color:var(--pt-body)!important;
}
html.pt[data-theme="dark"] body .form-select{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23bfd0de' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e")!important;
}
html.pt body :is(label,.form-label){color:var(--pt-ink);font-weight:600;font-size:13px;margin-bottom:.35rem}
html.pt body .input-group-text{
  background:var(--pt-mist)!important;border:1px solid var(--pt-line)!important;color:var(--pt-muted)!important;
  border-radius:var(--pt-radius-sm)!important;
}
html.pt body .input-group > :not(:first-child):not(.dropdown-menu){border-top-left-radius:0!important;border-bottom-left-radius:0!important}
html.pt body .input-group > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu){border-top-right-radius:0!important;border-bottom-right-radius:0!important}
html.pt body .form-check-input{border-color:var(--pt-line)!important;background-color:var(--pt-field)}
html.pt body .form-check-input:checked{background-color:var(--pt-accent)!important;border-color:var(--pt-accent)!important}
html.pt body .invalid-feedback{color:var(--pt-bad)}

/* ---------- Select2 ---------------------------------------------------- */
html.pt body .select2-container :is(.select2-selection--single,.select2-selection--multiple){
  background:var(--pt-field)!important;border:1px solid var(--pt-line)!important;border-radius:var(--pt-radius-sm)!important;min-height:44px;
}
html.pt body .select2-container .select2-selection--single{padding:0!important}
html.pt body .select2-container .select2-selection--single .select2-selection__rendered{color:var(--pt-ink)!important;line-height:42px!important;padding-left:14px!important;padding-top:0!important}
html.pt body .select2-container .select2-selection--single .select2-selection__arrow{height:42px!important}
html.pt body .select2-container .select2-selection--single .select2-selection__placeholder{color:var(--pt-muted)!important}
html.pt body .select2-container.select2-container--focus .select2-selection,
html.pt body .select2-container.select2-container--open .select2-selection{border-color:var(--pt-accent)!important;box-shadow:0 0 0 4px var(--pt-accent-soft)}
html.pt body .select2-dropdown{background:var(--pt-tile)!important;border:1px solid var(--pt-line)!important;border-radius:var(--pt-radius-sm)!important;overflow:hidden;box-shadow:var(--pt-lift-hover)}
html.pt body .select2-results__option{color:var(--pt-body)}
html.pt body .select2-container .select2-results__option--highlighted[aria-selected],
html.pt body .select2-container .select2-results__option--highlighted{background:var(--pt-accent)!important;color:var(--pt-accent-ink)!important}
html.pt body .select2-container .select2-results__option[aria-selected=true]{background:var(--pt-accent-soft);color:var(--pt-ink)}
html.pt body .select2-search--dropdown .select2-search__field{background:var(--pt-field);color:var(--pt-ink);border:1px solid var(--pt-line)!important;border-radius:8px}
html.pt body .select2-container .select2-selection--multiple .select2-selection__choice{background:var(--pt-accent-soft)!important;border:1px solid var(--pt-line)!important;color:var(--pt-ink)!important;border-radius:999px}

/* ---------- Tables and DataTables -------------------------------------- */
html.pt body .table{color:var(--pt-body)!important;--bs-table-bg:transparent;--bs-table-color:var(--pt-body);border-color:var(--pt-line-soft)!important}
html.pt body .table > :not(caption) > * > *{background-color:transparent;border-color:var(--pt-line-soft)!important;color:inherit}
html.pt body .table thead th{
  background:var(--pt-mist)!important;color:var(--pt-ink)!important;border-bottom:1px solid var(--pt-line)!important;
  font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;vertical-align:middle;white-space:nowrap;
}
html.pt body .table td{vertical-align:middle;padding-top:.75rem;padding-bottom:.75rem}
html.pt body .table-striped > tbody > tr:nth-of-type(odd) > *{--bs-table-accent-bg:transparent;background-color:color-mix(in srgb,var(--pt-mist) 45%,transparent)!important}
html.pt body :is(.table-hover,.dataTable) > tbody > tr:hover > *{background-color:var(--pt-accent-soft)!important}
html.pt body .table-bordered,html.pt body .table-bordered :is(td,th){border-color:var(--pt-line-soft)!important}
html.pt body .dataTables_wrapper{color:var(--pt-body)}
html.pt body .dataTables_wrapper :is(.dataTables_length,.dataTables_filter,.dataTables_info){color:var(--pt-muted)!important;font-size:13px}
html.pt body .dataTables_wrapper .dataTables_filter input,
html.pt body .dataTables_wrapper .dataTables_length select{
  background:var(--pt-field)!important;color:var(--pt-ink)!important;border:1px solid var(--pt-line)!important;
  border-radius:var(--pt-radius-sm)!important;min-height:38px;padding:.3rem .7rem;margin-left:.4rem;
}
html.pt body .dataTables_wrapper .dataTables_filter input:focus{border-color:var(--pt-accent)!important;box-shadow:0 0 0 4px var(--pt-accent-soft)!important;outline:0}
html.pt body .dt-buttons{gap:.35rem;display:inline-flex;flex-wrap:wrap;margin-bottom:10px}
html.pt body .pt-export .dropdown-menu{min-width:150px}
html.pt body .pt-export .dropdown-item{border:0!important;background:transparent!important;color:var(--pt-body)!important;text-align:left;width:100%;min-height:36px;margin:0!important}
html.pt body .pt-export .dropdown-item:hover{background:var(--pt-accent-soft)!important;color:var(--pt-ink)!important}
html.pt body div.dt-button-collection{background:var(--pt-tile)!important;border:1px solid var(--pt-line-soft)!important;border-radius:14px!important;box-shadow:var(--pt-lift-hover)!important;padding:6px!important}
html.pt body div.dt-button-collection .dt-button,html.pt body div.dt-button-collection .btn{display:block;width:100%;text-align:left;border:0!important;background:transparent!important;color:var(--pt-body)!important;border-radius:8px!important;margin:0!important}
html.pt body div.dt-button-collection .dt-button:hover,html.pt body div.dt-button-collection .btn:hover{background:var(--pt-accent-soft)!important;color:var(--pt-ink)!important}
html.pt body div.dt-button-background{background:transparent!important}
html.pt body .dt-buttons .btn{padding:.35rem .8rem!important;font-size:12.5px;border-radius:8px!important;margin:0!important}
html.pt body .pagination{gap:4px}
html.pt body .page-link{
  background:transparent!important;border:1px solid var(--pt-line)!important;color:var(--pt-ink)!important;
  border-radius:8px!important;min-width:36px;text-align:center;font-family:var(--pt-head);font-weight:600;font-size:13px;
}
html.pt body .page-link:hover{background:var(--pt-accent-soft)!important;border-color:var(--pt-accent)!important}
html.pt body .page-item.active .page-link{background:var(--pt-accent)!important;border-color:var(--pt-accent)!important;color:var(--pt-accent-ink)!important}
html.pt body .page-item.disabled .page-link{opacity:.45}
html.pt body table.dataTable thead > tr > :is(th,td).sorting::before,
html.pt body table.dataTable thead > tr > :is(th,td).sorting::after{color:var(--pt-muted)}
html.pt body table.dataTable > tbody > tr.child ul.dtr-details > li{border-bottom-color:var(--pt-line-soft)}
html.pt body table.dataTable > tbody > tr > td.dtr-control::before{background-color:var(--pt-accent)!important;border-color:var(--pt-tile)!important;box-shadow:none!important}

/* ---------- Modals, slide-out panels, dropdowns ------------------------ */
html.pt body :is(.modal-content,.offcanvas,.dropdown-menu){
  background:var(--pt-tile)!important;color:var(--pt-body)!important;border:1px solid var(--pt-line-soft)!important;
  box-shadow:var(--pt-lift-hover)!important;
}
html.pt body .modal-content{border-radius:20px!important;overflow:hidden}
html.pt body :is(.modal-header,.offcanvas-header){border-bottom:1px solid var(--pt-line-soft)!important;padding:18px 24px!important;background:transparent!important}
html.pt body .modal-footer{border-top:1px solid var(--pt-line-soft)!important;padding:14px 24px!important}
html.pt body :is(.modal-body,.offcanvas-body){padding:22px 24px!important}
html.pt body .modal-backdrop.show{opacity:.55;background:#06141a}
html.pt body .dropdown-menu{border-radius:14px!important;padding:6px!important}
html.pt body .dropdown-item{color:var(--pt-body)!important;border-radius:8px;padding:.5rem .75rem}
html.pt body .dropdown-item:hover,html.pt body .dropdown-item:focus{background:var(--pt-accent-soft)!important;color:var(--pt-ink)!important}
html.pt body .dropdown-divider{border-color:var(--pt-line-soft)!important}

/* ---------- Bootstrap "primary" is the brand accent, not Bootstrap blue -- */
html.pt body .text-primary{color:var(--pt-accent)!important}
html.pt body .bg-primary{background-color:var(--pt-accent)!important;color:var(--pt-accent-ink)!important}
html.pt body .border-primary{border-color:var(--pt-line)!important}
html.pt body .link-primary{color:var(--pt-accent)!important}
/* Text sitting ON a primary (accent) ground takes the accent ink, headings included. */
html.pt body .bg-primary :is(h1,h2,h3,h4,h5,h6,.card-title,small,span,p,a:not(.btn),i){color:var(--pt-accent-ink)!important}
/* Small notes inside table heads sit on mist, so they need the body ink, not muted. */
html.pt body .table thead th :is(small,.text-muted){color:var(--pt-body)!important}

/* ---------- In-page tabs (the invoice form's Student / Agency / Certification) */
html.pt body .content-wrapper .nav-pills:not(.nav-sidebar){border-bottom:1px solid var(--pt-line)!important;gap:4px}
html.pt body .content-wrapper .nav-pills:not(.nav-sidebar) .nav-link{
  background:transparent!important;color:var(--pt-muted)!important;border-radius:var(--pt-radius-sm) var(--pt-radius-sm) 0 0!important;
  font-family:var(--pt-head);font-weight:700;font-size:13px;letter-spacing:.06em;padding:.7rem 1rem;
}
html.pt body .content-wrapper .nav-pills:not(.nav-sidebar) .nav-link:hover{color:var(--pt-ink)!important;background:var(--pt-accent-soft)!important}
html.pt body .content-wrapper .nav-pills:not(.nav-sidebar) .nav-link.active{color:var(--pt-accent)!important}
/* The page draws the underline as a red border on ::after; recolor it. */
html.pt body .content-wrapper .nav-pills:not(.nav-sidebar) .nav-link.active::after{border-bottom-color:var(--pt-accent)!important}
html.pt body .nav-tabs{border-bottom-color:var(--pt-line)!important}
html.pt body .nav-tabs .nav-link{color:var(--pt-muted)!important}
html.pt body .nav-tabs .nav-link.active{background:var(--pt-tile)!important;color:var(--pt-accent)!important;border-color:var(--pt-line) var(--pt-line) var(--pt-tile)!important}
html.pt body .tab-content{border-color:var(--pt-line)!important}

/* ---------- Accordions and list groups --------------------------------- */
html.pt body .accordion{--bs-accordion-bg:var(--pt-tile);--bs-accordion-color:var(--pt-body);--bs-accordion-border-color:var(--pt-line-soft);--bs-accordion-btn-color:var(--pt-ink);--bs-accordion-active-color:var(--pt-accent);--bs-accordion-active-bg:var(--pt-accent-soft);--bs-accordion-btn-focus-box-shadow:0 0 0 4px var(--pt-accent-soft);--bs-accordion-btn-focus-border-color:var(--pt-accent)}
html.pt body .accordion-item{background:var(--pt-tile)!important;color:var(--pt-body)!important;border-color:var(--pt-line-soft)!important}
html.pt body .accordion-button{background:var(--pt-tile)!important;color:var(--pt-ink)!important;font-family:var(--pt-head);font-weight:600}
html.pt body .accordion-button:not(.collapsed){background:var(--pt-accent-soft)!important;color:var(--pt-accent)!important;box-shadow:inset 0 -1px 0 var(--pt-line-soft)!important}
html.pt[data-theme="dark"] body .accordion-button::after{filter:invert(1) brightness(1.6)}
html.pt body .list-group-item{background:var(--pt-tile)!important;color:var(--pt-body)!important;border-color:var(--pt-line-soft)!important}

/* ---------- Badges and alerts ------------------------------------------ */
html.pt body .badge{border-radius:999px;font-weight:600;padding:.35em .7em;letter-spacing:.01em}
html.pt body :is(.badge.bg-success,.badge-success){background:var(--pt-ok-soft)!important;color:var(--pt-ok)!important}
html.pt body :is(.badge.bg-danger,.badge-danger){background:var(--pt-bad-soft)!important;color:var(--pt-bad)!important}
html.pt body :is(.badge.bg-warning,.badge-warning){background:var(--pt-warn-soft)!important;color:var(--pt-warn)!important}
html.pt body :is(.badge.bg-primary,.badge-primary,.badge.bg-info,.badge-info,.badge.bg-secondary,.badge-secondary){background:var(--pt-accent-soft)!important;color:var(--pt-accent)!important}
html.pt body .alert{border-radius:14px;border:1px solid var(--pt-line-soft);padding:14px 18px}
html.pt body .alert-danger{background:var(--pt-bad-soft)!important;color:var(--pt-bad)!important;border-color:transparent}
html.pt body .alert-success{background:var(--pt-ok-soft)!important;color:var(--pt-ok)!important;border-color:transparent}
html.pt body .alert-warning{background:var(--pt-warn-soft)!important;color:var(--pt-warn)!important;border-color:transparent}
html.pt body .alert-info,html.pt body .alert-primary{background:var(--pt-accent-soft)!important;color:var(--pt-ink)!important;border-color:transparent}
/* The layout forced white text on every .bg-warning; amber tiles need dark ink. */
html.pt body :is(.bg-warning,.bg-warning > a){color:var(--pt-ink)!important}

/* ---------- SweetAlert2 ------------------------------------------------ */
html.pt body .swal2-popup{background:var(--pt-tile)!important;color:var(--pt-body)!important;border-radius:20px!important;border:1px solid var(--pt-line-soft)}
html.pt body .swal2-title{font-family:var(--pt-head)!important;color:var(--pt-ink)!important}
html.pt body .swal2-html-container{color:var(--pt-body)!important}
html.pt body .swal2-styled.swal2-confirm{background:var(--pt-accent)!important;color:var(--pt-accent-ink)!important;border-radius:var(--pt-radius-sm)!important;box-shadow:none!important}
html.pt body .swal2-styled.swal2-cancel{background:transparent!important;color:var(--pt-ink)!important;border:1px solid var(--pt-line)!important;border-radius:var(--pt-radius-sm)!important}
html.pt body .swal2-styled.swal2-deny{background:var(--pt-bad)!important;color:var(--pt-bad-ink)!important;border-radius:var(--pt-radius-sm)!important}

/* ---------- Invoice wizard (public/assets/portal/wizard.js) -------------- */
html.pt body .pt-wizard > .card-header{display:none}
html.pt body .pt-wizard .container.p-5{padding:24px 26px!important;max-width:none}
html.pt body .pt-wizard #pills-tab{display:none!important}
html.pt body .pt-wizard .tab-content{border:0!important}
html.pt body .pt-wizard .tab-content > .tab-pane[data-pt-step]{display:block!important;opacity:1!important}
html.pt body .pt-wizard .tab-content > .tab-pane[data-pt-step][hidden]{display:none!important}
html.pt body .pt-wizard [hidden]{display:none!important}
html.pt body .pt-wizard #pills-home .accordion-header{display:none}
html.pt body .pt-wizard #pills-home .accordion-item{border:0!important;background:transparent!important}
html.pt body .pt-wizard #pills-home .accordion-body{padding:0!important}
html.pt body .pt-wizard #pills-home .accordion-body > .row > [class*="col-md-6"],
html.pt body .pt-wizard #pills-home .accordion-body > .row > [class*="col-md-4"],
html.pt body .pt-wizard #pills-home .accordion-body > .row > [class*="col-md-2"]{flex:0 0 100%;max-width:100%}
html.pt body .pt-wizard .form-control-validation{max-width:560px}
html.pt body .pt-extra-line__type{display:flex;gap:8px;align-items:center}
html.pt body .pt-extra-line__type .form-select{flex:1 1 auto;min-width:0}
html.pt body .pt-extra-lines__add td{padding-top:12px;padding-bottom:12px}
html.pt body .pt-total-field{font-family:var(--pt-head);font-weight:800!important;font-size:1.05rem!important;color:var(--pt-ink)!important}
html.pt body .pt-check{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:1px solid var(--pt-line);border-radius:var(--pt-radius-sm);background:var(--pt-field);cursor:pointer;font-weight:400}
html.pt body .pt-check input{width:20px;height:20px;margin-top:2px;flex:0 0 auto;accent-color:var(--pt-accent)}
html.pt body .pt-check strong{display:block;color:var(--pt-ink);font-family:var(--pt-head);font-size:14px}
html.pt body .pt-check small{display:block;color:var(--pt-muted);font-size:13px;margin-top:2px}
html.pt body .pt-check:has(input:checked){border-color:var(--pt-accent);background:var(--pt-accent-soft)}

html.pt body .pt-stepper{display:flex;gap:6px;list-style:none;margin:0 0 22px;padding:0;counter-reset:none}
html.pt body .pt-stepper li{flex:1 1 0;position:relative}
html.pt body .pt-stepper li:not(:last-child)::after{content:"";position:absolute;top:19px;left:calc(50% + 24px);right:calc(-50% + 24px);height:2px;background:var(--pt-line);border-radius:2px}
html.pt body .pt-stepper li.is-done:not(:last-child)::after{background:var(--pt-accent)}
html.pt body .pt-stepper__btn{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;background:none;border:0;padding:0;color:var(--pt-muted);font-family:var(--pt-head);font-weight:600;font-size:13px;cursor:pointer}
html.pt body .pt-stepper__btn:disabled{cursor:default;opacity:.65}
html.pt body .pt-stepper__num{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:2px solid var(--pt-line);background:var(--pt-tile);color:var(--pt-muted);font-weight:800;transition:background .2s,border-color .2s,color .2s}
html.pt body .pt-stepper li.is-done .pt-stepper__num{background:var(--pt-accent-soft);border-color:var(--pt-accent);color:var(--pt-accent)}
html.pt body .pt-stepper li.is-current .pt-stepper__num{background:var(--pt-accent);border-color:var(--pt-accent);color:var(--pt-accent-ink)}
html.pt body .pt-stepper li.is-current .pt-stepper__btn{color:var(--pt-ink)}
html.pt body .pt-wizard-intro{margin-bottom:18px}
html.pt body .pt-wizard-intro__title{font-size:1.3rem;font-weight:800;margin:0 0 4px}
html.pt body .pt-wizard-intro__lead{margin:0}

html.pt body .pt-wizard-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
html.pt body .pt-summary{position:sticky;top:84px;background:var(--pt-mist);border:1px solid var(--pt-line-soft);border-radius:var(--pt-radius);padding:18px 20px}
html.pt body .pt-summary__title{font-size:1rem;font-weight:800;margin:0 0 10px}
html.pt body .pt-summary__list{margin:0}
html.pt body .pt-summary__list > div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px dashed var(--pt-line)}
html.pt body .pt-summary__list > div:last-child{border-bottom:0}
html.pt body .pt-summary__list dt{flex:0 0 auto;font-weight:500;color:var(--pt-muted);font-size:13.5px}
html.pt body .pt-summary__list dd{min-width:0;margin:0;text-align:right;color:var(--pt-ink);font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
html.pt body .pt-summary__total dt,html.pt body .pt-summary__total dd{color:var(--pt-ink)!important;font-weight:800!important;font-size:15px!important}
html.pt body .pt-summary__hint{font-size:12.5px;margin:10px 0 0}
/* Muted text on the mist summary was 4.41:1; the body ink passes. */
html.pt body .pt-summary :is(.text-muted,dt){color:var(--pt-body)!important}

html.pt body .pt-wizard-panel{background:var(--pt-tile);border:1px solid var(--pt-line-soft);border-radius:var(--pt-radius);padding:18px 20px;margin:18px 0 0}
html.pt body .pt-wizard-panel__title{font-size:1.05rem;font-weight:800;margin:0 0 4px}
html.pt body .pt-wizard-docs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
html.pt body .pt-wizard-pane-head{margin:22px 0 10px}
html.pt body .pt-wizard-save{display:flex;justify-content:flex-end;gap:8px;background:transparent!important;border:0!important;padding:18px 0 0!important}
html.pt body .pt-wizard-save #save-invoice{background:var(--pt-accent)!important;border-color:var(--pt-accent)!important;color:var(--pt-accent-ink)!important;min-width:150px}
html.pt body .pt-wizard-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:24px;padding-top:18px;border-top:1px solid var(--pt-line-soft)}
html.pt body .pt-wizard-nav [data-nav="next"]{margin-left:auto;min-width:130px}
html.pt body .pt-wizard-nav__count{color:var(--pt-muted);font-family:var(--pt-head);font-weight:600;font-size:13px}
@media (max-width:991.98px){
  html.pt body .pt-wizard-layout{grid-template-columns:1fr}
  /* On phones and tablets the summary becomes a bar pinned to the bottom. */
  html.pt body .pt-summary{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:1040;border-radius:16px 16px 0 0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px -18px rgba(0,0,0,.45);max-height:42vh;overflow:auto}
  html.pt body .pt-summary__title,html.pt body .pt-summary__hint{display:none}
  html.pt body .pt-summary__list > div:not(.pt-summary__total){display:none}
  html.pt body .pt-summary__list > div{border:0;padding:3px 0}
  html.pt body .pt-wizard{margin-bottom:110px}
  html.pt body .pt-stepper__label{font-size:11.5px;text-align:center}
  html.pt body .pt-wizard .container.p-5{padding:16px 12px!important}
}
/* Phones: the fee tables (Item / Price / Note) hold the Utility, Maintenance and Books tables
   inside their Note column, which pushed step 3 to about 580px wide. Each row becomes a small
   stack instead: the item on top, then price and note side by side, nested tables full width.
   The header row keeps "Price" and "Note" so the currency still shows. */
@media (max-width:575.98px){
  html.pt body [data-pt-step="3"] .accordion-body > table.table,
  html.pt body [data-pt-step="3"] .accordion-body > table.table > :is(thead,tbody,tfoot){display:block;width:100%}
  html.pt body [data-pt-step="3"] .accordion-body > table.table > :is(thead,tbody,tfoot) > tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px 10px;padding:12px 0;border-bottom:1px solid var(--pt-line-soft)}
  html.pt body [data-pt-step="3"] .accordion-body > table.table > :is(thead,tbody,tfoot) > tr > :is(td,th){display:block;padding:0!important;border:0!important;min-width:0}
  html.pt body [data-pt-step="3"] .accordion-body > table.table > :is(thead,tbody,tfoot) > tr > td:first-child{grid-column:1 / -1;font-weight:600;color:var(--pt-ink)}
  html.pt body [data-pt-step="3"] .accordion-body > table.table > :is(thead,tbody,tfoot) > tr > th:first-child{display:none}
  html.pt body [data-pt-step="3"] .accordion-body > table.table > :is(thead,tbody,tfoot) > tr > :is(td[colspan],td:has(table)){grid-column:1 / -1}
  html.pt body [data-pt-step="3"] .accordion-body > table.table > :is(thead,tbody,tfoot) > tr > td:empty{display:none}
  html.pt body [data-pt-step="3"] .accordion-body > table.table > tbody > tr.pt-extra-line{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  html.pt body [data-pt-step="3"] .accordion-body > table.table table :is(td,th){padding:4px!important}
  html.pt body [data-pt-step="3"] .accordion-body > table.table .row{margin-left:0;margin-right:0}
  html.pt body [data-pt-step="3"] .accordion-body > table.table .row > [class*="col-"]{padding-left:0;padding-right:0}
}

/* ---------- FullCalendar (the student penalty calendar) ---------------- */
html.pt body .fc{
  --fc-border-color:var(--pt-line-soft); --fc-page-bg-color:var(--pt-tile);
  --fc-neutral-bg-color:var(--pt-mist); --fc-neutral-text-color:var(--pt-muted);
  --fc-today-bg-color:var(--pt-accent-soft); --fc-highlight-color:var(--pt-accent-soft);
  --fc-button-bg-color:var(--pt-accent); --fc-button-border-color:var(--pt-accent); --fc-button-text-color:var(--pt-accent-ink);
  --fc-button-hover-bg-color:var(--pt-accent-2); --fc-button-hover-border-color:var(--pt-accent-2);
  --fc-button-active-bg-color:var(--pt-panel); --fc-button-active-border-color:var(--pt-panel);
  --fc-event-bg-color:var(--pt-accent); --fc-event-border-color:var(--pt-accent); --fc-event-text-color:var(--pt-accent-ink);
  color:var(--pt-body);
}
html.pt[data-theme="dark"] body .fc{--fc-button-active-bg-color:#2b6aa0;--fc-button-active-border-color:#2b6aa0}
html.pt[data-theme="dark"] body .fc .fc-button-active{color:#eef5fb!important}
html.pt body .fc .fc-toolbar-title{font-family:var(--pt-head);font-weight:800;color:var(--pt-ink)}
html.pt body .fc .fc-button{border-radius:var(--pt-radius-sm)!important;font-family:var(--pt-head);font-weight:600;text-transform:none;box-shadow:none!important}
html.pt body .fc .fc-button-group > .fc-button{border-radius:0!important}
html.pt body .fc .fc-button-group > .fc-button:first-child{border-radius:var(--pt-radius-sm) 0 0 var(--pt-radius-sm)!important}
html.pt body .fc .fc-button-group > .fc-button:last-child{border-radius:0 var(--pt-radius-sm) var(--pt-radius-sm) 0!important}
html.pt body .fc .fc-button:disabled{opacity:.45}
html.pt body .fc .fc-col-header-cell{background:var(--pt-mist)}
html.pt body .fc .fc-col-header-cell-cushion{color:var(--pt-ink)!important;font-family:var(--pt-head);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
html.pt body .fc .fc-daygrid-day-number{color:var(--pt-ink)!important;font-weight:600}
html.pt body .fc .fc-daygrid-week-number{background:var(--pt-mist)!important;color:var(--pt-body)!important;border-radius:0 0 8px 0;font-size:11px}
html.pt body .fc .fc-day-other .fc-daygrid-day-top{opacity:.45}
html.pt body .fc .fc-event{border-radius:6px;font-weight:600}
html.pt body .fc a{text-decoration:none}

/* ---------- Footer: ridges rising behind a quiet line ------------------ */
html.pt body .main-footer{
  position:relative;background:transparent!important;border-top:0!important;color:var(--pt-muted)!important;
  font-size:13px;padding:56px 22px 18px!important;
}
html.pt body .main-footer::before{
  content:"";position:absolute;left:0;right:0;top:0;height:46px;pointer-events:none;
  background:var(--pt-ridges) center bottom/100% 100% no-repeat;opacity:.9;
}
html.pt body .main-footer a{color:var(--pt-accent)!important;font-weight:600}

/* ---------- Scrollbars -------------------------------------------------- */
html.pt{scrollbar-color:var(--pt-line) transparent}
html.pt body ::-webkit-scrollbar{width:10px;height:10px}
html.pt body ::-webkit-scrollbar-thumb{background:var(--pt-line);border-radius:999px;border:2px solid var(--pt-ground)}

/* ---------- Login ------------------------------------------------------- */
html.pt body.pt-login{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--pt-ground)!important}
html.pt body.pt-login .pt-login__art{
  position:relative;overflow:hidden;color:var(--pt-panel-ink);padding:56px 64px;display:flex;flex-direction:column;justify-content:space-between;
  background:var(--pt-contour) right -120px top -60px/720px 440px no-repeat,
             linear-gradient(150deg,var(--pt-panel) 0%,var(--pt-panel-2) 100%);
}
html.pt body.pt-login .pt-login__art::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:180px;pointer-events:none;
  background:var(--pt-panel-ridges) center bottom/100% 100% no-repeat;
}
html.pt body.pt-login .pt-login__brand{display:flex;align-items:center;gap:14px;color:var(--pt-panel-ink);text-decoration:none;position:relative;z-index:1}
html.pt body.pt-login .pt-login__brand img{width:52px;height:52px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
html.pt body.pt-login .pt-login__brand b{display:block;font-family:var(--pt-head);font-weight:800;font-size:20px;letter-spacing:-.01em;color:var(--pt-panel-ink)}
html.pt body.pt-login .pt-login__brand small{display:block;font-family:var(--pt-head);font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--pt-panel-muted)}
html.pt body.pt-login .pt-login__pitch{position:relative;z-index:1;max-width:30rem}
html.pt body.pt-login .pt-login__pitch::before{
  content:"";display:block;width:34px;height:16px;margin-bottom:18px;background:var(--pt-panel-btn);
  -webkit-mask:var(--pt-glyph) center/contain no-repeat; mask:var(--pt-glyph) center/contain no-repeat;
}
html.pt body.pt-login .pt-login__pitch h1{font-family:var(--pt-head)!important;font-weight:800;font-size:clamp(2rem,1.3rem + 2vw,3rem);line-height:1.08;color:var(--pt-panel-ink)!important;margin:0 0 14px}
html.pt body.pt-login .pt-login__pitch p{color:var(--pt-panel-muted);font-size:16px;margin:0}
html.pt body.pt-login .pt-login__foot{position:relative;z-index:1;color:var(--pt-panel-muted);font-size:13px}
html.pt body.pt-login .pt-login__foot a{color:var(--pt-panel-ink)!important;text-decoration:underline;text-underline-offset:3px}
html.pt body.pt-login .pt-login__main{display:flex;align-items:center;justify-content:center;padding:48px 28px;position:relative}
html.pt body.pt-login .pt-login__main .pt-theme-toggle{position:absolute;top:22px;right:22px;margin:0}
html.pt body.pt-login .pt-login__card{width:100%;max-width:400px}
html.pt body.pt-login .pt-login__card h2{font-size:1.75rem;font-weight:800;margin:0 0 6px;color:var(--pt-ink)}
html.pt body.pt-login .pt-login__card .pt-login__lead{color:var(--pt-muted);margin:0 0 28px}
html.pt body.pt-login .pt-field{margin-bottom:16px}
html.pt body.pt-login .pt-field .form-control{min-height:50px;padding-left:44px}
html.pt body.pt-login .pt-field__wrap{position:relative}
html.pt body.pt-login .pt-field__wrap > i{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--pt-muted);pointer-events:none}
html.pt body.pt-login .pt-login__row{display:flex;align-items:center;justify-content:space-between;margin:4px 0 22px;font-size:14px}
html.pt body.pt-login .pt-login__row label{font-weight:500;color:var(--pt-body);margin:0;display:flex;align-items:center;gap:.55rem;cursor:pointer}
/* AdminLTE positions .form-check-input absolutely, which put the box on top of its label. */
html.pt body.pt-login .pt-login__row .form-check-input{position:static!important;margin:0!important;width:18px;height:18px;flex:0 0 auto}
html.pt body.pt-login .pt-login__submit{width:100%;min-height:50px;font-size:15px}
html.pt body.pt-login .pt-login__help{margin-top:22px;color:var(--pt-muted);font-size:13.5px;text-align:center}
@media (max-width:900px){
  html.pt body.pt-login{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  html.pt body.pt-login .pt-login__art{padding:28px 22px 96px;gap:28px}
  html.pt body.pt-login .pt-login__art::after{height:90px}
  html.pt body.pt-login .pt-login__pitch h1{font-size:1.9rem}
  html.pt body.pt-login .pt-login__foot{display:none}
  html.pt body.pt-login .pt-login__main{padding:32px 18px 48px;align-items:flex-start}
  /* On phones the button sits over the dark panel, so it takes the panel's light ink. */
  html.pt body.pt-login .pt-login__main .pt-theme-toggle{top:-58px;right:18px;color:var(--pt-panel-ink);border-color:rgba(255,255,255,.32)}
  html.pt body.pt-login .pt-login__main .pt-theme-toggle:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.6)}
}

/* ---------- Phones ------------------------------------------------------- */
@media (max-width:767.98px){
  html.pt body .content-header{padding:20px 14px 4px}
  html.pt body .content{padding:8px 12px 0}
  html.pt body .card-body{padding:16px!important}
  html.pt body .card-header{padding:14px 16px!important}
  html.pt body .main-header.navbar{padding:0 8px}
  html.pt body .dataTables_wrapper .dataTables_filter input{margin-left:0;width:100%}
}

/* ---------- Smoothness: page motion, sticky bar, easy targets ----------- */
/* Pages cross-fade like the main site (cross-document view transitions, Chrome and Edge;
   other browsers simply load the page). */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.22s;animation-timing-function:cubic-bezier(.4,0,.2,1)}
@keyframes pt-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
html.pt body .content-wrapper > .pt-page-head,
html.pt body .content-wrapper > .content-header{animation:pt-rise .32s cubic-bezier(.2,.7,.2,1) both}
html.pt body .content-wrapper > .content{animation:pt-rise .38s cubic-bezier(.2,.7,.2,1) .04s both}
html.pt body .main-header.navbar{position:sticky;top:0;z-index:1035}
html.pt body .btn:not(.btn-sm){min-height:42px}
html.pt body .btn-sm{min-height:34px}
html.pt body .nav-sidebar .nav-link{min-height:44px;display:flex;align-items:center}
html.pt body :is(.card,.small-box,.modal-content,.offcanvas){transition:box-shadow .25s,transform .25s cubic-bezier(.34,1.3,.5,1),background-color .2s}

/* Toasts (success notices that close themselves) */
html.pt body .swal2-popup.swal2-toast{
  background:var(--pt-tile)!important;border:1px solid var(--pt-line-soft)!important;border-left:4px solid var(--pt-ok)!important;
  border-radius:14px!important;box-shadow:var(--pt-lift-hover)!important;padding:12px 16px!important;
}
html.pt body .swal2-popup.swal2-toast .swal2-title{font-size:14px!important;font-weight:600!important;color:var(--pt-ink)!important;margin:0 0 0 .5rem!important}
html.pt body .swal2-popup.swal2-toast .swal2-timer-progress-bar{background:var(--pt-ok)!important;opacity:.5}
html.pt body .swal2-popup.swal2-toast.swal2-icon-error{border-left-color:var(--pt-bad)!important}

@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  html.pt body *{transition:none!important;animation:none!important}
}

/* ---------- Lists: "Show 15" and "Export" side by side ------------------ */
html.pt body .dataTables_wrapper > .row:first-child > [class*="col-"]:first-child{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px}
html.pt body .dataTables_wrapper > .row:first-child > [class*="col-"]:first-child .dt-buttons{margin-bottom:0}

/* ---------- People: avatars, roles, status ------------------------------ */
html.pt body .min-w-0{min-width:0}
html.pt body .pt-avatar{flex:0 0 auto}
html.pt body .pt-avatar--initials{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--pt-accent-soft);color:var(--pt-accent);font-family:var(--pt-head);font-weight:700;font-size:14px;letter-spacing:.02em}
html.pt body img.pt-avatar{width:40px;height:40px}
html.pt body .pt-avatar--lg{width:56px!important;height:56px!important;font-size:18px}
html.pt body .pt-you{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:999px;background:var(--pt-mist);color:var(--pt-body);font-family:var(--pt-head);font-size:11px;font-weight:700;vertical-align:1px}
html.pt body .pt-role{display:inline-flex;align-items:center;padding:4px 11px;border-radius:999px;font-family:var(--pt-head);font-size:12.5px;font-weight:600;background:var(--pt-mist);color:var(--pt-body)}
html.pt body .pt-role--1{background:var(--pt-accent);color:var(--pt-accent-ink)}
html.pt body :is(.pt-role--2,.pt-role--3){background:var(--pt-accent-soft);color:var(--pt-accent)}
html.pt body .pt-role--5{background:var(--pt-warn-soft);color:var(--pt-warn)}
html.pt body .pt-state{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--pt-body)}
html.pt body .pt-state::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
html.pt body .pt-state--on{color:var(--pt-ok)}
html.pt body .pt-state--off{color:var(--pt-muted)}

/* ---------- Filter chips above a list ----------------------------------- */
html.pt body .pt-filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
html.pt body .pt-filter__chip{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 14px;border-radius:999px;border:1px solid var(--pt-line);background:var(--pt-tile);color:var(--pt-body);font-family:var(--pt-head);font-size:13px;font-weight:600;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
html.pt body .pt-filter__chip span{min-width:22px;padding:1px 7px;border-radius:999px;background:var(--pt-mist);color:var(--pt-body);font-size:11.5px;text-align:center}
html.pt body .pt-filter__chip:hover{border-color:var(--pt-accent)}
html.pt body .pt-filter__chip.is-active{background:var(--pt-accent);border-color:var(--pt-accent);color:var(--pt-accent-ink)}
html.pt body .pt-filter__chip.is-active span{background:var(--pt-accent-ink);color:var(--pt-accent)}
html.pt body .pt-filter__chip:focus-visible{outline:2px solid var(--pt-accent);outline-offset:2px}

/* ---------- Side panels (add / edit) ------------------------------------ */
html.pt body .offcanvas.pt-panel{width:min(460px,100vw);display:flex;flex-direction:column}
html.pt body .pt-panel__form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
html.pt body .pt-panel__form > .offcanvas-body{flex:1 1 auto;overflow-y:auto}
html.pt body .pt-panel__foot{display:flex;justify-content:flex-end;gap:10px;padding:16px 24px;border-top:1px solid var(--pt-line-soft);background:var(--pt-tile)}
html.pt body .pt-panel__foot .btn{min-width:110px}
html.pt body .pt-panel__section{margin:26px 0 12px;font-size:12px!important;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--pt-muted)!important}
html.pt body .pt-panel__section:first-of-type{margin-top:4px}
html.pt body .pt-panel__who{display:flex;align-items:center;gap:14px;padding:14px 16px;margin-bottom:22px;border-radius:var(--pt-radius-sm);background:var(--pt-mist)}
html.pt body .pt-panel__who + .pt-panel__section{margin-top:4px}
html.pt body .pt-danger{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:28px;padding:14px 16px;border:1px solid var(--pt-bad-soft);border-radius:var(--pt-radius-sm);background:var(--pt-bad-soft)}
html.pt body .pt-danger small{display:block;margin-top:2px}
html.pt body .pt-pass{position:relative}
html.pt body .pt-pass .form-control{padding-right:46px}
html.pt body .pt-pass__toggle{position:absolute;top:50%;right:6px;transform:translateY(-50%);width:36px;height:36px;border:0;border-radius:8px;background:transparent;color:var(--pt-muted)}
html.pt body .pt-pass__toggle:hover{color:var(--pt-ink);background:var(--pt-accent-soft)}
html.pt body .pt-switch{display:flex;align-items:center;gap:12px;padding-left:0;min-height:28px}
html.pt body .pt-switch .form-check-input{float:none;margin:0!important;position:static;flex:0 0 auto;width:2.6em;height:1.4em;cursor:pointer}
html.pt body .pt-switch .form-check-label{font-weight:600;color:var(--pt-ink);cursor:pointer}
html.pt body .pt-danger .btn{white-space:nowrap;flex:0 0 auto}

/* ---------- Cord picker (adding penalties) ------------------------------ */
html.pt body .pt-cords{border:1px solid var(--pt-line);border-radius:var(--pt-radius-sm);background:var(--pt-tile);overflow:hidden}
html.pt body .pt-cords__bar{padding:12px;border-bottom:1px solid var(--pt-line-soft);background:var(--pt-mist)}
html.pt body .pt-cords__search{position:relative}
html.pt body .pt-cords__search i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--pt-muted);font-size:14px;pointer-events:none}
html.pt body .pt-cords__search .form-control{padding-left:40px}
html.pt body .pt-cords__tabs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
html.pt body .pt-cords__tabs .pt-filter__chip{min-height:32px;padding:4px 12px;font-size:12.5px}
html.pt body .pt-cords__list{max-height:clamp(160px,calc(100vh - 480px),340px);overflow-y:auto;padding:6px 8px 10px}
html.pt body .pt-cords__group-title{position:sticky;top:0;z-index:1;margin:0 -8px;padding:10px 16px 6px;background:var(--pt-tile);font-family:var(--pt-head);font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--pt-muted)}
html.pt body .pt-cord{display:grid;grid-template-columns:auto 46px minmax(0,1fr) auto;align-items:center;gap:12px;margin:2px 0;padding:10px 12px;border:1px solid transparent;border-radius:10px;cursor:pointer;color:var(--pt-body);transition:background-color .12s,border-color .12s}
html.pt body .pt-cord:hover{background:var(--pt-mist)}
html.pt body .pt-cord.is-on{background:var(--pt-accent-soft);border-color:var(--pt-accent)}
html.pt body .pt-cord input{width:18px;height:18px;margin:0;accent-color:var(--pt-accent);cursor:pointer}
html.pt body .pt-cord__text{line-height:1.35;color:var(--pt-ink)}
html.pt body .pt-cord__code{display:inline-grid;place-items:center;min-width:42px;height:28px;padding:0 6px;border-radius:8px;background:var(--pt-mist);color:var(--pt-ink);font-family:var(--pt-head);font-size:12.5px;font-weight:700;box-shadow:inset 0 0 0 1px var(--pt-line)}
html.pt body .pt-cord.is-on .pt-cord__code{background:var(--pt-accent);color:var(--pt-accent-ink)}
html.pt body .pt-cord__pts{min-width:46px;padding:3px 9px;border-radius:999px;text-align:center;font-family:var(--pt-head);font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
html.pt body .pt-cord__pts.is-minus{background:var(--pt-bad-soft);color:var(--pt-bad)}
html.pt body .pt-cord__pts.is-plus{background:var(--pt-ok-soft);color:var(--pt-ok)}
html.pt body .pt-cord__pts.is-zero{background:var(--pt-mist);color:var(--pt-body)}
html.pt body .pt-cords__none{margin:18px 8px;text-align:center;color:var(--pt-muted)}
html.pt body .pt-cords__sum{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--pt-line-soft);background:var(--pt-mist);font-family:var(--pt-head);font-size:13.5px;font-weight:600;color:var(--pt-body)}
html.pt body .pt-cords__total{font-weight:800;font-variant-numeric:tabular-nums}
html.pt body .pt-cords__total.is-minus{color:var(--pt-bad)}
html.pt body .pt-cords__total.is-plus{color:var(--pt-ok)}
html.pt body .pt-cords__error{margin:0;padding:8px 16px 12px;color:var(--pt-bad);font-size:13.5px;font-weight:600}
html.pt body .pt-cords__error[hidden]{display:none}
html.pt body .pt-add-date{max-width:240px}
html.pt body .modal-header small{display:block;margin-top:2px}

/* ---------- Stat tiles (penalty calendar) ------------------------------- */
html.pt body .pt-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:16px}
html.pt body .pt-stat{display:flex;flex-direction:column;gap:4px;padding:18px 22px;border-radius:var(--pt-radius);background:var(--pt-tile);border:1px solid var(--pt-line-soft);box-shadow:var(--pt-lift);min-width:0}
html.pt body .pt-stat__label{font-family:var(--pt-head);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--pt-muted)}
html.pt body .pt-stat__value{font-family:var(--pt-head);font-size:2rem;font-weight:800;line-height:1.15;color:var(--pt-ink);font-variant-numeric:tabular-nums}
html.pt body .pt-stat__value--text{font-size:1.15rem;line-height:1.35;overflow-wrap:anywhere}
html.pt body .pt-stat__value.is-minus{color:var(--pt-bad)}
html.pt body .pt-stat__value.is-plus{color:var(--pt-ok)}
html.pt body .pt-stat__hint{font-size:13px;color:var(--pt-muted)}
@media (max-width:767.98px){html.pt body .pt-stats{grid-template-columns:1fr}}

/* ---------- Calendar events and details --------------------------------- */
html.pt body .pt-legend{display:flex;flex-wrap:wrap;gap:16px;margin:0 0 14px;font-size:13px;color:var(--pt-muted)}
html.pt body .pt-legend span{display:inline-flex;align-items:center;gap:7px}
html.pt body .pt-legend__dot{width:10px;height:10px;border-radius:3px;display:inline-block}
html.pt body :is(.pt-legend__dot--minus,.fc .pt-ev-minus){background:var(--pt-bad-soft)!important;border-color:var(--pt-bad)!important}
html.pt body :is(.pt-legend__dot--plus,.fc .pt-ev-plus){background:var(--pt-ok-soft)!important;border-color:var(--pt-ok)!important}
html.pt body :is(.pt-legend__dot--zero,.fc .pt-ev-zero){background:var(--pt-mist)!important;border-color:var(--pt-line)!important}
html.pt body .pt-legend__dot{border:1.5px solid}
html.pt body .fc .fc-daygrid-event:is(.pt-ev-minus,.pt-ev-plus,.pt-ev-zero){border-left-width:3px!important;border-radius:6px;padding:2px 6px;cursor:pointer}
html.pt body .fc :is(.pt-ev-minus,.pt-ev-plus,.pt-ev-zero) .fc-event-title{font-family:var(--pt-head);font-weight:700;font-size:12px}
html.pt body .fc .pt-ev-minus :is(.fc-event-title,.fc-event-main){color:var(--pt-bad)!important}
html.pt body .fc .pt-ev-plus :is(.fc-event-title,.fc-event-main){color:var(--pt-ok)!important}
html.pt body .fc .pt-ev-zero :is(.fc-event-title,.fc-event-main){color:var(--pt-body)!important}
html.pt body .fc .fc-daygrid-day:hover{background:var(--pt-accent-soft)}
html.pt body .pt-detail{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--pt-radius-sm);background:var(--pt-mist)}
html.pt body .offcanvas.pt-panel--wide{width:min(620px,100vw)}
html.pt body .pt-detail .pt-cord__code{background:var(--pt-tile)}

/* ---------- Forms in panels and popups: no icon box glued to each field ----
   The older forms put an icon box in front of every input. Inside side panels and popups
   the label already says what the field is, so an icon-only box is hidden and the field
   gets its own rounded corners back. Boxes with text ("$", "%", "weeks") stay. */
html.pt body :is(.offcanvas,.modal) .input-group > :is(.input-group-text,.input-group-append,.input-group-prepend):first-child:has(:is(i,span[class*="fa"]):only-child){display:none}
html.pt body :is(.offcanvas,.modal) .input-group:has(> :is(.input-group-text,.input-group-append,.input-group-prepend):first-child :is(i,span[class*="fa"]):only-child) > :is(.form-control,.form-select,.select2-container,.select2-container .select2-selection){border-radius:var(--pt-radius-sm)!important;margin-left:0!important}
html.pt body :is(.offcanvas,.modal) .input-group:has(> :is(.input-group-text,.input-group-append,.input-group-prepend):first-child :is(i,span[class*="fa"]):only-child) .select2-selection{border-radius:var(--pt-radius-sm)!important}

/* Panel buttons that stay in reach at the bottom of long forms. */
html.pt body .offcanvas .pt-sticky-actions{position:sticky;bottom:-22px;z-index:3;display:flex;justify-content:flex-end;gap:10px;margin:8px -24px -22px;padding:16px 24px;width:calc(100% + 48px)!important;max-width:none;flex:0 0 auto;border-top:1px solid var(--pt-line-soft);background:var(--pt-tile)}
html.pt body .offcanvas .pt-sticky-actions .btn{min-width:110px}
html.pt body table.dataTable td .btn{white-space:nowrap}

/* ---------- Price lists ------------------------------------------------- */
html.pt body .pt-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px;padding:6px;border-radius:var(--pt-radius);background:var(--pt-tile);border:1px solid var(--pt-line-soft);box-shadow:var(--pt-lift);scrollbar-width:thin}
html.pt body .pt-tabs__item{flex:0 0 auto;padding:9px 16px;border-radius:10px;font-family:var(--pt-head);font-size:13.5px;font-weight:600;color:var(--pt-body)!important;text-decoration:none!important;white-space:nowrap}
html.pt body .pt-tabs__item:hover{background:var(--pt-mist);color:var(--pt-ink)!important}
html.pt body .pt-tabs__item.is-active{background:var(--pt-accent);color:var(--pt-accent-ink)!important}
html.pt body .pt-list-intro{margin-bottom:18px}
html.pt body .pt-list-intro__title{margin:0 0 4px;font-size:1.25rem;font-weight:800}
html.pt body .pt-list-intro__lead{margin:0;color:var(--pt-muted);max-width:52rem}
html.pt body .pt-unit{margin-left:4px;font-size:10.5px;letter-spacing:.06em;color:var(--pt-muted);font-weight:700}
html.pt body .pt-price-table .pt-row-off td{opacity:.62}
html.pt body .pt-price-table .pt-row-off td:last-child{opacity:1}
html.pt body .pt-unit-box{min-width:44px;justify-content:center;background:var(--pt-mist)!important;color:var(--pt-body)!important;font-family:var(--pt-head);font-weight:700;font-size:13px}
html.pt body .pt-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0}
html.pt body .pt-facts__item{padding:16px 18px;border-radius:var(--pt-radius-sm);background:var(--pt-mist)}
html.pt body .pt-facts dt{font-family:var(--pt-head);font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--pt-muted)}
html.pt body .pt-facts dd{margin:6px 0 0;font-family:var(--pt-head);font-size:1.35rem;font-weight:800;color:var(--pt-ink);font-variant-numeric:tabular-nums}
@media (max-width:767.98px){html.pt body .pt-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
html.pt body .pt-price-table thead th{white-space:normal!important;vertical-align:bottom;line-height:1.35}
html.pt body .pt-price-table td.pt-strong{min-width:160px}
html.pt body .dropdown-menu .dropdown-item > i{width:18px;margin-right:10px;text-align:center;color:var(--pt-muted)}

/* ---------- Account settings popup ------------------------------------- */
html.pt body .pt-me{display:flex;align-items:center;gap:18px;padding:16px;margin-bottom:10px;border-radius:var(--pt-radius-sm);background:var(--pt-mist)}
html.pt body .pt-me__photo{position:relative;flex:0 0 auto;margin:0;cursor:pointer;border-radius:50%}
html.pt body .pt-me__photo img{width:88px;height:88px;border-radius:50%;object-fit:cover;display:block;background:var(--pt-tile);box-shadow:0 0 0 3px var(--pt-tile)}
html.pt body .pt-me__edit{position:absolute;right:-2px;bottom:-2px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--pt-accent);color:var(--pt-accent-ink);font-size:13px;box-shadow:0 0 0 3px var(--pt-tile)}
html.pt body .pt-me__photo:hover img{filter:brightness(.92)}
html.pt body #profile_image:focus-visible ~ * .pt-me__photo,html.pt body .pt-me__photo:focus-within{outline:2px solid var(--pt-accent);outline-offset:3px}
/* Dashboard tiles: equal height in a row, links lined up along the bottom. */
html.pt body .row > [class*="col"] > .small-box{height:calc(100% - 1rem);display:flex;flex-direction:column}
html.pt body .row > [class*="col"] > .small-box > .inner{flex:1 1 auto}
html.pt body .row > [class*="col"] > .small-box > .small-box-footer{margin-top:auto}

/* ---------- Who can do what -------------------------------------------- */
/* Five roles: one row of five when wide; three then two (each of the two half the row) below that. */
html.pt body .pt-roles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:16px}
html.pt body .pt-roles__card{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:18px 20px;border-radius:var(--pt-radius);background:var(--pt-tile);border:1px solid var(--pt-line-soft);box-shadow:var(--pt-lift)}
html.pt body .pt-roles__text{margin:0;flex:1 1 auto;color:var(--pt-body);font-size:13.5px;line-height:1.45}
html.pt body .pt-roles__count{font-family:var(--pt-head);font-size:12px;font-weight:700;color:var(--pt-muted)}
@media (max-width:1279.98px){
  html.pt body .pt-roles{grid-template-columns:repeat(6,minmax(0,1fr))}
  html.pt body .pt-roles__card{grid-column:span 2}
  html.pt body .pt-roles__card:nth-child(4),html.pt body .pt-roles__card:nth-child(5){grid-column:span 3}
}
@media (max-width:575.98px){
  html.pt body .pt-roles{grid-template-columns:1fr}
  html.pt body .pt-roles__card,html.pt body .pt-roles__card:nth-child(4),html.pt body .pt-roles__card:nth-child(5){grid-column:auto}
}
html.pt body .pt-matrix th:not(:first-child),html.pt body .pt-matrix td:not(:first-child){width:12%}
html.pt body .pt-matrix__feature{display:flex;align-items:flex-start;gap:12px;min-width:240px}
html.pt body .pt-matrix__icon{display:inline-grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border-radius:10px;background:var(--pt-accent-soft);color:var(--pt-accent);font-size:14px}
html.pt body .pt-yes{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--pt-ok-soft);color:var(--pt-ok);font-size:13px}
html.pt body .pt-no{display:inline-grid;place-items:center;width:28px;height:28px;color:var(--pt-muted);opacity:.55;font-size:12px}

/* Contrast: Bootstrap's hint text is a fixed dark gray (unreadable in dark), and muted text on
   the pale "mist" boxes measured 4.4:1. Hints use the theme's muted ink; on mist, body ink. */
html.pt body .form-text{color:var(--pt-muted)!important}
html.pt body :is(.pt-panel__who,.pt-me,.pt-facts__item,.pt-detail,.pt-cords__bar,.pt-cords__sum) :is(.text-muted,small,.form-text,dt){color:var(--pt-body)!important}
html.pt body :is(.pt-panel__who,.pt-me) .pt-avatar--initials{background:var(--pt-tile);color:var(--pt-accent)}

/* Screen-reader-only text inside a scrolling table box escaped it (absolute position) and
   widened the whole page on phones. The box now contains it. */
html.pt body .table-responsive{position:relative}
/* Phones: each price row becomes a small card, label on the left, value on the right. */
@media (max-width:575.98px){
  html.pt body .pt-price-table thead{display:none}
  html.pt body .pt-price-table,html.pt body .pt-price-table tbody{display:block;width:100%}
  html.pt body .pt-price-table tr{display:block;padding:12px 4px;border-bottom:1px solid var(--pt-line-soft)}
  html.pt body .pt-price-table td{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:5px 0!important;border:0!important;text-align:right!important;min-width:0!important}
  html.pt body .pt-price-table td[data-label]::before{content:attr(data-label);flex:0 0 auto;max-width:55%;text-align:left;font-family:var(--pt-head);font-size:12.5px;font-weight:600;color:var(--pt-muted)}
  html.pt body .pt-price-table td:first-child{font-size:1rem}
  html.pt body .pt-price-table td:first-child::before{display:none}
  html.pt body .pt-price-table td:last-child{justify-content:flex-end;padding-top:8px!important}
}
html.pt body thead .pt-unit{color:inherit}

/* ---------- Error pages (resources/views/errors) ------------------------ */
html.pt body.pt-error{min-height:100vh;margin:0;display:grid;place-items:center;padding:24px;background:var(--pt-ground) var(--pt-ridges) bottom/100% 120px no-repeat!important;font-family:var(--pt-text);color:var(--pt-body)}
html.pt body.pt-error .pt-error__card{width:min(520px,100%);padding:40px 36px;text-align:center;border-radius:var(--pt-radius);background:var(--pt-tile);border:1px solid var(--pt-line-soft);box-shadow:var(--pt-lift-hover)}
html.pt body.pt-error .pt-error__logo{width:64px;height:64px;margin-bottom:18px}
html.pt body.pt-error .pt-error__code{margin:0 0 6px;font-family:var(--pt-head);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--pt-muted)}
html.pt body.pt-error .pt-error__title{margin:0 0 12px;font-size:1.6rem;font-weight:800;line-height:1.2;color:var(--pt-ink)}
html.pt body.pt-error .pt-error__text{margin:0 auto 26px;max-width:26rem;line-height:1.6}
html.pt body.pt-error .pt-error__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
html.pt body.pt-error .pt-error__actions .btn{display:inline-flex;align-items:center;gap:8px;min-height:44px}
/* Desktop: the three document buttons stay on one line beside the invoice number column. */
@media (min-width:1200px){html.pt body #table-invoice .pt-doc-links{flex-wrap:nowrap}}
@media (min-width:1500px){html.pt body #table-agency-students .pt-doc-links{flex-wrap:nowrap}}

/* ---------- Agencies ----------------------------------------------------- */
/* Two-letter country code beside a nationality (JP, TW): the same code that leads invoice numbers. */
html.pt body .pt-flag{display:inline-block;min-width:28px;margin-right:6px;padding:2px 6px;border-radius:6px;background:var(--pt-mist);color:var(--pt-ink);font-family:var(--pt-head);font-size:11px;font-weight:700;letter-spacing:.04em;text-align:center;box-shadow:inset 0 0 0 1px var(--pt-line)}

/* ---------- Generate buttons (ID numbers, passwords) ---------------------- */
html.pt body .pt-gen-field{display:flex;gap:8px;align-items:stretch}
html.pt body .pt-gen-field .form-control{flex:1 1 auto;min-width:0}
html.pt body .pt-gen-field .btn,html.pt body .pt-gen-btn{white-space:nowrap}
html.pt body :is(.offcanvas,.modal) .input-group > .form-control:has(+ .pt-gen-btn){border-top-right-radius:0!important;border-bottom-right-radius:0!important}
html.pt body .input-group > .pt-gen-btn{border-top-left-radius:0!important;border-bottom-left-radius:0!important}
html.pt body .pt-gen-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
html.pt body .pt-gen-msg{margin-top:6px;font-size:13px;font-weight:600;color:var(--pt-body)}
html.pt body .pt-gen-msg--error{color:var(--pt-bad)}
html.pt body .pt-gen-flash{animation:pt-gen-flash 1.2s ease-out}
@keyframes pt-gen-flash{0%{box-shadow:0 0 0 3px var(--pt-accent-soft);border-color:var(--pt-accent)}100%{box-shadow:none}}

/* ---------- Photo field (students, accounts) ------------------------------ */
html.pt body .pt-photo{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:var(--pt-radius-sm);background:var(--pt-mist)}
html.pt body .pt-photo__img{flex:0 0 auto;width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:50% 20%;background:var(--pt-tile);box-shadow:0 0 0 3px var(--pt-tile);transition:opacity .2s}
html.pt body .pt-photo__body{min-width:0}
html.pt body .pt-photo__hint{color:var(--pt-body);font-size:12.5px;margin-top:1px}
html.pt body .pt-photo__actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:8px}
html.pt body .pt-photo__remove{display:inline-flex;align-items:center;gap:6px;margin:0;font-size:13px;font-weight:600;color:var(--pt-body);cursor:pointer}
html.pt body .pt-photo__remove input{accent-color:var(--pt-bad)}