/* ── Dashboard layout structure ────────────────────────────────────────────
   Structural rules shared by all dashboard pages via dashboard_sidebar_html.php.
   Color/visual overrides follow below.
   ────────────────────────────────────────────────────────────────────────── */

.top-navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  height: 85px; display: flex; align-items: center;
}

.sidebar {
  width: 240px; height: 100vh;
  position: fixed; top: 0; left: 0; padding-top: 85px; z-index: 100;
  display: flex; flex-direction: column; overflow: hidden;
}

.sidebar-links {
  flex: 1; overflow-y: auto; min-height: 0;
}

.sidebar .nav-link {
  border-radius: 8px; padding: 9px 16px;
  margin: 2px 8px; font-size: .9rem;
  display: flex; align-items: center; gap: 10px;
  transition: background .15s, color .15s;
  text-decoration: none;
}

.sidebar .nav-badge { margin-left: auto; font-size: .68rem; }

.sidebar-footer-dash {
  flex: none;
  border-top: 1px solid var(--me-border);
  padding: 14px 12px;
  display: grid;
  gap: 10px;
}

.sidebar-child-select label {
  display: block;
  font-size: 11.5px;
  font-weight: 900;
  letter-spacing: .06em;
  color: var(--me-sidebar-muted);
}

.sidebar-child-select select {
  width: 100%;
}

.sidebar-user-chip {
  display: flex;
  align-items: center;
  gap: 9px;
}

.sidebar-user-avatar {
  width: 32px; height: 32px; flex: none;
  border-radius: 999px;
  background: var(--me-coral-soft);
  color: var(--me-coral);
  display: grid; place-items: center;
  font-weight: 900; font-size: 13px;
}

.sidebar-user-name {
  font-size: 13.5px;
  font-weight: 800;
  color: var(--me-sidebar-text);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-logout-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  color: var(--me-sidebar-muted);
  border: 1.5px solid var(--me-border);
  background: var(--me-surface);
  font-weight: 800;
  font-size: 13.5px;
  padding: 9px 14px;
  border-radius: 10px;
  transition: background .12s, color .12s, border-color .12s;
}

.sidebar-logout-link:hover {
  background: var(--me-coral-soft);
  color: var(--me-coral);
  border-color: color-mix(in srgb, var(--me-coral), transparent 55%);
}

.main-content { margin-left: 240px; padding: 95px 28px 48px; }

.menu-toggle { display: none; }

.sidebar-overlay {
  position: fixed; inset: 0; z-index: 150;
  opacity: 0; pointer-events: none; transition: opacity .2s;
}

@media (max-width: 991.98px) {
  .menu-toggle { display: inline-flex; align-items: center; justify-content: center; }
  .sidebar {
    transform: translateX(-100%);
    transition: transform .2s ease;
    width: min(82vw, 320px);
    z-index: 260;
  }
  .sidebar.open { transform: translateX(0); }
  .sidebar-overlay.open { opacity: 1; pointer-events: auto; }
  .main-content { margin-left: 0; padding: 88px 14px 24px; }
}

/* ── Final MindEase UI overrides ────────────────────────────────────────────
   This file must be loaded after page-level inline styles. */

html,
body {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--me-primary-soft), transparent 62%), transparent 320px),
    var(--me-bg) !important;
  color: var(--me-text) !important;
}

body,
.main,
.main-content,
.chat-main,
.chat-area,
.content,
.dashboard,
.calendar-container,
.page-wrapper {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--me-primary-soft), transparent 70%), transparent 300px),
    var(--me-bg) !important;
  color: var(--me-text) !important;
}

.top-navbar,
.sidebar,
nav.sidebar,
aside.sidebar {
  background: linear-gradient(180deg, var(--me-sidebar), var(--me-sidebar-2)) !important;
  color: var(--me-sidebar-text) !important;
}

.top-navbar {
  border-bottom: 1px solid var(--me-border) !important;
  box-shadow: var(--me-shadow-sm) !important;
  gap: 12px !important;
}

.sidebar {
  border-right: 1px solid var(--me-border) !important;
}

.sidebar .nav-link,
.sidebar a,
.sidebar-nav a,
.sidebar-footer a,
.conversation-item {
  color: var(--me-sidebar-muted) !important;
  border-radius: var(--me-radius-sm) !important;
}

.sidebar .nav-link:hover,
.sidebar a:hover,
.sidebar-nav a:hover,
.sidebar-footer a:hover,
.conversation-item:hover {
  background: var(--me-sidebar-2) !important;
  color: var(--me-sidebar-text) !important;
}

.sidebar .nav-link.active,
.sidebar a.active,
.sidebar-nav a.active,
.conversation-item.active {
  background: var(--me-surface) !important;
  color: var(--me-sidebar-text) !important;
  font-weight: 900 !important;
}

.sidebar-nav .new-chat,
.new-chat {
  color: #fff !important;
  background: var(--me-primary) !important;
  border: none !important;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--me-primary), transparent 72%) !important;
}
.sidebar-nav .new-chat:hover,
.new-chat:hover {
  background: var(--me-primary-hover) !important;
}

.card,
.panel,
.info-card,
.info-panel,
.summary-card,
.appointment-card,
.memory-field-card,
.profile-card,
.policy-card,
.image-card,
.file-card,
.modal-content,
.clinical-panel,
.child-selector,
.empty-state,
.stats-pill,
.upload-area,
.calendar-card,
.event-card,
.table,
table {
  background: var(--me-surface) !important;
  border-color: var(--me-border) !important;
  border-radius: var(--me-radius-lg) !important;
  box-shadow: var(--me-shadow-sm) !important;
  color: var(--me-text) !important;
}

.card:hover,
.panel:hover,
.summary-card:hover,
.appointment-card:hover,
.file-card:hover,
.image-card:hover {
  box-shadow: var(--me-shadow-md) !important;
}

.chat-topbar,
.topbar,
.chat-header,
.tools-bar,
.composer,
.appointments-panel,
.calendar-header,
.dashboard-header {
  background: color-mix(in srgb, var(--me-surface), transparent 5%) !important;
  border-color: var(--me-border) !important;
  color: var(--me-text) !important;
  backdrop-filter: blur(14px);
}

h1,
h2,
h3,
.title,
.panel-title,
.card-title,
.hero-title,
.navbar-brand {
  color: var(--me-text) !important;
  font-family: var(--me-font-display) !important;
  letter-spacing: 0 !important;
}

.top-navbar h1,
.top-navbar h2,
.top-navbar h3,
.top-navbar .navbar-brand,
.sidebar h1,
.sidebar h2,
.sidebar h3 {
  color: var(--me-sidebar-text) !important;
}

p,
li,
.meta,
.label,
.small,
.text-secondary,
.panel-note,
.form-text,
.wizard-hint,
.progress-label,
.msg-sender,
.composer-hint,
.appointment-card .meta,
.summary-card .label {
  color: var(--me-text-muted) !important;
}

.btn,
button,
.qa-btn,
.tool-btn,
.filter-link,
.action-btn {
  border-radius: var(--me-radius-sm) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.btn-primary,
button[type="submit"],
.composer button,
.filter-link.active,
.qa-btn.active,
.tool-btn.active {
  background: var(--me-primary) !important;
  border-color: var(--me-primary) !important;
  color: #fff !important;
}

.btn-primary:hover,
button[type="submit"]:hover,
.composer button:hover,
.filter-link.active:hover {
  background: var(--me-primary-hover) !important;
  border-color: var(--me-primary-hover) !important;
  color: #fff !important;
}

.btn-secondary,
.btn-outline-secondary,
.qa-btn,
.tool-btn,
.filter-link,
.inline-actions button {
  background: var(--me-surface-2) !important;
  border: 1px solid var(--me-border) !important;
  color: var(--me-text) !important;
}

.qa-btn:hover,
.tool-btn:hover,
.filter-link:hover,
.inline-actions button:hover {
  background: var(--me-primary-soft) !important;
  border-color: var(--me-primary) !important;
  color: var(--me-primary-ink) !important;
}

input,
textarea,
select,
.form-control,
.form-select,
.mode-select {
  background: var(--me-surface) !important;
  border: 1px solid var(--me-border-strong) !important;
  border-radius: var(--me-radius-sm) !important;
  color: var(--me-text) !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--me-text-soft) !important;
}

.bubble,
.msg-bubble,
.message-bubble {
  border-radius: var(--me-radius-lg) !important;
  font-family: var(--me-font-readable) !important;
  box-shadow: var(--me-shadow-sm) !important;
}

.message.user .bubble,
.message.user .message-bubble,
.msg-block.user .msg-bubble,
.user .bubble,
.user-message,
.bubble-user {
  background: var(--me-primary) !important;
  border-color: var(--me-primary) !important;
  color: #fff !important;
}

.message.assistant .bubble,
.message.assistant .message-bubble,
.msg-block.assistant .msg-bubble,
.assistant .bubble,
.assistant-message,
.bubble-assistant {
  background: var(--me-surface) !important;
  border: 1px solid var(--me-border) !important;
  color: var(--me-text) !important;
}

.mood-btn,
.emotion-chip,
.status-chip,
.badge,
.nav-badge {
  border-radius: 999px !important;
  font-weight: 700 !important;
}

.mood-btn,
.emotion-chip,
.status-chip {
  background: var(--me-surface) !important;
  border: 1px solid var(--me-border) !important;
  color: var(--me-text-muted) !important;
}

.mood-btn:hover,
.mood-btn.active,
.emotion-chip.active,
.status-chip.active {
  background: var(--me-primary-soft) !important;
  border-color: var(--me-primary) !important;
  color: var(--me-primary-ink) !important;
}

.hero-highlight {
  background: var(--me-surface) !important;
  border: 1px solid var(--me-border) !important;
  color: var(--me-text) !important;
  box-shadow: var(--me-shadow-sm) !important;
  border-radius: var(--me-radius-lg) !important;
}

.info-hero {
  background: linear-gradient(135deg, var(--me-primary), var(--me-lavender)) !important;
  border-radius: var(--me-radius-lg) !important;
}

.header,
.app-header,
.calendar-header,
.location-header {
  background: linear-gradient(135deg, var(--me-primary), var(--me-lavender)) !important;
  color: #fff !important;
  border-bottom-color: rgba(255, 255, 255, .08) !important;
}

.header h1,
.header h2,
.app-header h1,
.calendar-header h1,
.location-header h1 {
  color: #fff !important;
}

.calendar-day,
.day-cell,
.appointment-item,
.event-item,
.location-card,
.status-card,
.map-panel,
.calendar-grid,
.appointments-list,
.details-panel {
  background: var(--me-surface) !important;
  border-color: var(--me-border) !important;
  color: var(--me-text) !important;
}

.calendar-day.today,
.day-cell.today,
.calendar-day.selected,
.day-cell.selected {
  background: var(--me-primary-soft) !important;
  border-color: var(--me-primary) !important;
  color: var(--me-primary-ink) !important;
}

.calendar-day.has-events,
.day-cell.has-events {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--me-primary), transparent 60%) !important;
}

.quick-card {
  border-radius: var(--me-radius-sm) !important;
  box-shadow: var(--me-shadow-sm) !important;
}

.top-navbar .navbar-brand {
  min-width: 0 !important;
}

.top-navbar .brand-logo {
  width: 36px !important;
  height: 36px !important;
}

.top-navbar > .d-flex:last-child,
.top-navbar form {
  min-width: 0 !important;
}

.top-navbar .child-switcher,
.top-navbar .form-select {
  max-width: 220px !important;
}

.login-card,
.mission-box {
  background: var(--me-surface) !important;
  border: 1px solid var(--me-border) !important;
  border-radius: var(--me-radius-lg) !important;
  box-shadow: var(--me-shadow-lg) !important;
  color: var(--me-text) !important;
}

.mission-title,
.mission-text strong,
.legal-links a:hover,
.hero .kicker,
.back-link:hover {
  color: var(--me-primary) !important;
}

.mission-text,
.legal-links a,
.back-link {
  color: var(--me-text-muted) !important;
}

.info-box,
.notice-info {
  background: var(--me-primary-soft) !important;
  border-left: 4px solid var(--me-primary) !important;
  color: var(--me-primary-ink) !important;
}

.privacy-note,
.notice-warning,
.warning-box {
  background: var(--me-amber-soft) !important;
  border-left: 4px solid var(--me-amber) !important;
  color: var(--me-text) !important;
}

.alert-dot.high,
.badge.high,
.text-bg-danger {
  background: var(--me-coral-soft) !important;
  color: var(--me-coral) !important;
}

.alert-dot.medium,
.badge.medium,
.text-bg-warning {
  background: var(--me-amber-soft) !important;
  color: var(--me-amber) !important;
}

.alert-dot.low,
.badge.low {
  background: var(--me-info-soft) !important;
  color: var(--me-info) !important;
}

.alert-dot.none,
.badge.none {
  background: var(--me-success-soft) !important;
  color: var(--me-primary-ink) !important;
}

.badge.neutral,
.nav-badge.neutral {
  background: var(--me-sidebar-2) !important;
  color: var(--me-sidebar-muted) !important;
}

th,
.table th {
  background: var(--me-surface-2) !important;
  border-color: var(--me-border) !important;
  color: var(--me-text-muted) !important;
  font-size: .74rem !important;
  letter-spacing: .03em !important;
  padding: .82rem .68rem !important;
  white-space: nowrap !important;
}

td,
.table td {
  background: var(--me-surface) !important;
  border-color: var(--me-border) !important;
  color: var(--me-text) !important;
  padding: .78rem .68rem !important;
  line-height: 1.42 !important;
}

.table-hover > tbody > tr:hover > * {
  background: color-mix(in srgb, var(--me-primary-soft), var(--me-surface) 68%) !important;
}

.table a:not(.btn) {
  color: color-mix(in srgb, var(--me-primary), var(--me-text) 18%) !important;
  font-weight: 750 !important;
  text-decoration: none !important;
}

.table a:not(.btn):hover {
  color: var(--me-primary-hover) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

.table .btn {
  min-height: 34px !important;
}

.table .badge {
  box-shadow: none !important;
}

.bg-primary,
.text-bg-primary {
  background: var(--me-primary) !important;
  color: #fff !important;
}

.bg-success,
.text-bg-success {
  background: var(--me-success) !important;
  color: #fff !important;
}

.bg-info,
.text-bg-info {
  background: var(--me-primary) !important;
  color: #fff !important;
}

.bg-warning,
.text-bg-warning {
  background: var(--me-amber) !important;
  color: #3d2a00 !important;
}

.bg-danger,
.text-bg-danger {
  background: var(--me-danger) !important;
  color: #fff !important;
}

.day-col,
.weekly-grid .day-col {
  background: var(--me-surface-2) !important;
  border: 1px solid var(--me-border) !important;
  color: var(--me-text) !important;
}

.day-title {
  color: var(--me-text) !important;
}

.event-chip,
.weekly-grid .event-chip {
  background: var(--me-surface) !important;
  border-color: var(--me-border) !important;
  border-left-color: var(--me-primary) !important;
  color: var(--me-text) !important;
  box-shadow: var(--me-shadow-sm) !important;
}

.event-chip.appointment-personal {
  background: color-mix(in srgb, var(--me-primary-soft), var(--me-surface) 72%) !important;
  border-left-color: var(--me-lavender) !important;
}

.event-time {
  color: var(--me-primary) !important;
}

.event-title {
  color: var(--me-text) !important;
}

.event-place {
  color: var(--me-text-muted) !important;
}

.event-badge {
  border-radius: 999px !important;
  background: var(--me-primary-soft) !important;
  color: var(--me-primary-ink) !important;
}

.user-actions-cell {
  min-width: 300px !important;
}

.user-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}

.user-actions .form-select {
  width: auto !important;
  min-width: 132px !important;
}

.user-actions .badge {
  margin-left: 0 !important;
}

.role-badge,
.auth-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.auth-badge {
  background: var(--me-surface-2) !important;
  color: var(--me-text-muted) !important;
  border: 1px solid var(--me-border) !important;
}

pre,
code {
  background: var(--me-surface-2) !important;
  border-color: var(--me-border) !important;
  color: var(--me-text) !important;
}

/* Bridge for legacy inline styles that still contain old brand colors. */
[style*="#667eea"],
[style*="#20B2AA"],
[style*="#0e9e97"] {
  border-color: var(--me-primary) !important;
}

a[style*="#667eea"],
a[style*="#20B2AA"],
[style*="color: #667eea"],
[style*="color:#667eea"],
[style*="color: #20B2AA"],
[style*="color:#20B2AA"],
[style*="color: #0e9e97"],
[style*="color:#0e9e97"] {
  color: var(--me-primary) !important;
}

[style*="background: #667eea"],
[style*="background:#667eea"],
[style*="background: #20B2AA"],
[style*="background:#20B2AA"],
[style*="background-color: #667eea"],
[style*="background-color:#667eea"],
[style*="background-color: #20B2AA"],
[style*="background-color:#20B2AA"] {
  background: var(--me-primary) !important;
}

[style*="#764ba2"],
[style*="#8b6cff"] {
  border-color: var(--me-lavender) !important;
}

[style*="color: #764ba2"],
[style*="color:#764ba2"],
[style*="color: #8b6cff"],
[style*="color:#8b6cff"] {
  color: var(--me-lavender) !important;
}

[style*="background: #764ba2"],
[style*="background:#764ba2"],
[style*="background: #8b6cff"],
[style*="background:#8b6cff"] {
  background: var(--me-lavender) !important;
}

.modal-backdrop,
.sidebar-overlay {
  background: rgba(18, 28, 25, .55) !important;
}

@media (prefers-color-scheme: dark) {
  img.brand-logo,
  .sidebar-header .logo-img {
    filter: none;
  }
}

@media (max-width: 991.98px) {
  .top-navbar {
    min-height: 84px !important;
    height: auto !important;
    align-items: center !important;
    padding: 8px 10px !important;
  }

  .top-navbar .navbar-brand {
    flex: 1 1 auto !important;
    justify-content: center !important;
    min-width: 90px !important;
  }

  .top-navbar .brand-logo {
    max-width: 122px !important;
  }

  .top-navbar > .d-flex:last-child {
    flex: 1 1 100% !important;
    justify-content: flex-end !important;
    gap: 8px !important;
  }

  .top-navbar form {
    flex: 1 1 auto !important;
    gap: 6px !important;
  }

  .top-navbar form .text-secondary {
    max-width: 74px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .top-navbar .child-switcher,
  .top-navbar .form-select {
    min-width: 0 !important;
    max-width: 150px !important;
  }

  .top-navbar .btn {
    padding-inline: 10px !important;
  }

  .main-content {
    padding-top: 112px !important;
  }

  .table-responsive {
    border: 1px solid var(--me-border) !important;
    border-radius: var(--me-radius-lg) !important;
  }

  .user-actions-cell {
    min-width: 260px !important;
  }

  .weekly-grid {
    gap: 10px !important;
  }
}

@media (max-width: 480px) {
  .top-navbar .navbar-brand {
    order: 2 !important;
    flex: 0 1 auto !important;
  }

  .top-navbar .menu-toggle {
    order: 1 !important;
  }

  .top-navbar > .d-flex:last-child {
    order: 3 !important;
  }

  .top-navbar .brand-logo {
    max-width: 118px !important;
  }

  .top-navbar .btn .me-1 {
    margin-right: 0 !important;
  }

  .top-navbar .btn {
    font-size: .84rem !important;
  }
}

/* ── Dashboard visual polish ─────────────────────────────────────────────── */

/* Cards più arrotondate nel contenuto principale */
.main-content .card {
  border-radius: 16px !important;
  border: 1px solid var(--me-border) !important;
  box-shadow: var(--me-shadow-sm) !important;
}

.main-content .card-header {
  background: transparent !important;
  border-bottom: 1px solid var(--me-border) !important;
  font-family: var(--me-font-display) !important;
  font-weight: 700 !important;
  font-size: .9rem !important;
  letter-spacing: -.01em !important;
  padding: 14px 18px !important;
  color: var(--me-text) !important;
}

.main-content .card-body {
  padding: 0 18px 16px !important;
}

.main-content .card-body.p-0 {
  padding: 0 !important;
}

/* Tabelle: righe più ariose, font pulito */
.main-content .table th {
  font-size: .72rem !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
  padding: 12px 14px !important;
  font-weight: 700 !important;
}

.main-content .table td {
  padding: 13px 14px !important;
  line-height: 1.5 !important;
  vertical-align: middle !important;
}

/* Link nelle tabelle: più leggibili */
.main-content .table a:not(.btn) {
  font-weight: 600 !important;
  text-decoration: none !important;
}

.main-content .table a:not(.btn):hover {
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Sidebar — link attivi con sfondo più nitido */
.sidebar .nav-link.active {
  background: var(--me-surface) !important;
  color: var(--me-sidebar-text) !important;
  font-weight: 900 !important;
}

/* Sezione titoli nel main content */
.main-content h4.fw-bold {
  font-family: var(--me-font-display) !important;
  letter-spacing: -.02em !important;
}

/* Badge nelle tabelle: niente box-shadow */
.main-content .badge {
  box-shadow: none !important;
  font-size: .72rem !important;
}