/* ================================================================
   Amanuensis — Design System v3
   Aesthetic: Matrix × Frutiger Aero
   Stack: Tabler 1.4 (Bootstrap 5) — sem build pipeline
   ================================================================ */

/* ----------------------------------------------------------------
   Tokens
   ---------------------------------------------------------------- */
:root {
  --tblr-font-sans-serif: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Primary — ciano (une Matrix green + Aero sky) */
  --tblr-primary: #0891b2;
  --tblr-primary-rgb: 8, 145, 178;
  --tblr-link-color: #0891b2;
  --tblr-link-hover-color: #0e7490;
  --am-primary-dark: #0e7490;
  --am-primary-light: #e0f2fe;

  /* Matrix green — acento da sidebar */
  --am-matrix: #00dc82;
  --am-matrix-rgb: 0, 220, 130;
  --am-matrix-faint: rgba(0, 220, 130, 0.12);

  /* Sidebar — espaço profundo */
  --am-sidebar-bg: #060d14;
  --am-sidebar-width: 15rem;
  --am-sidebar-border: rgba(0, 220, 130, 0.15);

  /* Body — gradiente Frutiger Aero sky */
  --tblr-body-bg: #d4e9f6;
  --tblr-body-color: #0c2340;
  --tblr-border-color: rgba(8, 145, 178, 0.18);
  --tblr-muted-color: #4d7698;

  /* Glass */
  --am-glass-bg: rgba(255, 255, 255, 0.78);
  --am-glass-border: rgba(255, 255, 255, 0.66);
  --am-glass-shadow: 0 4px 24px rgba(8, 116, 163, 0.09), 0 1px 3px rgba(0,0,0,0.05);
  --am-glass-top: inset 0 1px 0 rgba(255,255,255,0.84);

  /* Cards */
  --tblr-card-border-color: var(--am-glass-border);
  --tblr-card-border-radius: 1rem;
  --tblr-card-box-shadow: var(--am-glass-shadow);

  --am-header-h: 68px;
}

/* ----------------------------------------------------------------
   Base
   ---------------------------------------------------------------- */
html, body { min-height: 100%; }

body {
  font-family: var(--tblr-font-sans-serif);
  color: var(--tblr-body-color);
  background:
    radial-gradient(ellipse 80% 50% at 15% -5%, rgba(186,230,253,0.55) 0%, transparent 55%),
    radial-gradient(ellipse 55% 40% at 88% 108%, rgba(167,243,208,0.22) 0%, transparent 50%),
    linear-gradient(160deg, #bdd9f4 0%, #d2e8f5 35%, #dfeef9 65%, #e8f3fb 100%);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
}

/* ----------------------------------------------------------------
   Sidebar — Matrix phosphor dark
   ---------------------------------------------------------------- */
.navbar-vertical {
  --tblr-navbar-bg: var(--am-sidebar-bg);
  --tblr-navbar-color: rgba(155, 215, 188, 0.65);
  --tblr-navbar-hover-color: var(--am-matrix);
  --tblr-navbar-active-color: var(--am-matrix);
  --tblr-navbar-brand-color: #e8fff6;
  --tblr-navbar-brand-hover-color: #fff;
  --tblr-navbar-border-color: var(--am-sidebar-border);
  background: var(--am-sidebar-bg);
  border-right: 1px solid var(--am-sidebar-border) !important;
  position: relative;
  overflow: hidden;
}

/* scanline + glow de topo */
.navbar-vertical::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(ellipse 100% 40% at 50% 0%, rgba(0,220,130,0.08) 0%, transparent 70%),
    repeating-linear-gradient(
      0deg,
      transparent 0px,
      transparent 3px,
      rgba(0, 220, 130, 0.014) 3px,
      rgba(0, 220, 130, 0.014) 4px
    );
}

.navbar-vertical > * { position: relative; z-index: 1; }

/* Brand row */
.navbar-vertical .navbar-brand {
  height: var(--am-header-h);
  border-bottom: 1px solid var(--am-sidebar-border);
  padding: 1rem 1.25rem;
  gap: .75rem;
  align-items: center;
}

/* Logo */
.am-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--am-matrix) 0%, #00b86b 100%);
  color: var(--am-sidebar-bg);
  font-weight: 900;
  font-size: 14px;
  letter-spacing: -.03em;
  box-shadow: 0 0 22px rgba(0,220,130,0.40), 0 4px 12px rgba(0,0,0,0.40);
}

.am-brand-text {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.am-brand-text strong {
  display: block;
  color: #e2fef0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.01em;
}

.am-brand-text small {
  display: block;
  color: rgba(0, 220, 130, 0.48);
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .14em;
}

/* Nav links */
.navbar-vertical .nav-item { margin: 0 .5rem; }

.navbar-vertical .nav-link {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .58rem .75rem .58rem .72rem;
  border-radius: 8px;
  border-left: 2px solid transparent;
  color: rgba(155, 215, 188, 0.62);
  font-size: 13.5px;
  font-weight: 500;
  transition: background .14s, color .14s, border-color .14s;
}

.navbar-vertical .nav-link:hover {
  background: rgba(0, 220, 130, 0.08);
  color: rgba(0, 220, 130, 0.90);
}

.navbar-vertical .nav-link.active {
  background: rgba(0, 220, 130, 0.13);
  color: var(--am-matrix);
  border-left-color: var(--am-matrix);
  font-weight: 600;
}

.navbar-vertical .nav-link-icon {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  color: rgba(0, 220, 130, 0.50);
  flex-shrink: 0;
  transition: color .14s;
}

.navbar-vertical .nav-link:hover .nav-link-icon { color: rgba(0,220,130,0.88); }
.navbar-vertical .nav-link.active .nav-link-icon {
  color: var(--am-matrix);
  text-shadow: 0 0 10px rgba(0,220,130,0.6);
}

/* Section headings */
.navbar-vertical .nav-link-header {
  padding: .72rem .85rem .3rem;
  color: rgba(0, 220, 130, 0.30);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: default;
  pointer-events: none;
  background: none !important;
  border-left: 2px solid transparent;
}

/* Footer */
.navbar-footer {
  padding: .75rem;
  border-top: 1px solid var(--am-sidebar-border);
}

.am-status-pill {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .55rem .75rem;
  border-radius: 8px;
  background: rgba(0, 220, 130, 0.07);
  border: 1px solid rgba(0, 220, 130, 0.13);
  margin-bottom: .5rem;
}

.am-status-dot {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--am-matrix);
  box-shadow: 0 0 0 3px rgba(0, 220, 130, 0.22);
}

.am-status-text strong {
  display: block;
  color: rgba(230, 255, 244, 0.90);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
}

.am-status-text span {
  display: block;
  color: rgba(0, 220, 130, 0.44);
  font-size: 10.5px;
  line-height: 1.2;
}

/* Mobile toggler */
.navbar-vertical .navbar-toggler {
  border-color: rgba(0, 220, 130, 0.25);
  color: rgba(0, 220, 130, 0.80);
}

/* Collapse button */
.am-sidebar-collapse-btn {
  display: none;
  width: 28px;
  height: 28px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0, 220, 130, 0.20);
  border-radius: 7px;
  background: transparent;
  color: rgba(0, 220, 130, 0.50);
  cursor: pointer;
  transition: all .13s;
  margin-left: auto;
  flex-shrink: 0;
}

.am-sidebar-collapse-btn:hover {
  background: rgba(0, 220, 130, 0.10);
  color: var(--am-matrix);
}

@media (min-width: 992px) {
  .am-sidebar-collapse-btn { display: flex; }
}

/* Collapsed sidebar */
@media (min-width: 992px) {
  body.sidebar-collapsed .navbar-vertical { width: 64px; }
  body.sidebar-collapsed .navbar-vertical .am-brand-text,
  body.sidebar-collapsed .navbar-vertical .nav-link-title,
  body.sidebar-collapsed .navbar-vertical .nav-link-header,
  body.sidebar-collapsed .navbar-vertical .am-status-text,
  body.sidebar-collapsed .navbar-vertical .am-sidebar-collapse-btn { display: none; }
  body.sidebar-collapsed .navbar-vertical .nav-link {
    justify-content: center;
    gap: 0;
    padding-inline: 0;
    border-left-color: transparent !important;
  }
  body.sidebar-collapsed .navbar-vertical .nav-item { margin: 0 .35rem; }
  body.sidebar-collapsed .navbar-vertical .navbar-brand { justify-content: center; padding-inline: .75rem; }
  body.sidebar-collapsed .navbar-expand-lg.navbar-vertical ~ .page-wrapper { margin-left: 64px; }
}

/* ----------------------------------------------------------------
   Page layout
   ---------------------------------------------------------------- */
.page-wrapper { min-height: 100vh; }
.page-body { padding: 1.5rem 0 2.5rem; }

/* ----------------------------------------------------------------
   Mobile nav
   ---------------------------------------------------------------- */
.am-mobile-topbar,
.am-mobile-dock { display: none; }

@media (max-width: 991.98px) {
  .am-mobile-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    top: 0;
    inset-x: 0;
    z-index: 1030;
    height: 56px;
    padding: 0 1rem;
    background: rgba(210, 235, 248, 0.94);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border-bottom: 1px solid rgba(8, 145, 178, 0.14);
    box-shadow: 0 1px 12px rgba(8, 116, 163, 0.09);
  }

  .am-mobile-dock {
    display: block;
    position: fixed;
    bottom: 0;
    inset-x: 0;
    z-index: 1030;
    background: rgba(210, 235, 248, 0.96);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border-top: 1px solid rgba(8, 145, 178, 0.15);
    padding: .4rem .75rem;
    padding-bottom: calc(.4rem + env(safe-area-inset-bottom));
    box-shadow: 0 -4px 20px rgba(8, 116, 163, 0.09);
  }

  .am-dock-scroll {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: .35rem;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .am-dock-scroll::-webkit-scrollbar { display: none; }

  .am-dock-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .18rem;
    min-width: 4.25rem;
    flex-shrink: 0;
    padding: .5rem .4rem;
    border-radius: 10px;
    border: 1px solid rgba(8, 145, 178, 0.16);
    background: rgba(255, 255, 255, 0.62);
    color: #4d7698;
    font-size: 9.5px;
    font-weight: 600;
    text-decoration: none;
    transition: all .13s;
  }

  .am-dock-item i { font-size: 1.1rem; }

  .am-dock-item.active {
    color: var(--tblr-primary);
    background: rgba(8, 145, 178, 0.12);
    border-color: rgba(8, 145, 178, 0.32);
  }

  .page-wrapper {
    padding-top: 56px;
    padding-bottom: 5.5rem;
  }
}

@media (min-width: 992px) {
  .am-mobile-topbar,
  .am-mobile-dock { display: none !important; }
}

/* ----------------------------------------------------------------
   Glass cards — Frutiger Aero
   ---------------------------------------------------------------- */
.card {
  background: var(--am-glass-bg);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border: 1px solid var(--am-glass-border) !important;
  border-radius: var(--tblr-card-border-radius) !important;
  box-shadow: var(--am-glass-shadow), var(--am-glass-top);
  transition: box-shadow .18s, transform .18s;
}

.card:hover {
  box-shadow:
    0 8px 32px rgba(8, 116, 163, 0.13),
    0 2px 6px rgba(0,0,0,0.06),
    var(--am-glass-top);
}

.card-header {
  background: rgba(255,255,255,0.42);
  border-bottom: 1px solid rgba(8, 145, 178, 0.12) !important;
  border-radius: calc(1rem - 1px) calc(1rem - 1px) 0 0 !important;
}

/* ----------------------------------------------------------------
   Buttons
   ---------------------------------------------------------------- */
.btn-primary {
  background: linear-gradient(135deg, #0891b2 0%, #0e7490 100%);
  border-color: #0891b2;
  box-shadow: 0 4px 14px rgba(8, 145, 178, 0.32);
}

.btn-primary:hover, .btn-primary:focus {
  background: linear-gradient(135deg, #0e7490 0%, #0c6680 100%);
  border-color: #0e7490;
  box-shadow: 0 6px 18px rgba(8, 145, 178, 0.40);
  transform: translateY(-1px);
}

.btn-primary:active { transform: translateY(0); box-shadow: 0 2px 8px rgba(8,145,178,0.28); }

/* ----------------------------------------------------------------
   Forms
   ---------------------------------------------------------------- */
.form-control,
.form-select {
  background: rgba(255,255,255,0.82);
  border-color: rgba(8, 145, 178, 0.22);
  backdrop-filter: blur(8px);
}

.form-control:focus,
.form-select:focus {
  border-color: rgba(8, 145, 178, 0.62);
  box-shadow: 0 0 0 .2rem rgba(8, 145, 178, 0.14);
  background: rgba(255,255,255,0.96);
}

/* ----------------------------------------------------------------
   Page kicker
   ---------------------------------------------------------------- */
.page-kicker {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .28rem .72rem;
  border-radius: 999px;
  border: 1px solid rgba(8, 145, 178, 0.22);
  background: rgba(8, 145, 178, 0.09);
  color: #0e7490;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}

/* ----------------------------------------------------------------
   Flash messages
   ---------------------------------------------------------------- */
.flash-stack {
  display: flex;
  flex-direction: column;
  gap: .65rem;
  margin-bottom: 1rem;
}

.flash {
  display: flex;
  gap: .75rem;
  align-items: flex-start;
  padding: .85rem 1rem;
  border-radius: .75rem;
  border: 1px solid;
  font-size: .88rem;
  line-height: 1.45;
  backdrop-filter: blur(12px);
}

.flash-success { background: rgba(240,253,244,0.92); border-color: #bbf7d0; color: #14532d; }
.flash-error   { background: rgba(254,242,242,0.92); border-color: #fecaca; color: #991b1b; }
.flash-warning { background: rgba(255,251,235,0.92); border-color: #fde68a; color: #92400e; }
.flash-info    { background: rgba(239,246,255,0.92); border-color: #bfdbfe; color: #1e40af; }

/* ----------------------------------------------------------------
   Section nav (sticky pill bar)
   ---------------------------------------------------------------- */
.section-nav {
  position: sticky;
  top: .5rem;
  z-index: 20;
  display: flex;
  gap: .3rem;
  overflow-x: auto;
  padding: .4rem;
  margin-bottom: 1.25rem;
  border: 1px solid rgba(255,255,255,0.70);
  border-radius: .75rem;
  background: rgba(255,255,255,0.84);
  backdrop-filter: blur(16px) saturate(160%);
  box-shadow: 0 2px 12px rgba(8,116,163,0.06), var(--am-glass-top);
  scrollbar-width: none;
}

.section-nav::-webkit-scrollbar { display: none; }

.section-nav a {
  white-space: nowrap;
  border-radius: 6px;
  padding: .45rem .8rem;
  color: #4d7698;
  font-size: .78rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .13s;
}

.section-nav a:hover,
.section-nav a.is-active {
  color: var(--tblr-primary);
  background: rgba(8, 145, 178, 0.10);
}

/* ----------------------------------------------------------------
   Odonto tabs
   ---------------------------------------------------------------- */
.odonto-tabs {
  display: flex;
  gap: .25rem;
  overflow-x: auto;
  padding: .35rem;
  border-radius: .65rem;
  border: 1px solid rgba(255,255,255,0.65);
  background: rgba(255,255,255,0.80);
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 6px rgba(8,116,163,0.06);
  scrollbar-width: none;
  margin-bottom: 1rem;
}

.odonto-tabs::-webkit-scrollbar { display: none; }

.odonto-tabs a {
  white-space: nowrap;
  border-radius: .45rem;
  padding: .45rem .9rem;
  color: #4d7698;
  font-size: .8rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .12s;
  border: 1px solid transparent;
}

.odonto-tabs a:hover { color: var(--tblr-primary); background: rgba(8,145,178,0.08); }
.odonto-tabs a.is-active { color: #fff; background: var(--tblr-primary); border-color: var(--tblr-primary); }

/* ----------------------------------------------------------------
   Tooth grid
   ---------------------------------------------------------------- */
.tooth-grid {
  display: grid;
  grid-template-columns: repeat(16, minmax(0, 1fr));
  gap: .3rem;
}

.tooth-square {
  border-radius: .45rem;
  height: 1.9rem;
  font-size: .7rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all .1s;
}

.tooth-square.selected {
  outline: 3px solid rgba(8,145,178,0.30);
  background: var(--tblr-primary) !important;
  color: white !important;
}

.tone-healthy    { background: rgba(235,248,255,0.90); color: #4d7698; border-color: rgba(8,145,178,0.16); }
.tone-planned    { background: var(--tblr-primary); color: white; }
.tone-in_progress { background: #f59e0b; color: white; }
.tone-completed  { background: #10b981; color: white; }
.tone-problem    { background: #f43f5e; color: white; }
.tone-neutral    { background: rgba(218,235,245,0.90); color: #4d7698; border-color: rgba(8,145,178,0.14); }
.swatch-healthy    { background: rgba(235,248,255,0.90); }
.swatch-planned    { background: var(--tblr-primary); }
.swatch-in_progress { background: #f59e0b; }
.swatch-completed  { background: #10b981; }
.swatch-problem    { background: #f43f5e; }

/* ----------------------------------------------------------------
   Drawer (substitui modal centrado — desliza da direita)
   ---------------------------------------------------------------- */
[x-cloak] { display: none !important; }

.app-modal-lock { overflow: hidden; }

.app-modal-shell {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: none;
  align-items: stretch;
  justify-content: flex-end;
}

.app-modal-shell.is-open { display: flex; }

.app-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(6, 13, 20, 0.55);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.app-modal-window {
  position: relative;
  z-index: 1;
  width: min(560px, 96vw);
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: rgba(232, 246, 255, 0.97);
  backdrop-filter: blur(32px) saturate(180%);
  -webkit-backdrop-filter: blur(32px) saturate(180%);
  border-left: 1px solid rgba(8, 145, 178, 0.22);
  box-shadow: -8px 0 48px rgba(8, 116, 163, 0.16), -2px 0 8px rgba(0,0,0,0.08);
  animation: am-drawer-in .22s cubic-bezier(.4,0,.2,1);
}

@keyframes am-drawer-in {
  from { transform: translateX(100%); }
  to   { transform: translateX(0); }
}

.app-modal-head {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px 12px;
  border-bottom: 1px solid rgba(8, 145, 178, 0.14);
  background: linear-gradient(135deg, rgba(8,145,178,0.09) 0%, rgba(255,255,255,0.60) 100%);
  flex-shrink: 0;
}

.app-modal-kicker {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #4d7698;
  margin-bottom: 3px;
}

.app-modal-title {
  color: var(--tblr-body-color);
  font-size: 16px;
  font-weight: 700;
  margin: 0;
}

.app-modal-close {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(8, 145, 178, 0.20);
  border-radius: 9px;
  background: rgba(255,255,255,0.72);
  color: #4d7698;
  font-size: 20px;
  cursor: pointer;
  transition: all .13s;
  flex-shrink: 0;
}

.app-modal-close:hover {
  background: rgba(8, 145, 178, 0.10);
  color: var(--tblr-primary);
  border-color: rgba(8, 145, 178, 0.32);
}

.app-modal-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: rgba(224, 242, 252, 0.60);
}

.app-modal-body > .page-body {
  padding: 1.25rem 1.5rem 1.5rem;
}

.app-modal-body .page-wrapper {
  margin-left: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: transparent;
}

.app-modal-body .container-xl {
  max-width: none !important;
  width: 100%;
}

.app-modal-body.is-loading {
  pointer-events: none;
}

.app-modal-loading,
.app-modal-error {
  min-height: 12rem;
  display: grid;
  place-items: center;
  gap: .75rem;
  padding: 2rem;
  color: #4d7698;
  text-align: center;
}

.app-modal-loading {
  align-content: center;
}

.slot-tile {
  width: 100%;
  min-height: 3.35rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .1rem;
  border: 1px solid rgba(8, 145, 178, 0.20);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--tblr-primary);
  text-align: center;
  transition: border-color .14s, background .14s, transform .14s;
}

.slot-tile span {
  font-size: .86rem;
  font-weight: 700;
  line-height: 1.1;
}

.slot-tile small {
  color: var(--tblr-muted-color);
  font-size: .68rem;
  line-height: 1.1;
}

.slot-tile:not(.is-disabled):hover {
  background: rgba(var(--tblr-primary-rgb), .08);
  border-color: rgba(var(--tblr-primary-rgb), .42);
}

.slot-tile.is-selected {
  background: var(--tblr-primary);
  border-color: var(--tblr-primary);
  color: #fff;
  box-shadow: 0 0 0 3px rgba(var(--tblr-primary-rgb), .16);
}

.slot-tile.is-selected small {
  color: rgba(255, 255, 255, .76);
}

.slot-tile.is-disabled {
  border-color: rgba(108, 117, 125, .18);
  background: rgba(108, 117, 125, .08);
  color: rgba(108, 117, 125, .62);
  cursor: not-allowed;
}

.agenda-week-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(15.5rem, 1fr));
  min-width: 108rem;
  gap: .75rem;
  padding-bottom: .25rem;
}

.agenda-day {
  min-height: 32rem;
  padding: 1rem;
  border: 1px solid rgba(8, 145, 178, .12);
  border-radius: 8px;
  background: rgba(255, 255, 255, .54);
}

.agenda-day.is-today {
  background: rgba(var(--tblr-primary-rgb), .06);
  border-color: rgba(var(--tblr-primary-rgb), .28);
}

.agenda-day-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding-bottom: .6rem;
  margin-bottom: .75rem;
  border-bottom: 1px solid rgba(8, 145, 178, .12);
}

.agenda-day-head h3 {
  margin: 0;
  color: var(--tblr-muted-color);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.agenda-event {
  display: block;
  min-height: 7.75rem;
  padding: .85rem .9rem;
  border-radius: 8px;
  color: var(--tblr-body-color);
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(8, 116, 163, .08);
  transition: box-shadow .14s, transform .14s;
}

.agenda-event:hover {
  box-shadow: 0 10px 28px rgba(8, 116, 163, .14);
  text-decoration: none;
  transform: translateY(-1px);
}

.agenda-event-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .55rem;
}

.agenda-event-time {
  color: var(--tblr-primary);
  font-size: .94rem;
  font-weight: 800;
  line-height: 1.15;
}

.agenda-event-title {
  margin: 0 0 .55rem;
  color: #0c2340;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.agenda-event-meta {
  display: grid;
  gap: .35rem;
  color: var(--tblr-muted-color);
  font-size: .78rem;
  line-height: 1.25;
}

.agenda-event-meta span {
  display: flex;
  align-items: flex-start;
  gap: .35rem;
}

.agenda-event-meta i {
  flex: 0 0 auto;
  margin-top: .05rem;
  font-size: .9rem;
}

.agenda-day-actions {
  display: flex;
  gap: .35rem;
  margin-top: .75rem;
}

@media (max-width: 991px) {
  .agenda-week-grid {
    display: flex;
    min-width: 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  }

  .agenda-day {
    width: min(24rem, calc(100vw - 2rem));
    flex: 0 0 auto;
    scroll-snap-align: start;
  }
}

body.embedded-modal .navbar-vertical,
body.embedded-modal .am-mobile-topbar,
body.embedded-modal .am-mobile-dock,
body.embedded-modal .page-header-sticky { display: none !important; }

body.embedded-modal .page-wrapper {
  margin-left: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: transparent;
}

body.embedded-modal .page-body { padding: 1.25rem 1.5rem 1.5rem !important; }

body.embedded-modal .sticky-actions {
  position: sticky;
  bottom: 0;
  z-index: 5;
}

@media (max-width: 767px) {
  .app-modal-shell { align-items: flex-end; }
  .app-modal-window {
    width: 100%;
    height: 93vh;
    border-left: 0;
    border-radius: 20px 20px 0 0;
    border-top: 1px solid rgba(8, 145, 178, 0.22);
    animation-name: am-drawer-up;
  }
}

@keyframes am-drawer-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}

/* ----------------------------------------------------------------
   Agenda components
   ---------------------------------------------------------------- */
.od-seg {
  display: inline-flex;
  gap: .1rem;
  padding: .2rem;
  border-radius: 8px;
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(8, 145, 178, 0.15);
}

.od-seg a,
.od-seg button {
  display: inline-flex;
  align-items: center;
  border-radius: 6px;
  padding: .38rem .72rem;
  font-size: .76rem;
  font-weight: 600;
  color: #4d7698;
  text-decoration: none;
  background: none;
  border: none;
  transition: all .12s;
  white-space: nowrap;
}

.od-seg .is-active {
  background: rgba(255,255,255,0.92);
  color: var(--tblr-primary);
  box-shadow: 0 1px 4px rgba(8,116,163,0.10);
}

.od-pro-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  border-radius: 999px;
  border: 1.5px solid rgba(8,145,178,0.20);
  background: rgba(255,255,255,0.70);
  padding: .35rem .7rem;
  color: #4d7698;
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .12s;
}

.od-pro-chip:hover,
.od-pro-chip.is-active {
  border-color: var(--tblr-primary);
  background: rgba(8, 145, 178, 0.10);
  color: var(--tblr-primary);
}

.od-ag-calendar {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: .75rem;
  background: rgba(255,255,255,0.80);
  backdrop-filter: blur(20px);
  box-shadow: var(--am-glass-shadow);
}

.od-week-head {
  display: grid;
  position: sticky;
  top: 0;
  z-index: 10;
  background: rgba(248,252,255,0.92);
  border-bottom: 1px solid rgba(8,145,178,0.12);
}

.od-week-head-cell {
  min-width: 130px;
  padding: .75rem .5rem;
  text-align: center;
  border-left: 1px solid rgba(8,145,178,0.09);
}

.od-week-head-cell:first-child { border-left: 0; }
.od-week-head-cell.is-today { background: rgba(8, 145, 178, 0.08); }

.od-week-head-cell .dow {
  color: #4d7698;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.od-week-head-cell .dlabel {
  margin-top: .12rem;
  color: var(--tblr-body-color);
  font-size: 1rem;
  font-weight: 800;
}

.od-week-head-cell.is-today .dow,
.od-week-head-cell.is-today .dlabel { color: var(--tblr-primary); }

.od-week-outer {
  overflow: auto;
  max-height: 72vh;
  scroll-behavior: smooth;
}

.od-week-body {
  display: grid;
  grid-template-columns: 64px 1fr;
}

.od-week-times {
  border-right: 1px solid rgba(8,145,178,0.09);
  position: sticky;
  left: 0;
  z-index: 4;
  background: rgba(248,252,255,0.97);
}

.od-time-row {
  height: 64px !important;
  min-height: 64px;
  box-sizing: border-box;
  padding: 0 .4rem;
  border-bottom: 1px solid rgba(8,145,178,0.07);
  color: #4d7698;
  font-size: .6rem;
  font-weight: 700;
  text-align: right;
  line-height: 64px;
}

.od-week-grid { display: grid; min-width: 0; }

.od-day-col {
  position: relative;
  border-left: 1px solid rgba(8,145,178,0.07);
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    transparent 23px,
    rgba(8,145,178,0.055) 23px,
    rgba(8,145,178,0.055) 24px
  );
  background-size: 100% 64px;
}

.od-day-col:first-child { border-left: 0; }

.od-ag-event {
  position: absolute;
  overflow: hidden;
  border-radius: 8px;
  padding: .55rem .65rem;
  font-size: .78rem;
  cursor: pointer;
  z-index: 2;
  transition: box-shadow .12s, transform .12s;
}

.od-ag-event:hover {
  z-index: 5;
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(8,116,163,0.18);
}

.od-ag-event .ev-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .45rem;
  margin-bottom: .25rem;
}

.od-ag-event .ev-time {
  color: var(--tblr-primary);
  font-size: .65rem;
  font-weight: 600;
  opacity: .85;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.od-ag-event .ev-tag {
  flex: 0 0 auto;
  max-width: 46%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.od-ag-event .ev-name {
  color: #0c2340;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.od-ag-event .ev-meta {
  font-size: .65rem;
  opacity: .80;
  margin-top: .15rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.od-empty-day {
  position: absolute;
  top: 3.5rem;
  left: .5rem;
  right: .5rem;
  border: 1px dashed rgba(8,145,178,0.25);
  border-radius: 7px;
  padding: .5rem;
  text-align: center;
  color: #4d7698;
  font-size: .7rem;
}

.od-floating-scroll {
  position: fixed;
  right: 1.25rem;
  bottom: calc(1.25rem + env(safe-area-inset-bottom));
  z-index: 45;
  display: flex;
  flex-direction: column;
  gap: .45rem;
}

@media (max-width: 991.98px) {
  .od-floating-scroll { bottom: calc(5.5rem + env(safe-area-inset-bottom)); }
}

.od-floating-btn {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,0.72);
  border-radius: 12px;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(12px);
  color: var(--tblr-primary);
  box-shadow: 0 4px 16px rgba(8,116,163,0.18), var(--am-glass-top);
  font-size: 1.1rem;
  cursor: pointer;
  transition: all .13s;
}

.od-floating-btn:hover {
  background: var(--tblr-primary);
  color: #fff;
  box-shadow: 0 6px 20px rgba(8,145,178,0.38);
  border-color: var(--tblr-primary);
}

/* ----------------------------------------------------------------
   Patient tabs
   ---------------------------------------------------------------- */
.am-tabs {
  display: flex;
  gap: .15rem;
  overflow-x: auto;
  border-bottom: 2px solid rgba(8, 145, 178, 0.15);
  margin-bottom: 1.25rem;
  scrollbar-width: none;
}

.am-tabs::-webkit-scrollbar { display: none; }

.am-tabs a {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  padding: .65rem .95rem;
  color: #4d7698;
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .12s;
}

.am-tabs a:hover { color: var(--tblr-primary); }
.am-tabs a.is-active { border-bottom-color: var(--tblr-primary); color: var(--tblr-primary); }

/* ----------------------------------------------------------------
   Clinical editor
   ---------------------------------------------------------------- */
.draft-workspace { display: grid; gap: 1rem; }

@media (min-width: 992px) {
  .draft-workspace { grid-template-columns: 1.1fr .9fr; align-items: start; }
}

.draft-field {
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: .65rem;
  background: rgba(255,255,255,0.80);
  backdrop-filter: blur(12px);
  padding: .85rem;
  display: grid;
  gap: .6rem;
}

.draft-field-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.draft-field-head strong {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #4d7698;
}

.draft-toolbar { display: flex; flex-wrap: wrap; gap: .4rem; }

.draft-toolbar button {
  border: 1px solid rgba(8,145,178,0.20);
  background: rgba(255,255,255,0.72);
  color: #0c2340;
  border-radius: 999px;
  padding: .3rem .65rem;
  font-size: .7rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .13s;
}

.draft-toolbar button:hover {
  background: rgba(8,145,178,0.10);
  border-color: rgba(8,145,178,0.35);
  color: var(--tblr-primary);
}

.draft-input {
  width: 100%;
  min-height: 8.5rem;
  resize: vertical;
  border: 1px solid rgba(8,145,178,0.20);
  border-radius: .55rem;
  background: rgba(255,255,255,0.82);
  padding: .8rem .9rem;
  font-size: .88rem;
  line-height: 1.6;
  color: var(--tblr-body-color);
  font-family: inherit;
  transition: all .13s;
}

.draft-input:focus {
  outline: none;
  border-color: rgba(8,145,178,0.55);
  box-shadow: 0 0 0 3px rgba(8,145,178,0.10);
  background: rgba(255,255,255,0.96);
}

.draft-preview-document {
  position: sticky;
  top: 5rem;
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: .65rem;
  background: rgba(255,255,255,0.86);
  backdrop-filter: blur(16px);
  padding: .9rem;
  box-shadow: var(--am-glass-shadow), var(--am-glass-top);
}

/* ----------------------------------------------------------------
   Sticky actions
   ---------------------------------------------------------------- */
.sticky-actions {
  position: sticky;
  bottom: .75rem;
  z-index: 20;
  padding: .85rem;
  border-radius: .75rem;
  border: 1px solid rgba(255,255,255,0.72);
  background: rgba(232, 246, 255, 0.94);
  backdrop-filter: blur(16px) saturate(160%);
  box-shadow: 0 8px 24px rgba(8,116,163,0.10), var(--am-glass-top);
}

@media (max-width: 991.98px) {
  .sticky-actions { bottom: calc(5.5rem + env(safe-area-inset-bottom)); }
}

/* ----------------------------------------------------------------
   KPI stat tiles
   ---------------------------------------------------------------- */
.stat-tile {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding: 1rem 1.1rem;
  border-radius: .75rem;
  border: 1px solid var(--am-glass-border);
  background: var(--am-glass-bg);
  backdrop-filter: blur(20px) saturate(160%);
  box-shadow: var(--am-glass-shadow), var(--am-glass-top);
  transition: box-shadow .18s, transform .18s;
}

.stat-tile:hover {
  box-shadow: 0 8px 28px rgba(8,116,163,0.15), var(--am-glass-top);
  transform: translateY(-2px);
}

.stat-tile-label {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #4d7698;
}

.stat-tile-value {
  font-size: 1.6rem;
  font-weight: 800;
  color: var(--tblr-body-color);
  letter-spacing: -.02em;
  line-height: 1;
}

.stat-tile-sub { font-size: .76rem; color: #4d7698; }

/* ----------------------------------------------------------------
   Quick actions
   ---------------------------------------------------------------- */
.quick-action {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .85rem 1rem;
  border-radius: .75rem;
  font-size: .85rem;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid var(--am-glass-border);
  background: var(--am-glass-bg);
  backdrop-filter: blur(16px);
  box-shadow: var(--am-glass-shadow), var(--am-glass-top);
  transition: all .14s;
  color: var(--tblr-body-color);
}

.quick-action:hover {
  transform: translateY(-2px);
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(8,116,163,0.14), var(--am-glass-top);
  color: var(--tblr-body-color);
}

.quick-action-icon {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1.1rem;
}

/* ----------------------------------------------------------------
   Pending rows
   ---------------------------------------------------------------- */
.pending-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .65rem .85rem;
  border-radius: .6rem;
  border: 1px solid rgba(255,255,255,0.55);
  background: rgba(255,255,255,0.50);
  text-decoration: none;
  transition: all .13s;
}

.pending-row:hover {
  background: rgba(255,255,255,0.82);
  border-color: rgba(8,145,178,0.20);
  text-decoration: none;
}

/* ----------------------------------------------------------------
   Animations
   ---------------------------------------------------------------- */
.fade-in { animation: am-fadein .22s ease-out; }

@keyframes am-fadein {
  from { opacity: 0; transform: translateY(7px); }
  to   { opacity: 1; transform: none; }
}

/* ----------------------------------------------------------------
   Dropdown
   ---------------------------------------------------------------- */
.dropdown-menu {
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: .65rem;
  box-shadow: 0 8px 32px rgba(8,116,163,0.12), var(--am-glass-top);
}

/* ----------------------------------------------------------------
   List group overrides
   ---------------------------------------------------------------- */
.list-group-item {
  background: rgba(255,255,255,0.52);
  border-color: rgba(8,145,178,0.10);
}

.list-group-item-action:hover,
.list-group-item-action:focus {
  background: rgba(255,255,255,0.82);
  color: var(--tblr-body-color);
}

/* ----------------------------------------------------------------
   Print
   ---------------------------------------------------------------- */
@media print {
  .navbar-vertical,
  .am-mobile-topbar,
  .am-mobile-dock,
  .sticky-actions,
  .od-floating-scroll,
  .am-sidebar-collapse-btn { display: none !important; }

  body {
    background: #fff !important;
  }

  .page-wrapper { margin-left: 0 !important; padding: 0 !important; }
  .page-body { padding: 0 !important; }

  .card {
    background: #fff !important;
    box-shadow: none !important;
    border: 1px solid #ddd !important;
    backdrop-filter: none !important;
  }
}

/* ================================================================
   Tailwind compatibility shim
   Mantido para compatibilidade com templates ainda não migrados.
   ================================================================ */

/* --- Layout: Flex --- */
.flex          { display: flex !important; }
.inline-flex   { display: inline-flex !important; }
.flex-col      { flex-direction: column !important; }
.flex-row      { flex-direction: row !important; }
.flex-wrap     { flex-wrap: wrap !important; }
.flex-1        { flex: 1 1 0% !important; }
.flex-shrink-0,.shrink-0 { flex-shrink: 0 !important; }
.items-center  { align-items: center !important; }
.items-start   { align-items: flex-start !important; }
.items-end     { align-items: flex-end !important; }
.justify-center  { justify-content: center !important; }
.justify-between { justify-content: space-between !important; }
.justify-end     { justify-content: flex-end !important; }

/* --- Layout: Grid --- */
.grid          { display: grid !important; }
.grid-cols-1   { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; }
.grid-cols-2   { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.grid-cols-3   { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.grid-cols-4   { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.grid-cols-5   { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
.grid-cols-7   { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
.col-span-2    { grid-column: span 2 / span 2 !important; }
.col-span-3    { grid-column: span 3 / span 3 !important; }

/* --- Space between children --- */
.space-y-0\.5 > * + * { margin-top: .125rem; }
.space-y-1    > * + * { margin-top: .25rem; }
.space-y-1\.5 > * + * { margin-top: .375rem; }
.space-y-2    > * + * { margin-top: .5rem; }
.space-y-2\.5 > * + * { margin-top: .625rem; }
.space-y-3    > * + * { margin-top: .75rem; }
.space-y-4    > * + * { margin-top: 1rem; }
.space-y-5    > * + * { margin-top: 1.25rem; }
.space-y-6    > * + * { margin-top: 1.5rem; }
.space-y-8    > * + * { margin-top: 2rem; }
.space-x-1    > * + * { margin-left: .25rem; }
.space-x-2    > * + * { margin-left: .5rem; }
.space-x-3    > * + * { margin-left: .75rem; }
.space-x-4    > * + * { margin-left: 1rem; }

/* --- Divide --- */
.divide-x > :not([hidden]) ~ :not([hidden]) { border-left-width: 1px; border-left-style: solid; }
.divide-gray-100 > :not([hidden]) ~ :not([hidden]) { border-color: #f3f4f6; }

/* --- Sizing --- */
.w-full   { width: 100% !important; }
.w-1\.5   { width: .375rem !important; }
.w-2      { width: .5rem !important; }
.w-2\.5   { width: .625rem !important; }
.w-4      { width: 1rem !important; }
.w-5      { width: 1.25rem !important; }
.w-6      { width: 1.5rem !important; }
.w-7      { width: 1.75rem !important; }
.w-8      { width: 2rem !important; }
.w-9      { width: 2.25rem !important; }
.w-10     { width: 2.5rem !important; }
.w-12     { width: 3rem !important; }
.w-16     { width: 4rem !important; }
.w-20     { width: 5rem !important; }
.w-28     { width: 7rem !important; }
.w-60     { width: 15rem !important; }
.h-1\.5   { height: .375rem !important; }
.h-2      { height: .5rem !important; }
.h-2\.5   { height: .625rem !important; }
.h-4      { height: 1rem !important; }
.h-5      { height: 1.25rem !important; }
.h-6      { height: 1.5rem !important; }
.h-7      { height: 1.75rem !important; }
.h-8      { height: 2rem !important; }
.h-9      { height: 2.25rem !important; }
.h-10     { height: 2.5rem !important; }
.h-12     { height: 3rem !important; }
.h-14     { height: 3.5rem !important; }
.h-16     { height: 4rem !important; }
.h-28     { height: 7rem !important; }
.h-44     { height: 11rem !important; }
.h-48     { height: 12rem !important; }
.h-60     { height: 15rem !important; }
.min-h-screen { min-height: 100vh !important; }
.max-h-40 { max-height: 10rem !important; }
.max-h-80 { max-height: 20rem !important; }
.max-w-md  { max-width: 28rem !important; }
.max-w-xl  { max-width: 36rem !important; }
.max-w-3xl { max-width: 48rem !important; }
.max-w-7xl { max-width: 80rem !important; }

/* --- Border radius --- */
.rounded-xl  { border-radius: .75rem !important; }
.rounded-2xl { border-radius: 1rem !important; }
.rounded-3xl { border-radius: 1.5rem !important; }
.rounded-full { border-radius: 9999px !important; }

/* --- Typography --- */
.text-xs  { font-size: .75rem !important; line-height: 1rem !important; }
.text-sm  { font-size: .875rem !important; line-height: 1.25rem !important; }
.text-xl  { font-size: 1.25rem !important; line-height: 1.75rem !important; }
.text-2xl { font-size: 1.5rem !important; line-height: 2rem !important; }
.text-3xl { font-size: 1.875rem !important; line-height: 2.25rem !important; }
.text-4xl { font-size: 2.25rem !important; line-height: 2.5rem !important; }
.text-5xl { font-size: 3rem !important; line-height: 1 !important; }
.text-6xl { font-size: 3.75rem !important; line-height: 1 !important; }
.font-medium    { font-weight: 500 !important; }
.font-semibold  { font-weight: 600 !important; }
.font-bold      { font-weight: 700 !important; }
.font-extrabold { font-weight: 800 !important; }
.font-mono  { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Courier New', monospace !important; }
.tracking-tight   { letter-spacing: -.025em !important; }
.tracking-wide    { letter-spacing: .025em !important; }
.tracking-wider   { letter-spacing: .05em !important; }
.tracking-widest  { letter-spacing: .1em !important; }
.leading-tight    { line-height: 1.25 !important; }
.leading-snug     { line-height: 1.375 !important; }
.leading-relaxed  { line-height: 1.625 !important; }
.truncate { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.whitespace-pre-wrap { white-space: pre-wrap !important; }
.whitespace-nowrap   { white-space: nowrap !important; }
.text-transparent    { color: transparent !important; }
.bg-clip-text { -webkit-background-clip: text !important; background-clip: text !important; }
.uppercase { text-transform: uppercase !important; }
.select-none { user-select: none !important; }

/* --- Colors: text --- */
.text-gray-300  { color: #d1d5db !important; }
.text-gray-400  { color: #9ca3af !important; }
.text-gray-500  { color: #6b7280 !important; }
.text-gray-600  { color: #4b5563 !important; }
.text-gray-700  { color: #374151 !important; }
.text-gray-800  { color: #1f2937 !important; }
.text-gray-900  { color: #111827 !important; }
.text-slate-400 { color: #94a3b8 !important; }
.text-slate-500 { color: #64748b !important; }
.text-slate-600 { color: #475569 !important; }
.text-slate-700 { color: #334155 !important; }
.text-slate-800 { color: #1e293b !important; }
.text-slate-900 { color: #0f172a !important; }
.text-indigo-500 { color: #6366f1 !important; }
.text-indigo-600 { color: #4f46e5 !important; }
.text-indigo-700 { color: #4338ca !important; }
.text-indigo-900 { color: #312e81 !important; }
.text-teal-200  { color: #99f6e4 !important; }
.text-teal-700  { color: #0f766e !important; }
.text-amber-700 { color: #b45309 !important; }
.text-cyan-700  { color: #0e7490 !important; }
.text-violet-500 { color: #8b5cf6 !important; }
.text-emerald-700 { color: #047857 !important; }

/* --- Colors: background --- */
.bg-gray-50  { background-color: #f9fafb !important; }
.bg-gray-100 { background-color: #f3f4f6 !important; }
.bg-gray-200 { background-color: #e5e7eb !important; }
.bg-gray-800 { background-color: #1f2937 !important; }
.bg-gray-900 { background-color: #111827 !important; }
.bg-indigo-50  { background-color: #eef2ff !important; }
.bg-indigo-600 { background-color: #4f46e5 !important; }
.bg-slate-50  { background-color: #f8fafc !important; }
.bg-slate-100 { background-color: #f1f5f9 !important; }
.bg-slate-900 { background-color: #0f172a !important; }
.bg-teal-50  { background-color: #f0fdfa !important; }
.bg-teal-700 { background-color: #0f766e !important; }
.bg-teal-800 { background-color: #115e59 !important; }
.bg-teal-900 { background-color: #134e4a !important; }
.bg-amber-100 { background-color: #fef3c7 !important; }
.bg-cyan-100  { background-color: #cffafe !important; }
.bg-indigo-50\/60  { background-color: rgba(238,242,255,.60) !important; }
.bg-slate-50\/70   { background-color: rgba(248,250,252,.70) !important; }
.bg-white\/70      { background-color: rgba(255,255,255,.70) !important; }
.bg-white\/10      { background-color: rgba(255,255,255,.10) !important; }

/* --- Colors: border --- */
.border-gray-100  { border-color: #f3f4f6 !important; }
.border-gray-200  { border-color: #e5e7eb !important; }
.border-gray-300  { border-color: #d1d5db !important; }
.border-indigo-100 { border-color: #e0e7ff !important; }
.border-indigo-200 { border-color: #c7d2fe !important; }
.border-slate-200  { border-color: #e2e8f0 !important; }
.border-amber-200  { border-color: #fde68a !important; }
.border-teal-200   { border-color: #99f6e4 !important; }
.border-white\/40  { border-color: rgba(255,255,255,.40) !important; }
.border-slate-200\/80 { border-color: rgba(226,232,240,.80) !important; }
.border-dashed     { border-style: dashed !important; }

/* --- Gradients --- */
.bg-gradient-to-r  { background-image: linear-gradient(to right, var(--tw-gradient-stops)) !important; }
.bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)) !important; }
.from-teal-600 { --tw-gradient-from: #0d9488; --tw-gradient-to: rgba(13,148,136,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-teal-700 { --tw-gradient-from: #0f766e; --tw-gradient-to: rgba(15,118,110,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-teal-800 { --tw-gradient-from: #115e59; --tw-gradient-to: rgba(17,94,89,0);   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-slate-900 { --tw-gradient-from: #0f172a; --tw-gradient-to: rgba(15,23,42,0);  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.via-slate-800  { --tw-gradient-stops: var(--tw-gradient-from), #1e293b, var(--tw-gradient-to); }
.to-amber-500 { --tw-gradient-to: #f59e0b; }
.to-teal-900  { --tw-gradient-to: #134e4a; }

/* --- Overflow --- */
.overflow-y-auto   { overflow-y: auto !important; }
.overflow-x-auto   { overflow-x: auto !important; }
.overflow-x-hidden { overflow-x: hidden !important; }

/* --- Position --- */
.relative  { position: relative !important; }
.absolute  { position: absolute !important; }
.fixed     { position: fixed !important; }
.sticky    { position: sticky !important; }
.inset-0   { inset: 0 !important; }
.top-0     { top: 0 !important; }
.z-10      { z-index: 10 !important; }
.z-20      { z-index: 20 !important; }
.z-50      { z-index: 50 !important; }

/* --- Misc --- */
.cursor-pointer    { cursor: pointer !important; }
.cursor-not-allowed { cursor: not-allowed !important; }
.pointer-events-none { pointer-events: none !important; }
.resize-none  { resize: none !important; }
.resize-y     { resize: vertical !important; }
.list-none    { list-style-type: none !important; }
.opacity-50   { opacity: .5 !important; }
.opacity-0    { opacity: 0 !important; }
.opacity-100  { opacity: 1 !important; }
.aspect-video { aspect-ratio: 16/9 !important; }
.snap-x       { scroll-snap-type: x mandatory !important; }
.snap-start   { scroll-snap-align: start !important; }

/* --- Display --- */
.hidden       { display: none !important; }
.block        { display: block !important; }
.inline-block { display: inline-block !important; }
.inline       { display: inline !important; }

/* --- Directional borders --- */
.border-t  { border-top-width: 1px !important; border-top-style: solid !important; }
.border-b  { border-bottom-width: 1px !important; border-bottom-style: solid !important; }
.border-l  { border-left-width: 1px !important; border-left-style: solid !important; }
.border-r  { border-right-width: 1px !important; border-right-style: solid !important; }
.border-x  { border-left-width: 1px !important; border-left-style: solid !important; border-right-width: 1px !important; border-right-style: solid !important; }
.border-y  { border-top-width: 1px !important; border-top-style: solid !important; border-bottom-width: 1px !important; border-bottom-style: solid !important; }

/* --- Transitions --- */
.transition        { transition-property: color, background-color, border-color, opacity, box-shadow, transform; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: 150ms; }
.transition-all    { transition: all 150ms cubic-bezier(.4,0,.2,1); }
.transition-colors { transition: color, background-color, border-color 150ms cubic-bezier(.4,0,.2,1); }

/* --- Backdrop filter --- */
.backdrop-blur    { backdrop-filter: blur(8px); }
.backdrop-blur-md { backdrop-filter: blur(12px); }

/* --- Hover states --- */
.hover\:bg-gray-50:hover    { background-color: #f9fafb; }
.hover\:bg-gray-100:hover   { background-color: #f3f4f6; }
.hover\:bg-gray-800:hover   { background-color: #1f2937; }
.hover\:bg-slate-50:hover   { background-color: #f8fafc; }
.hover\:bg-slate-100:hover  { background-color: #f1f5f9; }
.hover\:bg-slate-800:hover  { background-color: #1e293b; }
.hover\:bg-indigo-50:hover  { background-color: #eef2ff; }
.hover\:bg-violet-50:hover  { background-color: #f5f3ff; }
.hover\:bg-teal-800:hover   { background-color: #115e59; }
.hover\:bg-white\/10:hover  { background-color: rgba(255,255,255,.10); }
.hover\:text-indigo-500:hover { color: #6366f1; }
.hover\:text-indigo-600:hover { color: #4f46e5; }
.hover\:text-violet-500:hover { color: #8b5cf6; }
.hover\:text-slate-700:hover  { color: #334155; }
.hover\:text-slate-900:hover  { color: #0f172a; }

/* --- Active states --- */
.active\:scale-90:active { transform: scale(.9); }
.active\:scale-95:active { transform: scale(.95); }
.hover\:opacity-80:hover  { opacity: .8; }

/* --- Focus ring --- */
.focus\:outline-none:focus { outline: 0 !important; }
.focus\:ring-2:focus       { box-shadow: 0 0 0 2px var(--tw-ring-color, rgba(59,130,246,.5)) !important; }
.focus\:ring-indigo-500    { --tw-ring-color: rgba(99,102,241,.5); }
.focus\:ring-rose-400      { --tw-ring-color: rgba(251,113,133,.5); }
.focus\:bg-white:focus     { background-color: #fff !important; }

/* --- Responsive grid & flex --- */
@media (min-width: 640px) {
  .sm\:hidden            { display: none !important; }
  .sm\:block             { display: block !important; }
  .sm\:flex-row          { flex-direction: row !important; }
  .sm\:items-center      { align-items: center !important; }
  .sm\:justify-between   { justify-content: space-between !important; }
  .sm\:w-64              { width: 16rem !important; }
  .sm\:col-span-3        { grid-column: span 3 / span 3 !important; }
  .sm\:grid-cols-2       { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .sm\:grid-cols-3       { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .sm\:grid-cols-4       { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}

@media (min-width: 768px) {
  .md\:block             { display: block !important; }
  .md\:flex              { display: flex !important; }
  .md\:col-span-2        { grid-column: span 2 / span 2 !important; }
  .md\:grid-cols-2       { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .md\:grid-cols-3       { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .md\:grid-cols-4       { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .md\:grid-cols-5       { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}

@media (min-width: 1024px) {
  .lg\:block             { display: block !important; }
  .lg\:flex              { display: flex !important; }
  .lg\:grid              { display: grid !important; }
  .lg\:grid-cols-2       { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .lg\:grid-cols-3       { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .lg\:grid-cols-7       { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
  .lg\:col-span-2        { grid-column: span 2 / span 2 !important; }
  .lg\:overflow-visible  { overflow: visible !important; }
  .lg\:w-auto            { width: auto !important; }
  .lg\:gap-5             { gap: 1.25rem !important; }
  .lg\:gap-10            { gap: 2.5rem !important; }
  .lg\:px-8              { padding-left: 2rem !important; padding-right: 2rem !important; }
  .lg\:py-6              { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
  .lg\:py-10             { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
  .lg\:py-16             { padding-top: 4rem !important; padding-bottom: 4rem !important; }
  .lg\:py-20             { padding-top: 5rem !important; padding-bottom: 5rem !important; }
  .lg\:pt-10             { padding-top: 2.5rem !important; }
  .lg\:pb-14             { padding-bottom: 3.5rem !important; }
  .lg\:p-5               { padding: 1.25rem !important; }
  .lg\:p-8               { padding: 2rem !important; }
  .lg\:p-12              { padding: 3rem !important; }
  .lg\:text-xl           { font-size: 1.25rem !important; line-height: 1.75rem !important; }
  .lg\:text-3xl          { font-size: 1.875rem !important; line-height: 2.25rem !important; }
  .lg\:text-4xl          { font-size: 2.25rem !important; line-height: 2.5rem !important; }
  .lg\:text-5xl          { font-size: 3rem !important; line-height: 1 !important; }
  .lg\:text-6xl          { font-size: 3.75rem !important; line-height: 1 !important; }
  .lg\:ml-64             { margin-left: 16rem !important; }
  .lg\:items-center      { align-items: center !important; }
  .lg\:justify-end       { justify-content: flex-end !important; }
  .lg\:min-h-\[420px\]   { min-height: 420px !important; }
}

@media (min-width: 1280px) {
  .xl\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .xl\:grid-cols-\[1\.2fr_0\.8fr\] { grid-template-columns: 1.2fr 0.8fr !important; }
}

/* --- Arbitrary-value classes --- */
.text-\[9px\]  { font-size: 9px !important; }
.text-\[10px\] { font-size: 10px !important; }
.text-\[11px\] { font-size: 11px !important; }
.tracking-\[\.22em\] { letter-spacing: .22em !important; }
.tracking-\[\.2em\]  { letter-spacing: .2em !important; }
.max-h-\[320px\]     { max-height: 320px !important; }
.max-h-\[360px\]     { max-height: 360px !important; }
.min-w-\[220px\]     { min-width: 220px !important; }
.w-\[calc\(100vw-2rem\)\]  { width: calc(100vw - 2rem) !important; }
.min-h-\[50vh\]            { min-height: 50vh !important; }
.min-h-\[420px\]           { min-height: 420px !important; }

/* --- Half-unit spacing --- */
.px-0\.5 { padding-left: .125rem !important; padding-right: .125rem !important; }
.py-0\.5 { padding-top: .125rem !important; padding-bottom: .125rem !important; }
.px-1\.5 { padding-left: .375rem !important; padding-right: .375rem !important; }
.py-1\.5 { padding-top: .375rem !important; padding-bottom: .375rem !important; }
.px-2\.5 { padding-left: .625rem !important; padding-right: .625rem !important; }
.py-2\.5 { padding-top: .625rem !important; padding-bottom: .625rem !important; }
.mt-0\.5 { margin-top: .125rem !important; }
.mb-0\.5 { margin-bottom: .125rem !important; }
.mt-1\.5 { margin-top: .375rem !important; }
.mb-1\.5 { margin-bottom: .375rem !important; }
.gap-1\.5 { gap: .375rem !important; }
.gap-2\.5 { gap: .625rem !important; }

/* --- Additional colors --- */
.text-gray-200   { color: #e5e7eb !important; }
.text-rose-500   { color: #f43f5e !important; }
.text-rose-700   { color: #be123c !important; }
.text-sky-700    { color: #0369a1 !important; }
.text-violet-700 { color: #6d28d9 !important; }
.text-indigo-500 { color: #6366f1 !important; }
.text-indigo-700 { color: #4338ca !important; }
.text-amber-600  { color: #d97706 !important; }
.text-base       { font-size: 1rem !important; line-height: 1.5rem !important; }
.bg-gray-600     { background-color: #4b5563 !important; }
.bg-gray-700     { background-color: #374151 !important; }
.bg-gray-700\/60 { background-color: rgba(55,65,81,.60) !important; }
.bg-indigo-100   { background-color: #e0e7ff !important; }
.bg-slate-200    { background-color: #e2e8f0 !important; }
.bg-rose-100     { background-color: #ffe4e6 !important; }
.bg-emerald-100  { background-color: #d1fae5 !important; }
.border-gray-700 { border-color: #374151 !important; }
.border-teal-200 { border-color: #99f6e4 !important; }
.w-72            { width: 18rem !important; }
.min-h-\[220px\] { min-height: 220px !important; }
