/* Shared screen theme. Keep export/print rules and chart series independent.
   Page layouts and behavior stay with their owning components. */
@media screen {
  :root {
    --hb-canvas: #f5f8f7;
    --hb-surface: #ffffff;
    --hb-surface-soft: #eef4f1;
    --hb-border: #d8e3de;
    --hb-text: #18312b;
    --hb-muted: #526960;
    --hb-accent: #087b59;
    --hb-accent-strong: #087f5b;
    --hb-accent-soft: #e2f2eb;
    --hb-danger: #b73939;
    --hb-danger-soft: #fff0ee;
    --hb-warning: #795610;
    --hb-warning-soft: #fff6df;
    --hb-info: #245a84;
    --hb-info-soft: #edf5fc;
    --hb-radius: 16px;
    --hb-radius-card: var(--hb-radius);
    --hb-shadow: 0 6px 24px #18312b08;
    --hb-shadow-card: var(--hb-shadow);
    --hb-shadow-hover: var(--hb-shadow);
  }
  [data-bs-theme="dark"] {
    --hb-canvas: #111a24;
    --hb-surface: #172331;
    --hb-surface-soft: #1e2d3b;
    --hb-border: #344452;
    --hb-text: #edf4f1;
    --hb-muted: #b1c1c8;
    --hb-accent: #65d9af;
    --hb-accent-soft: #213e36;
    --hb-danger: #ffada3;
    --hb-danger-soft: #3e282b;
    --hb-warning: #f0d091;
    --hb-warning-soft: #373225;
    --hb-info: #a6d3f5;
    --hb-info-soft: #213446;
    --hb-shadow: 0 6px 24px #0000000c;
    color-scheme: dark;
  }
  [data-bs-theme="light"] { color-scheme: light; }
  body.hb-theme {
    --bs-body-bg: var(--hb-canvas);
    --bs-body-color: var(--hb-text);
    --bs-secondary-color: var(--hb-muted);
    --bs-secondary-bg: var(--hb-surface-soft);
    --bs-tertiary-bg: var(--hb-surface-soft);
    --bs-emphasis-color: var(--hb-text);
    --bs-border-color: var(--hb-border);
    --bs-link-color: var(--hb-accent);
    --bs-link-hover-color: var(--hb-accent);
    --modern-primary: var(--hb-accent-strong);
    --modern-primary-solid: var(--hb-accent-strong);
    --modern-success: var(--hb-accent-strong);
    --modern-info: #286a9d;
    --modern-warning: #97680d;
    --modern-danger: #b73939;
    background: var(--hb-canvas);
    color: var(--hb-text);
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 1rem;
    line-height: 1.6;
  }
  .hb-theme h1, .hb-theme h2, .hb-theme h3 { letter-spacing: -.025em; line-height: 1.25; }
  .hb-theme h1 { font-size: clamp(1.85rem, 3.4vw, 2.65rem); font-weight: 700; }
  .hb-theme small, .hb-theme .small, .hb-theme .form-text { font-size: .875rem; line-height: 1.5; }
  .hb-theme .text-muted, .hb-theme .text-secondary { color: var(--hb-muted) !important; }
  .hb-theme .text-primary { color: var(--hb-accent) !important; }
  .hb-theme .text-success { color: var(--hb-accent) !important; }
  .hb-theme .text-info { color: var(--hb-info) !important; }
  .hb-theme .text-warning { color: var(--hb-warning) !important; }
  .hb-theme .text-danger { color: var(--hb-danger) !important; }
  .hb-theme :is(a, button, summary, input, select, textarea):focus-visible {
    outline: 3px solid var(--hb-accent);
    outline-offset: 3px;
  }
  .hb-theme a { text-underline-offset: .2em; }
  .hb-theme :is(.card, .modal-content, .offcanvas, .list-group-item) {
    --bs-card-bg: var(--hb-surface);
    --bs-card-color: var(--hb-text);
    --bs-card-border-color: var(--hb-border);
    background: var(--hb-surface) !important;
    color: var(--hb-text);
    border: 1px solid var(--hb-border) !important;
    box-shadow: none !important;
  }
  .hb-theme .card { border-radius: var(--hb-radius) !important; }
  .hb-theme .card:hover { transform: none; }
  .hb-theme :is(.card-header, .modal-header, .modal-footer, .card-footer) {
    background: transparent !important;
    color: var(--hb-text) !important;
    border-color: var(--hb-border) !important;
  }
  .hb-theme .card-header { padding: 1rem 1.25rem; }
  .hb-theme .card-header :is(.text-white, .text-dark),
  .hb-theme .card.text-white, .hb-theme .card.text-white :is(h2, h3, h4, h5, h6) { color: var(--hb-text) !important; }
  .hb-theme :is(.bg-light, .bg-white) { background-color: var(--hb-surface) !important; }
  .hb-theme .bg-body-tertiary { background-color: var(--hb-surface-soft) !important; }
  .hb-theme .border { border-color: var(--hb-border) !important; }
  .hb-theme .card-body { padding: 1.25rem; }
  .hb-theme :is(.modal-content, .offcanvas) { border-radius: var(--hb-radius); }
  .hb-theme .modal-content { box-shadow: 0 18px 64px #00000030 !important; }
  .hb-theme :is(.btn, .btn-recipe) {
    border-radius: 10px !important;
    font-weight: 600;
    padding: .65rem 1.05rem;
    box-shadow: none !important;
    transition: background-color .15s, border-color .15s, color .15s;
  }
  .hb-theme .btn:not(.btn-sm) { min-height: 44px; }
  .hb-theme .btn-sm { padding: .4rem .7rem; min-height: 36px; }
  .hb-theme .btn:hover, .hb-theme .btn-recipe:hover { transform: none !important; box-shadow: none !important; }
  .hb-theme :is(.btn-primary, .btn-success, .btn-save, .btn-photo, .generate-btn) {
    background: var(--hb-accent-strong) !important;
    border: 1px solid var(--hb-accent-strong) !important;
    color: #fff !important;
  }
  .hb-theme :is(.btn-primary, .btn-success, .btn-save, .btn-photo, .generate-btn):hover { background: #066747 !important; border-color: #066747 !important; }
  .hb-theme .btn-outline-primary {
    border: 1px solid var(--hb-accent) !important;
    background: transparent !important;
    color: var(--hb-accent) !important;
  }
  .hb-theme .btn-outline-primary:hover, .hb-theme .btn-outline-primary:active {
    background: var(--hb-accent-soft) !important;
    color: var(--hb-accent) !important;
  }
  .hb-theme .btn-outline-success { color: var(--hb-accent) !important; border-color: var(--hb-accent) !important; background: transparent !important; }
  .hb-theme .btn-outline-success:hover { background: var(--hb-accent-soft) !important; }
  .hb-theme .btn-outline-info { color: var(--hb-info); border-color: var(--hb-info); }
  .hb-theme .btn-outline-info:hover { color: var(--hb-info); background: var(--hb-info-soft); }
  .hb-theme .btn-outline-warning { color: var(--hb-warning); border-color: var(--hb-warning); }
  .hb-theme .btn-outline-warning:hover { color: var(--hb-warning); background: var(--hb-warning-soft); }
  .hb-theme :is(.btn-outline-secondary, .btn-light, .btn-view) {
    border: 1px solid var(--hb-border) !important;
    background: transparent !important;
    color: var(--hb-text) !important;
  }
  .hb-theme :is(.btn-outline-secondary, .btn-light, .btn-view):hover { background: var(--hb-surface-soft) !important; border-color: var(--hb-muted) !important; }
  .hb-theme .btn-link { color: var(--hb-accent); }
  .hb-theme .btn-danger { background: #b73939 !important; color: #fff !important; border-color: #b73939 !important; }
  .hb-theme .btn-outline-danger { background: transparent; color: var(--hb-danger); border-color: var(--hb-danger); }
  .hb-theme .btn-outline-danger:hover { background: var(--hb-danger-soft); color: var(--hb-danger); }
  .hb-theme .btn-warning { background: #97680d !important; border-color: #97680d !important; color: #fff !important; }
  .hb-theme .btn-info { background: #286a9d !important; border-color: #286a9d !important; color: #fff !important; }
  .hb-theme .btn-check:checked + .btn, .hb-theme .btn-period.active {
    background: var(--hb-accent-soft) !important;
    color: var(--hb-accent) !important;
    border-color: var(--hb-accent) !important;
  }
  .hb-theme :is(.form-control, .form-select, .input-group-text, .search-input) {
    background-color: var(--hb-surface) !important;
    color: var(--hb-text) !important;
    border: 1px solid var(--hb-border) !important;
    border-radius: 10px;
    box-shadow: none;
    font-size: 1rem;
  }
  .hb-theme :is(.form-control, .form-select) { min-height: 44px; padding: .6rem .8rem; }
  .hb-theme :is(.form-control, .form-select):focus { border-color: var(--hb-accent) !important; box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--hb-accent) 15%, transparent); }
  .hb-theme :is(.form-control, .form-select):disabled { background-color: var(--hb-surface-soft) !important; opacity: .7; }
  .hb-theme :is(.form-control, .search-input)::placeholder { color: var(--hb-muted); opacity: .85; }
  .hb-theme .form-label, .hb-theme .form-check-label { font-size: .9375rem; }
  .hb-theme .form-check-input { border-color: var(--hb-muted); }
  .hb-theme .form-check-input:checked { background-color: var(--hb-accent-strong); border-color: var(--hb-accent-strong); }
  .hb-theme .form-control.is-invalid, .hb-theme .form-select.is-invalid { border-color: var(--hb-danger) !important; }
  .hb-theme .invalid-feedback { color: var(--hb-danger); }
  .hb-theme .input-group > :not(:first-child):not(:last-child) { border-radius: 0; }
  .hb-theme .input-group > :first-child:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
  .hb-theme .input-group > :last-child:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
  .hb-theme .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--hb-text);
    --bs-table-border-color: var(--hb-border);
    --bs-table-striped-bg: var(--hb-surface-soft);
    --bs-table-striped-color: var(--hb-text);
    --bs-table-hover-bg: var(--hb-surface-soft);
    --bs-table-hover-color: var(--hb-text);
  }
  .hb-theme .table > thead > tr > th { background: var(--hb-surface-soft); color: var(--hb-muted); font-weight: 600; }
  .hb-theme :is(.dropdown-menu, .accordion-item, .accordion-button, .page-link) { background: var(--hb-surface); color: var(--hb-text); border-color: var(--hb-border); }
  .hb-theme .dropdown-menu { padding: .45rem; border-radius: 12px; box-shadow: 0 10px 30px #00000018; }
  .hb-theme .dropdown-item { color: var(--hb-text); border-radius: 7px; padding: .6rem .75rem; }
  .hb-theme .dropdown-item:hover, .hb-theme .dropdown-item:focus { background: var(--hb-surface-soft); color: var(--hb-text); }
  .hb-theme .accordion-button:not(.collapsed), .hb-theme .nav-pills .nav-link.active, .hb-theme .page-item.active .page-link { background: var(--hb-accent-soft); color: var(--hb-accent); }
  .hb-theme .nav-tabs { border-color: var(--hb-border); gap: .25rem; }
  .hb-theme .nav-tabs .nav-link { color: var(--hb-muted); border-radius: 9px 9px 0 0; }
  .hb-theme .nav-tabs .nav-link.active { color: var(--hb-accent); background: var(--hb-surface); border-color: var(--hb-border) var(--hb-border) var(--hb-surface); }
  .hb-theme .nav-pills .nav-link { color: var(--hb-muted); border-radius: 9px; }
  .hb-theme .alert { border-radius: 12px; box-shadow: none; line-height: 1.6; }
  .hb-theme .alert-light { color: var(--hb-muted); background: var(--hb-surface); border: 1px solid var(--hb-border); }
  .hb-theme .alert-info { color: var(--hb-info); background: var(--hb-info-soft); border-color: color-mix(in srgb, var(--hb-info) 35%, transparent); }
  .hb-theme .alert-success { color: var(--hb-accent); background: var(--hb-accent-soft); border-color: color-mix(in srgb, var(--hb-accent) 35%, transparent); }
  .hb-theme .alert-warning { color: var(--hb-warning); background: var(--hb-warning-soft); border-color: color-mix(in srgb, var(--hb-warning) 35%, transparent); }
  .hb-theme .alert-danger { color: var(--hb-danger); background: var(--hb-danger-soft); border-color: color-mix(in srgb, var(--hb-danger) 35%, transparent); }
  .hb-theme .badge { font-weight: 600; line-height: 1.3; }
  .hb-theme .modern-nav { background: var(--hb-surface); border-bottom: 1px solid var(--hb-border); box-shadow: none; }
  .hb-theme .modern-nav .brand-text { color: var(--hb-accent) !important; }
  .hb-theme .modern-nav .navbar-nav .nav-link { color: var(--hb-muted) !important; transform: none; }
  .hb-theme .modern-nav .navbar-nav .nav-link:hover,
  .hb-theme .modern-nav .navbar-nav .nav-link.active { color: var(--hb-accent) !important; background: var(--hb-accent-soft); }
  .hb-theme .modern-nav .navbar-collapse { background: var(--hb-surface); border-color: var(--hb-border); box-shadow: none; }
  .hb-theme footer.bg-light { background: var(--hb-surface) !important; color: var(--hb-muted); border-top: 1px solid var(--hb-border); }
  .hb-theme .hb-footer-links { display: flex; flex-wrap: wrap; gap: .25rem .75rem; justify-content: center; }
  .hb-theme .hb-footer-links a { display: inline-flex; align-items: center; min-height: 44px; padding: .25rem; }
  @media (min-width: 768px) {
    .hb-theme .hb-footer-links { justify-content: flex-end; }
  }

  /* Recipes and planner use custom components outside Bootstrap cards. */
  .hb-theme[data-hb-app="recipes"] :is(.recipe-book-header, .recipe-hero, .recipe-content, .category-tabs, .recipe-card, .method-card, .form-card, .recipe-result-card, .results-header, .nutrition-card) {
    background: var(--hb-surface) !important;
    color: var(--hb-text);
    border: 1px solid var(--hb-border);
    border-radius: var(--hb-radius);
    box-shadow: none !important;
    transform: none;
  }
  .hb-theme[data-hb-app="recipes"] .recipe-book-header { padding: 2rem 0; margin-top: 1.5rem; }
  .hb-theme[data-hb-app="recipes"] .recipe-book-header .text-white { color: var(--hb-text) !important; }
  .hb-theme[data-hb-app="recipes"] :is(.recipe-title, .recipe-name, .section-title, .upload-text, .empty-state-title, .identified-ingredients h5) { color: var(--hb-text); }
  .hb-theme[data-hb-app="recipes"] :is(.meta-item, .recipe-date, .recipe-description, .upload-subtext, .empty-state-text, .nutrition-label) { color: var(--hb-muted); }
  .hb-theme[data-hb-app="recipes"] :is(.recipe-image-container, .form-section, .ingredient-item, .nutrition-item, .photo-upload-section, .identified-ingredients, .manual-add-section, .stat-badge, .category-tab) {
    background: var(--hb-surface-soft); color: var(--hb-text); border-color: var(--hb-border); box-shadow: none; transform: none;
  }
  .hb-theme[data-hb-app="recipes"] :is(.category-tab.active, .method-icon, .selected-method-badge, .ingredient-tag, .recipe-number) { background: var(--hb-accent-soft); color: var(--hb-accent); box-shadow: none; border-color: var(--hb-border); }
  .hb-theme[data-hb-app="recipes"] .recipe-category-badge { background: var(--hb-surface); color: var(--hb-text); box-shadow: none; }
  .hb-theme[data-hb-app="recipes"] :is(.method-card, .recipe-result-card)::before { display: none; }
  .hb-theme[data-hb-app="recipes"] .meal-planner { --mp-ink: var(--hb-text); --mp-muted: var(--hb-muted); --mp-green: var(--hb-accent-strong); --mp-border: var(--hb-border); --mp-pale: var(--hb-surface-soft); }
  .hb-theme[data-hb-app="recipes"] .meal-planner :is(.planner-card, .planner-choice, .planner-slot, .planner-grocery-row, .planner-plan-list a, .planner-label-dialog, .planner-message.is-user) { background: var(--hb-surface); color: var(--hb-text); border-color: var(--hb-border); box-shadow: none; }
  .hb-theme[data-hb-app="recipes"] .meal-planner :is(.planner-preferences, .planner-chat, .planner-tabs, .planner-consent, .planner-empty, .planner-message.is-assistant, .planner-cook-card .planner-inline-form, .planner-log-preview, .planner-cook-filter, .planner-selection-progress, .planner-stage, .planner-shopping-summary, .planner-review-intro) { background: var(--hb-surface-soft); color: var(--hb-text); border-color: var(--hb-border); }
  .hb-theme[data-hb-app="recipes"] .meal-planner :is(.planner-tabs button, .planner-message strong, .planner-eyebrow, .planner-header-links a, .planner-consent p, .planner-empty p) { color: var(--hb-muted); }
  .hb-theme[data-hb-app="recipes"] .meal-planner :is(.planner-tabs button[aria-current="page"], .planner-stage.is-current, .planner-chip, .planner-nutrition > span) { background: var(--hb-accent-soft); color: var(--hb-text); box-shadow: none; }
  .hb-theme[data-hb-app="recipes"] .meal-planner :is(.planner-choice p, .planner-section-heading p, .planner-muted, .planner-nutrition-note) { color: var(--hb-muted); }
  .hb-theme[data-hb-app="recipes"] .meal-planner :is(.planner-field > small, .planner-muted, .planner-choice p, .planner-chat > p, .planner-grocery-row p) { font-size: .875rem; }
  .hb-theme[data-hb-app="recipes"] .meal-planner .planner-got-control { color: var(--hb-accent); border-color: var(--hb-border); }
  .hb-theme[data-hb-app="recipes"] .meal-planner .planner-restriction-note { background: var(--hb-warning-soft); color: var(--hb-warning); border-color: color-mix(in srgb, var(--hb-warning) 40%, transparent); }
  .hb-theme[data-hb-app="recipes"] .meal-planner .planner-chat textarea { font-size: 1rem; }

  /* Reports, calendars and notes. Series/status colors remain meaningful. */
  .hb-theme[data-hb-app="reports"] :is(.stat-card, .period-selector, .data-table, .custom-date-range, .reports-subnav, .metric-item, .achievement-item, .insight-item) {
    background: var(--hb-surface) !important; color: var(--hb-text); border: 1px solid var(--hb-border); border-radius: var(--hb-radius); box-shadow: none;
  }
  .hb-theme[data-hb-app="reports"] .stat-card :is(.text-white, h3, h4, h5, p, small) { color: var(--hb-text) !important; }
  .hb-theme[data-hb-app="reports"] .stat-card { text-align: left; }
  .hb-theme[data-hb-app="reports"] .stat-card > i { color: var(--hb-accent); }
  .hb-theme[data-hb-app="reports"] .reports-subnav :is(.navbar-brand, .nav-link) { color: var(--hb-muted) !important; }
  .hb-theme[data-hb-app="reports"] .reports-subnav .nav-link.active { color: var(--hb-accent) !important; background: var(--hb-accent-soft); }
  .hb-theme[data-hb-app="calendarboard"] :is(.hb-cell, .hb-week-sum, .note-card, .filter-section, .stats-bar) { background: var(--hb-surface); color: var(--hb-text); border: 1px solid var(--hb-border); box-shadow: none; }
  .hb-theme[data-hb-app="calendarboard"] :is(.note-date, .note-content, .stat-value, .stat-label, .cell-date) { color: var(--hb-text); }
  .hb-theme[data-hb-app="calendarboard"] .hb-cell.today { background: var(--hb-accent-soft); border-color: var(--hb-accent); }
  .hb-theme[data-hb-app="calendarboard"] :is(.note-card, .hb-cell):hover { background: var(--hb-surface-soft); box-shadow: none; transform: none; }
  .hb-theme[data-hb-app="calendarboard"] .note-timestamp { color: var(--hb-muted); font-size: .875rem; }

  /* Food analysis data tiles and assistant surfaces. */
  .hb-theme[data-hb-app="nutrition"] .video-tutorial-wrapper,
  .hb-theme[data-hb-app="nutrition"] .video-tutorial-wrapper > [data-bs-toggle="collapse"],
  .hb-theme[data-hb-app="nutrition"] #tutorialVideo,
  .hb-theme[data-hb-app="nutrition"] .video-tutorial {
    background: var(--hb-surface-soft) !important;
    border-color: var(--hb-border) !important;
    color: var(--hb-text) !important;
  }
  .hb-theme[data-hb-app="nutrition"] .alert-light.border-success { border: 1px solid var(--hb-border) !important; }
  .hb-theme[data-hb-app="nutrition"] .nutrition-badge { background: var(--hb-surface-soft); color: var(--hb-text); border: 1px solid var(--hb-border); border-radius: 12px; box-shadow: none; transform: none; }
  .hb-theme[data-hb-app="nutrition"] .nutrition-badge .badge-label { color: var(--hb-muted); font-size: .8rem; }
  .hb-theme[data-hb-app="nutrition"] .nutrition-badge .badge-value { color: var(--hb-text); }
  .hb-theme[data-hb-app="nutrition"] .extended-nutrition-grid > div { background: var(--hb-surface-soft); border-color: var(--hb-border); }
  .hb-theme :is(.assistant-message, .popup-assistant-message, .chat-input, .chat-header, .chat-popup, .popup-welcome) { background: var(--hb-surface) !important; color: var(--hb-text) !important; border-color: var(--hb-border); }
  .hb-theme :is(.user-message, .popup-user-message) { background: var(--hb-accent-soft) !important; color: var(--hb-text) !important; }
  .hb-theme :is(.chat-suggestions .chip, .popup-suggestions .chip) { background: var(--hb-surface-soft); color: var(--hb-text); border-color: var(--hb-border); }
  .hb-theme :is(.message-time, .popup-welcome p) { color: var(--hb-muted); }
  .hb-theme .chat-bubble { background: var(--hb-accent-soft); color: var(--hb-text); box-shadow: var(--hb-shadow); }
  .hb-theme .chat-popup { border-radius: var(--hb-radius); border: 1px solid var(--hb-border); box-shadow: 0 12px 40px #00000028; }
  .hb-theme .chat-input input { background: var(--hb-surface-soft); border-color: var(--hb-border); color: var(--hb-text); }
  .hb-theme .hb-subscriptions :is(.card, .card-body) { color: var(--hb-text); }

  @media (max-width: 767.98px) {
    .hb-theme .container { padding-inline: 16px; }
    .hb-theme .card-header, .hb-theme .card-body { padding: 1rem; }
    .hb-theme .btn { white-space: normal; }
    .hb-theme .nav-tabs { flex-wrap: wrap; }
    .hb-theme .table { font-size: .875rem; }
    .hb-theme[data-hb-app="recipes"] :is(.recipe-hero, .recipe-content, .form-card) { padding: 1.25rem; }
    .hb-theme[data-hb-app="recipes"] .meal-planner .planner-form-grid { gap: 1rem; }
  }
  @media (prefers-reduced-motion: reduce) {
    .hb-theme :is(.btn, .card, .nav-link, .recipe-card, .method-card) { transition: none !important; }
  }
}
