/* Application — Azur solaire. Shared cosmetic layer; page layouts and controls stay in their own stylesheets. */
:root {
  color-scheme: light dark;
  --azur-canvas: #f4f8fb;
  --azur-panel: #ffffff;
  --azur-soft: #edf6fb;
  --azur-ink: #193a4c;
  --azur-muted: #5a7180;
  --azur-line: #dce9ef;
  --azur-deep: #164e68;
  --azur-blue: #197d9f;
  --azur-mid: #40a0c0;
  --azur-sky: #88d0e8;
  --azur-gold: #ffbf00;
  --azur-on-gold: #193e50;
  --azur-selection: #e7f4fa;
  --azur-action: linear-gradient(135deg, #1b789b, #19698c);
  --azur-shadow: 0 4px 9px #193f5310, 0 16px 32px #367e9510;
  /* Existing components consume these aliases, including the public catalogue. */
  --appy-blue: var(--azur-blue);
  --appy-blue-soft: var(--azur-sky);
  --appy-blue-ink: var(--azur-ink);
  --appy-surface: var(--azur-panel);
  --appy-surface-strong: var(--azur-panel);
  --appy-border: var(--azur-line);
  --appy-shadow: var(--azur-shadow);
  --appy-panel-background: var(--azur-panel);
  --appy-panel-border: var(--azur-line);
  --appy-muted: var(--azur-muted);
  --appy-link: var(--azur-blue);
}
@media (prefers-color-scheme: dark) {
  :root {
    --azur-canvas: #111d26;
    --azur-panel: #1b2c37;
    --azur-soft: #203742;
    --azur-ink: #eef8fc;
    --azur-muted: #abc3d0;
    --azur-line: #304957;
    --azur-deep: #b9e6f5;
    --azur-blue: #88d0e8;
    --azur-gold: #ffc928;
    --azur-selection: #254957;
    --azur-action: linear-gradient(135deg, #235e79, #1b5873);
    --azur-shadow: 0 4px 9px #00000018, 0 16px 32px #0000001a;
  }
}

/* Screen-only overrides leave the existing print / PDF presentation intact. */
@media screen {
  body {
    font-family: Manrope, Arial, sans-serif !important;
    color: var(--azur-ink) !important;
    background: var(--azur-canvas) !important;
  }
  button, input, select, textarea { font-family: inherit; }
  :where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid var(--azur-blue);
    outline-offset: 4px;
  }
  #main-content {
    background: var(--azur-canvas) !important;
    color: var(--azur-ink) !important;
    isolation: isolate;
  }
  #main-content::before {
    content: "";
    position: absolute;
    inset: 0 0 auto auto;
    width: min(44%, 460px);
    height: 215px;
    border-radius: 0 0 0 100%;
    background: var(--azur-soft);
    border-top: 5px solid var(--azur-gold);
    pointer-events: none;
    z-index: -1;
  }
  html[dir="rtl"] #main-content::before {
    inset: 0 auto auto 0;
    border-radius: 0 0 100% 0;
  }

  /* The current sidebar hierarchy, links and mobile drawer are retained. */
  #sidebar {
    color: #fff !important;
    background: linear-gradient(160deg, #1a7697, #186786 48%, #124c68) !important;
    border: 0 !important;
    box-shadow: 6px 0 28px #103e5a14 !important;
    isolation: isolate;
  }
  #sidebar::before, #sidebar::after {
    content: "";
    position: absolute;
    pointer-events: none;
    z-index: -1;
    border-radius: 50%;
  }
  #sidebar::before { width: 80px; height: 300px; inset: 40% auto auto 0; background: #40a0c01c; border-radius: 0 100% 100% 0; }
  #sidebar::after { width: 75px; height: 170px; inset: auto 0 12% auto; background: #88d0e817; border-radius: 100% 0 0 100%; }
  #sidebar .navigation-panel { background: transparent !important; }
  #sidebar .sidebar-collections {
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid #ffffff26 !important;
    border-bottom: 1px solid #ffffff26 !important;
    border-radius: 0 !important;
    padding: 16px 0 !important;
    box-shadow: none !important;
  }
  #sidebar .sidebar-collections h2 { color: #c0e2ef !important; border: 0 !important; padding-inline: 10px; }
  #sidebar .navigation-panel .sidebar-nav-list > li {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 12px !important;
  }
  #sidebar .navigation-panel a.nav-link {
    background: transparent !important;
    color: #fff !important;
    border-radius: 12px !important;
    padding: 10px !important;
    font-size: 14px !important;
    font-weight: 650;
  }
  #sidebar .navigation-panel a.nav-link img { filter: brightness(0) invert(1); opacity: .88; }
  #sidebar .navigation-panel .sidebar-nav-list > li:hover > a.nav-link { background: #ffffff14 !important; color: #fff !important; }
  #sidebar .navigation-panel .sidebar-nav-list > li.active > a.nav-link,
  #sidebar .navigation-panel .sidebar-nav-list a.nav-link[aria-current="page"] {
    background: var(--azur-gold) !important;
    color: var(--azur-on-gold) !important;
    box-shadow: 0 5px 15px #0d40502b !important;
  }
  #sidebar .navigation-panel .sidebar-nav-list > li.active > a.nav-link img,
  #sidebar .navigation-panel a.nav-link[aria-current="page"] img { filter: brightness(.24); opacity: 1; }
  #sidebar .sidebar-brand { align-self: center; }
  #sidebar .sidebar-brand .logo-appy-bonsai {
    content: url('/images/logo_appy_bonsai.png') !important;
    padding: 10px !important;
    background: #fff !important;
    border-radius: 18px;
    box-sizing: content-box;
  }
  #sidebar .sidebar-language select,
  #sidebar .sidebar-language .select-selected,
  #sidebar .catalogue-languages summary {
    color: #fff !important;
    background: #0f4b68 !important;
    border: 1px solid #88d0e84a !important;
    border-radius: 12px !important;
    box-shadow: none !important;
  }
  #sidebar .sidebar-language select option { background: #124c68; color: #fff; }
  #sidebar .sidebar-language .select-selected::after { border-color: #88d0e8 !important; }
  #sidebar .sidebar-language .select-items { background: var(--azur-panel) !important; color: var(--azur-ink) !important; border-color: var(--azur-line) !important; }
  #sidebar .sidebar-language .select-items div:hover { background: var(--azur-selection) !important; }
  #sidebar .catalogue-languages nav { background: var(--azur-panel); border-color: var(--azur-line); }
  #sidebar .catalogue-languages nav a { color: var(--azur-ink) !important; }
  #sidebar .catalogue-languages nav a:hover,
  #sidebar .catalogue-languages nav a[aria-current] { background: var(--azur-selection) !important; }
  #sidebar :where(a, button, select, summary):focus-visible { outline-color: var(--azur-gold); }
  #sidebar .logout-container button, #sidebar .sidebar-signin {
    background: #ffffff14 !important;
    color: #fff !important;
    border: 1px solid #ffffff38 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
  }
  .hamburger { background: var(--azur-panel) !important; border: 1px solid var(--azur-line) !important; border-radius: 12px !important; }

  /* Collection controls and cards: the existing sorting and pagination stay live. */
  #main-content .pagination a,
  .catalogue-pagination a,
  .catalogue-pagination span {
    background: var(--azur-panel) !important;
    color: var(--azur-deep) !important;
    border: 1px solid var(--azur-line) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font-weight: 750;
  }
  #main-content .pagination a.active,
  .catalogue-pagination [aria-current="page"] {
    background: var(--azur-gold) !important;
    color: var(--azur-on-gold) !important;
    border-color: transparent !important;
  }
  #main-content .qr-link a {
    border-radius: 12px !important;
    background: var(--azur-panel) !important;
    color: var(--azur-deep) !important;
    border: 1px solid var(--azur-line) !important;
    box-shadow: var(--azur-shadow) !important;
    backdrop-filter: none;
  }
  #main-content #sortSelect, #main-content .form-input, #main-content .form-textarea {
    background: var(--azur-panel) !important;
    color: var(--azur-ink) !important;
    border: 1px solid var(--azur-line) !important;
    border-radius: 10px !important;
  }
  #main-content #sortButton, #main-content .submit-button, #main-content .contact-button {
    color: #fff !important;
    background: var(--azur-action) !important;
    border: 1px solid transparent !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 14px #176f911a !important;
  }
  #main-content .cards-grid .card, #main-content .catalogue-card,
  #main-content .profile-card, #main-content .profile-container,
  #main-content .stats-card-panel, #main-content .section, #main-content .form-container {
    background: var(--azur-panel) !important;
    border: 1px solid var(--azur-line) !important;
    border-radius: 20px !important;
    box-shadow: var(--azur-shadow) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  #main-content .cards-grid .card { display: flex; flex-direction: column; padding: 10px !important; gap: 10px; }
  #main-content .cards-grid .card > a:not(.titre-liste) { order: 1; line-height: 0; }
  #main-content .cards-grid .card > .titre-liste { order: 2; margin: 0 !important; padding: 0 3px 4px; }
  #main-content .cards-grid .card .grid-img { border-radius: 13px !important; box-shadow: none !important; }
  #main-content .cards-grid .card .titre-liste { font-weight: 800; color: var(--azur-deep) !important; line-height: 1.35; }
  #main-content .catalogue-card { border-radius: 20px; }
  #main-content .catalogue-title, #main-content .catalogue-page-header h1 { color: var(--azur-deep) !important; }
  #main-content .catalogue-photo { border-radius: 14px; background: var(--azur-soft); }

  #main-content .profile-hero { background: var(--azur-soft) !important; border-color: var(--azur-line) !important; }
  #main-content .profile-card .avatar {
    background: linear-gradient(145deg, #40a0c0, #2088b0) !important;
    color: #fff !important;
    border-radius: 18px;
    box-shadow: 5px 5px 0 var(--azur-gold) !important;
  }
  #main-content .profile-card .name { color: var(--azur-deep) !important; font-weight: 800; letter-spacing: -.04em; }
  #main-content .profile-card :is(.label, .value) { color: var(--azur-ink) !important; }
  #main-content .profile-card :is(.muted, .meta) { color: var(--azur-muted) !important; }
  #main-content .profile-card :is(.chip, .chip-kg) { background: var(--azur-selection) !important; color: var(--azur-deep) !important; border-color: var(--azur-line) !important; }
  #main-content .profile-card .info-row { border-color: var(--azur-line) !important; }
  #main-content .section { position: relative; overflow: hidden; }
  #main-content .section-container { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1100px; }
  #main-content .section-container :is(.section, .junip) { width: auto; min-width: 0; box-sizing: border-box; }
  #main-content .section-container img { max-width: 100%; object-fit: contain; }
  #main-content .section::before { content: ""; position: absolute; inset: 0 auto auto 24px; width: 42px; height: 5px; background: var(--azur-gold); border-radius: 0 0 6px 6px; }
  #main-content .section-title { color: var(--azur-deep) !important; font-weight: 800; }
  #main-content .junip { border-radius: 20px !important; overflow: hidden; backdrop-filter: none; -webkit-backdrop-filter: none; }
  #main-content :is(.ab-search, .ab-input, #filtersPanel, .suggestions-panel) {
    background: var(--azur-panel) !important;
    color: var(--azur-ink) !important;
    border-color: var(--azur-line) !important;
    border-radius: 12px !important;
    box-shadow: var(--azur-shadow);
  }
  #main-content :is(.ab-search input, .suggestion-item, #filtersPanel .ab-label, .resultats) { color: var(--azur-ink) !important; }
  #main-content :is(.ab-search input)::placeholder { color: var(--azur-muted); }
  #main-content .filters-toggle { background: var(--azur-soft) !important; color: var(--azur-deep) !important; border-color: var(--azur-line) !important; border-radius: 12px; }
  #main-content .ab-search button { background: var(--azur-action) !important; }

  /* All statistics remain visible, including the distribution / valuation tables. */
  #main-content .stats-page { color: var(--azur-ink) !important; }
  #main-content .stats-page-header h1, #main-content .stats-card-panel h2 { color: var(--azur-deep) !important; font-weight: 800; letter-spacing: -.035em; }
  #main-content .stats-card-panel h2 { display: flex; align-items: center; gap: 10px; }
  #main-content .stats-card-panel h2::before { content: ""; flex: 0 0 5px; height: 18px; border-radius: 3px; background: var(--azur-gold); }
  #main-content .stats-page-header p, #main-content .stats-inventory-card .stats-label,
  #main-content .stats-activity-label, #main-content .stats-distribution-header,
  #main-content .stats-estimated-table th { color: var(--azur-muted) !important; }
  #main-content .stats-inventory-card { background: var(--azur-soft) !important; border: 1px solid var(--azur-line) !important; border-radius: 14px; box-shadow: none !important; }
  #main-content .stats-inventory-card .stats-value, #main-content .stats-finance-label,
  #main-content .stats-finance-value, #main-content .stats-finance-total-label,
  #main-content .stats-estimated-table, #main-content .stats-distribution-category,
  #main-content .stats-distribution-total-label, #main-content .stats-distribution-value,
  #main-content .stats-distribution-price { color: var(--azur-ink) !important; }
  #main-content .stats-activity-circle { border: 0 !important; border-radius: 34% 42% 38% 42%; box-shadow: none !important; }
  #main-content .stats-circle-species { background: #e0f2fa !important; }
  #main-content .stats-circle-events { background: #bce5f2 !important; }
  #main-content .stats-circle-photos { background: #7fcbe3 !important; }
  #main-content .stats-activity-circle .stats-value { color: #193e50 !important; }
  #main-content .stats-activity-circle .stats-icon { filter: brightness(.35); }
  #main-content .stats-finance-bar, #main-content .stats-distribution-track { background: var(--azur-soft) !important; }
  #main-content .stats-finance-fill { background: linear-gradient(90deg, #bce5f2, #88d0e8) !important; }
  #main-content .stats-distribution-fill { background: linear-gradient(90deg, #2088b0, #88d0e8) !important; }
  #main-content .stats-finance-fill.fill-pots { background: #88d0e8 !important; }
  #main-content .stats-finance-fill.fill-rocks { background: #40a0c0 !important; }
  #main-content .stats-finance-fill.fill-tools { background: #6db7d0 !important; }
  #main-content .stats-finance-fill.fill-tablettes { background: #317b9c !important; }
  #main-content .stats-finance-fill.fill-accessoires { background: #a4ddee !important; }
  #main-content .stats-finance-fill.fill-shitakusa { background: #53adc8 !important; }
  #main-content .stats-finance-total-value { background: var(--azur-gold) !important; color: var(--azur-on-gold) !important; border-radius: 12px; }
  #main-content .stats-distribution-panel::before { background: var(--azur-soft) !important; }
  #main-content .stats-distribution-row, #main-content .stats-distribution-total { border-color: var(--azur-line) !important; background: var(--azur-soft) !important; box-shadow: none !important; }
  #main-content .stats-distribution-category-icon, #main-content .stats-distribution-value,
  #main-content .stats-distribution-price { background: var(--azur-panel) !important; box-shadow: none !important; }
  #main-content .stats-distribution-total-icon { background: #2088b0 !important; }
  #main-content .stats-distribution-total .stats-distribution-price { background: var(--azur-gold) !important; color: var(--azur-on-gold) !important; }
  #main-content .stats-distribution-value::before, #main-content .stats-distribution-price::before { color: var(--azur-muted) !important; }

  /* Detail styles are also loaded inside older templates; component-level tokens
     and specific selectors ensure those templates inherit the same theme. */
  .bonsai-detail-page {
    --bonsai-bg: var(--azur-canvas);
    --bonsai-glass: var(--azur-panel);
    --bonsai-glass-strong: var(--azur-panel);
    --bonsai-text: var(--azur-ink);
    --bonsai-muted: var(--azur-muted);
    --bonsai-line: var(--azur-line);
    --bonsai-stroke: var(--azur-line);
    --bonsai-stroke-dark: var(--azur-line);
    --bonsai-accent: var(--azur-blue);
    --bonsai-shadow: var(--azur-shadow);
    --bonsai-shadow-soft: var(--azur-shadow);
    color: var(--azur-ink) !important;
    font-family: Manrope, Arial, sans-serif !important;
  }
  body .bonsai-detail-page::before, body .bonsai-detail-page #header-container::after { content: none; }
  body .bonsai-detail-page #header-container,
  body .bonsai-detail-page .content,
  body .bonsai-detail-page #prostyle-container,
  body .bonsai-detail-page #event-container,
  body .bonsai-detail-page .event-container,
  body .bonsai-detail-page .qr-code-wrapper,
  body .bonsai-detail-page .share-menu,
  body .bonsai-detail-page #modal,
  body .bonsai-detail-page #modal2,
  body .bonsai-detail-page #modal3,
  body .bonsai-pdf-dialog {
    background: var(--azur-panel) !important;
    color: var(--azur-ink) !important;
    border: 1px solid var(--azur-line) !important;
    border-radius: 20px !important;
    box-shadow: var(--azur-shadow) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body .bonsai-detail-page #style-container, body .bonsai-detail-page #proprio-container { background: var(--azur-soft) !important; border-color: var(--azur-line) !important; box-shadow: none !important; border-radius: 16px !important; }
  body .bonsai-detail-page h1, body .bonsai-detail-page h2,
  body .bonsai-detail-page .dimtitres { color: var(--azur-deep) !important; }
  body .bonsai-detail-page h1 { letter-spacing: -.04em; font-weight: 800; }
  body .bonsai-detail-page h1.common-name { font-size: clamp(24px, 3.2vw, 36px); }
  body .bonsai-detail-page .text-size, body .bonsai-detail-page .textinfos,
  body .bonsai-detail-page .dimensions { color: var(--azur-muted) !important; }
  body .bonsai-detail-page button:not(.share-icon-button, .collapsible, .bonsai-utility-action),
  body .bonsai-export-actions .bonsai-pdf-button,
  body .bonsai-pdf-dialog .bonsai-pdf-submit {
    background: var(--azur-action) !important;
    color: #fff !important;
    border-color: transparent !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 14px #176f911a !important;
  }
  body .bonsai-detail-page .bonsai-species-cta,
  body .bonsai-detail-page .collapsible,
  body .bonsai-detail-page #filter-form label {
    background: var(--azur-soft) !important;
    color: var(--azur-deep) !important;
    border-color: var(--azur-line) !important;
    border-radius: 12px !important;
  }
  body .bonsai-detail-page .collapsible.active { background: var(--azur-selection) !important; }
  body .bonsai-detail-page #filter-form label.active {
    background: var(--azur-gold) !important;
    color: var(--azur-on-gold) !important;
    border-color: var(--azur-gold) !important;
    font-weight: 800;
  }
  body .bonsai-detail-page .bonsai-carrousel-container { border-radius: 17px; border-color: var(--azur-line); box-shadow: none; }
  body .bonsai-detail-page .bonsai-arrow { background: var(--azur-panel) !important; color: var(--azur-deep) !important; border-color: var(--azur-line) !important; }
  body .bonsai-detail-page .bonsai-photo-count { background: #164e68 !important; color: #fff !important; border: 0; }
  body .bonsai-detail-page .bonsai-public-navigation a { color: var(--azur-blue); }
  body .bonsai-detail-page .bonsai-public-summary { color: var(--azur-muted); }
  .bonsai-utility-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 6px 14px;
    flex-basis: 100%;
    width: 100%;
    margin-block: 10px 0;
    padding-block: 14px 0;
    border-top: 1px solid var(--azur-line);
  }
  .bonsai-utility-actions .bonsai-utility-form { margin: 0; max-width: 100%; }
  body .bonsai-detail-page .bonsai-utility-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    max-width: 100%;
    margin: 0 !important;
    padding: 7px 10px !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: var(--azur-muted) !important;
    box-shadow: none !important;
    font: 600 12px/1.45 Manrope, Arial, sans-serif !important;
    text-decoration: none !important;
    transform: none !important;
    cursor: pointer;
  }
  body .bonsai-detail-page .bonsai-utility-action:hover,
  body .bonsai-detail-page .bonsai-utility-action:focus-visible {
    background: var(--azur-soft) !important;
    border-color: var(--azur-line) !important;
    color: var(--azur-deep) !important;
  }
  .bonsai-utility-action svg { flex: 0 0 16px; vertical-align: middle; }
  .bonsai-utility-action span { overflow-wrap: anywhere; }
  body .bonsai-pdf-dialog h3, body .bonsai-pdf-choice { color: var(--azur-ink) !important; }
  body .bonsai-pdf-choice { background: var(--azur-soft) !important; border-color: var(--azur-line) !important; }
  body .bonsai-pdf-choice:has(input:checked) { background: var(--azur-selection) !important; border-color: var(--azur-blue) !important; }
  body .bonsai-pdf-dialog small { color: var(--azur-muted); }
  body .bonsai-pdf-dialog-actions button:not(.bonsai-pdf-submit) { background: var(--azur-soft); color: var(--azur-ink); border-color: var(--azur-line); }
  body .culture-popup { color: var(--azur-ink); }
  body .culture-popup-header :is(h2, h3) { color: var(--azur-deep) !important; }
  body .culture-disclaimer { background: var(--azur-soft); border-color: var(--azur-line); }
  body .culture-disclaimer p { color: var(--azur-muted); }
}
@media screen and (prefers-color-scheme: dark) {
  #main-content .section img[src$="logo_appy_bonsai.png"] { content: url('/images/logo_appy_bonsai_black.png'); }
  #main-content .stats-circle-species { background: #254756 !important; }
  #main-content .stats-circle-events { background: #246078 !important; }
  #main-content .stats-circle-photos { background: #2088b0 !important; }
  #main-content .stats-activity-circle .stats-value { color: #eef8fc !important; }
  #main-content .stats-activity-circle .stats-icon { filter: none; }
  #main-content .stats-finance-fill { background: linear-gradient(90deg, #164e68, #2088b0) !important; }
  #main-content .stats-finance-fill:is(.fill-pots, .fill-rocks, .fill-tools, .fill-tablettes, .fill-accessoires, .fill-shitakusa) { background: #235e79 !important; }
}
@media screen and (max-width: 992px) {
  #main-content { position: relative; }
  #main-content .section-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (max-width: 650px) {
  #main-content .section-container { grid-template-columns: minmax(0, 1fr); }
}
@media screen and (prefers-reduced-motion: reduce) {
  #main-content .card, #main-content .section, #main-content .junip, #main-content .catalogue-card { transition: none !important; }
  #main-content .card:hover, #main-content .section:hover, #main-content .junip:hover, #main-content .catalogue-card:hover { transform: none !important; }
}
