/* Light theme with the Carbon Footprint brand green as the accent */
:root[data-bs-theme=light] {
    --bs-theme: #2a523d;
    --bs-theme-rgb: 42, 82, 61;
    --bs-theme-color: #ffffff;
    /* Chart series: validated for colour-blind separation and 3:1 contrast on the light surface */
    --cafo-scope1: #2e8b57;
    --cafo-scope2: #2a78d6;
    --cafo-previous-year: #66cc8a; /* previous year beside --cafo-scope1; below 3:1, so the legend and values table carry it */
}

.chart-box { position: relative; height: 260px; }
.chart-box-lg { position: relative; height: 320px; }
.dashboard-card { color: inherit; }
.dashboard-card:hover .card-body { background: rgba(var(--bs-theme-rgb, 60, 210, 165), .06); }
.table td.num, .table th.num { text-align: right; white-space: nowrap; }
.param-label { max-width: 520px; }

/* Header: logos, programme link */
.app-header .brand { width: auto; padding-right: 1rem; }
.app-header .brand .brand-logo { display: flex; align-items: center; text-decoration: none; }
.cafo-logo { height: 44px; width: auto; }
.partner-logo { height: 40px; width: auto; }
.cfrrp-link { white-space: nowrap; }
.cfrrp-full { display: none; }
@media (min-width: 1600px) {
    .cfrrp-full { display: inline; }
    .cfrrp-short { display: none; }
}
/* The theme hides the brand on phones; keep the logo */
@media (max-width: 767.98px) {
    .app-header .brand { display: flex; padding-left: 0; }
    .cafo-logo { height: 36px; }
}

/* Login / register: the theme stretches the form to the full screen height; sit it under the logo instead */
.app-without-header .login { min-height: 0; padding-top: 1.5rem; padding-bottom: 1.5rem; }
.auth-topbar .partner-logo { height: 44px; }
.auth-brand { padding-top: 1rem; }
.auth-logo { height: 80px; width: auto; max-width: 100%; }
.auth-disclaimer { padding: .75rem 1rem; border: 1px solid var(--bs-border-color); border-left: 3px solid var(--bs-theme); border-radius: .375rem; background: rgba(var(--bs-theme-rgb), .04); }

/* Header search: a highlighted icon, and company suggestions while typing */
.app-header .search-toggle .menu-icon {
    display: flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: 50%;
    background: var(--bs-theme);
}
.app-header .search-toggle .menu-icon .nav-icon { color: #fff; font-size: 1.05rem; }
.app-header .search-toggle:hover .menu-icon { filter: brightness(1.2); }
.app-header .menu-search-input { position: relative; }
.header-search { position: relative; flex: 1 1 auto; max-width: 440px; margin: 0 1rem; align-self: center; }
.header-search .form-control {
    height: 40px; padding-left: 2.5rem; border-radius: 2rem;
    border: 2px solid rgba(var(--bs-theme-rgb), .55); background: var(--bs-body-bg);
}
.header-search .form-control:focus { border-color: var(--bs-theme); box-shadow: 0 0 0 .2rem rgba(var(--bs-theme-rgb), .15); }
.header-search > .bi-search { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--bs-theme); pointer-events: none; }
.header-search .search-suggestions { top: calc(100% + 6px); right: auto; width: max(100%, 420px); }
.search-loading { display: flex; align-items: center; padding: .75rem 1rem; color: var(--bs-secondary-color); }
.search-suggestions {
    position: absolute; top: 100%; left: 0; right: 0; z-index: 1100;
    max-height: 60vh; overflow-y: auto;
    background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .12);
}
.search-item { display: block; padding: .6rem 1rem; color: var(--bs-body-color); text-decoration: none; border-bottom: 1px solid var(--bs-border-color); }
.search-item:last-child { border-bottom: 0; }
.search-item:hover, .search-item.active { background: rgba(var(--bs-theme-rgb), .08); color: var(--bs-body-color); }
.search-name { font-weight: 600; }
.search-name mark { padding: 0; background: rgba(var(--bs-theme-rgb), .18); color: inherit; }
.search-detail { font-size: .8rem; color: var(--bs-secondary-color); }
.search-empty { padding: .75rem 1rem; color: var(--bs-secondary-color); }

/* Year-on-year change */
.change { font-weight: 600; white-space: nowrap; }
.scope-change {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .35rem .85rem; border: 1px solid var(--bs-border-color); border-radius: 2rem;
    background: var(--bs-body-bg);
}

/* Tables scroll sideways on narrow screens */
.dt-layout-table > div { overflow-x: auto; }

/* Top 100 */
.podium { color: inherit; border-top: 4px solid var(--medal); }
.podium-gold { --medal: #c9a227; }
.podium-silver { --medal: #8f9aa3; }
.podium-bronze { --medal: #b0703c; }
.podium-rank {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2.25rem; height: 2.25rem; border-radius: 50%;
    background: var(--medal); color: #fff; font-weight: 700;
}
.reduction-bar { display: inline-block; width: 72px; height: 6px; border-radius: 3px; background: rgba(var(--bs-success-rgb), .15); overflow: hidden; }
.reduction-bar span { display: block; height: 100%; border-radius: 3px; background: var(--bs-success); }
.top100-banner { color: inherit; }
.top100-tabs, .compare-measures { gap: .5rem; }
.top100-tabs .nav-link, .compare-measures .nav-link { border: 1px solid var(--bs-theme); color: var(--bs-theme); }
.top100-tabs .nav-link.active, .compare-measures .nav-link.active { color: #fff; }

/* Compare companies */
.compare-chip {
    display: inline-flex; align-items: center; gap: .5rem; padding: .3rem .4rem .3rem .75rem;
    border: 1px solid rgba(var(--bs-theme-rgb), .45); border-radius: 2rem; background: rgba(var(--bs-theme-rgb), .06); font-weight: 600;
}
.compare-remove {
    display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem;
    border-radius: 50%; color: var(--bs-secondary-color); text-decoration: none; font-size: .75rem;
}
.compare-remove:hover { background: rgba(var(--bs-danger-rgb), .12); color: var(--bs-danger); }
.compare-add { position: relative; flex: 1 1 240px; max-width: 360px; }
.compare-add > .bi-plus-lg { position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: var(--bs-theme); pointer-events: none; }
.compare-add .form-control { padding-left: 2.2rem; border-radius: 2rem; border: 1px dashed rgba(var(--bs-theme-rgb), .6); }
.compare-add .form-control:focus { border-style: solid; border-color: var(--bs-theme); box-shadow: 0 0 0 .2rem rgba(var(--bs-theme-rgb), .15); }
.compare-add .search-suggestions { top: calc(100% + 6px); width: max(100%, 380px); right: auto; }