/* Redditch District Scouts theme for Bootstrap 5.
   Recreates the palette of the old themed Bootstrap 4 build
   (Bootswatch-Flatly-derived with Scouts purple) as overrides on
   vanilla Bootstrap 5.3. */

@import url("https://fonts.googleapis.com/css?family=Lato:400,700,400italic");

:root,
[data-bs-theme=light] {
    --bs-primary: #7413dc;
    --bs-primary-rgb: 116, 19, 220;
    --bs-secondary: #95a5a6;
    --bs-secondary-rgb: 149, 165, 166;
    --bs-success: #18BC9C;
    --bs-success-rgb: 24, 188, 156;
    --bs-info: #3498DB;
    --bs-info-rgb: 52, 152, 219;
    --bs-warning: #F39C12;
    --bs-warning-rgb: 243, 156, 18;
    --bs-danger: #E74C3C;
    --bs-danger-rgb: 231, 76, 60;
    --bs-light: #ecf0f1;
    --bs-light-rgb: 236, 240, 241;
    --bs-dark: #7b8a8b;
    --bs-dark-rgb: 123, 138, 139;
    --bs-link-color: #7413dc;
    --bs-link-color-rgb: 116, 19, 220;
    --bs-link-hover-color: #5d0fb0;
    --bs-link-hover-color-rgb: 93, 15, 176;
    --bs-body-font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

body {
    font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Navbar — white links, light purple on hover */
.navbar-dark {
    --bs-navbar-color: #fff;
    --bs-navbar-hover-color: #d3b4f5;
    --bs-navbar-active-color: #fff;
    --bs-navbar-brand-color: #fff;
    --bs-navbar-brand-hover-color: #d3b4f5;
}

/* Buttons — Bootstrap 5 compiles literal colours into each variant's
   component variables, so each variant must be re-declared. */
.btn-primary {
    --bs-btn-bg: #7413dc;
    --bs-btn-border-color: #7413dc;
    --bs-btn-hover-bg: #6310bb;
    --bs-btn-hover-border-color: #5d0fb0;
    --bs-btn-active-bg: #5d0fb0;
    --bs-btn-active-border-color: #570ea5;
    --bs-btn-disabled-bg: #7413dc;
    --bs-btn-disabled-border-color: #7413dc;
    --bs-btn-focus-shadow-rgb: 137, 54, 225;
}

.btn-secondary {
    --bs-btn-bg: #95a5a6;
    --bs-btn-border-color: #95a5a6;
    --bs-btn-hover-bg: #7f8c8d;
    --bs-btn-hover-border-color: #778485;
    --bs-btn-active-bg: #778485;
    --bs-btn-active-border-color: #707c7d;
    --bs-btn-disabled-bg: #95a5a6;
    --bs-btn-disabled-border-color: #95a5a6;
    --bs-btn-focus-shadow-rgb: 165, 179, 179;
}

.btn-success {
    --bs-btn-bg: #18BC9C;
    --bs-btn-border-color: #18BC9C;
    --bs-btn-hover-bg: #14a085;
    --bs-btn-hover-border-color: #13967d;
    --bs-btn-active-bg: #13967d;
    --bs-btn-active-border-color: #128d75;
    --bs-btn-disabled-bg: #18BC9C;
    --bs-btn-disabled-border-color: #18BC9C;
    --bs-btn-focus-shadow-rgb: 59, 198, 171;
}

.btn-info {
    --bs-btn-color: #fff;
    --bs-btn-bg: #3498DB;
    --bs-btn-border-color: #3498DB;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #2c81ba;
    --bs-btn-hover-border-color: #2a7aaf;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #2a7aaf;
    --bs-btn-active-border-color: #2772a4;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #3498DB;
    --bs-btn-disabled-border-color: #3498DB;
    --bs-btn-focus-shadow-rgb: 82, 168, 224;
}

.btn-warning {
    --bs-btn-color: #fff;
    --bs-btn-bg: #F39C12;
    --bs-btn-border-color: #F39C12;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #cf850f;
    --bs-btn-hover-border-color: #c27d0e;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #c27d0e;
    --bs-btn-active-border-color: #b6750e;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #F39C12;
    --bs-btn-disabled-border-color: #F39C12;
    --bs-btn-focus-shadow-rgb: 245, 171, 63;
}

.btn-danger {
    --bs-btn-bg: #E74C3C;
    --bs-btn-border-color: #E74C3C;
    --bs-btn-hover-bg: #c44133;
    --bs-btn-hover-border-color: #b93d30;
    --bs-btn-active-bg: #b93d30;
    --bs-btn-active-border-color: #ad3929;
    --bs-btn-disabled-bg: #E74C3C;
    --bs-btn-disabled-border-color: #E74C3C;
    --bs-btn-focus-shadow-rgb: 235, 103, 89;
}

/* .btn-default is long gone — anything still using it renders like secondary */
.btn-default {
    --bs-btn-color: #fff;
    --bs-btn-bg: #95a5a6;
    --bs-btn-border-color: #95a5a6;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #7f8c8d;
    --bs-btn-hover-border-color: #778485;
    color: var(--bs-btn-color);
    background-color: var(--bs-btn-bg);
    border-color: var(--bs-btn-border-color);
}

/* Checks, pills, dropdowns, progress — components with compiled primary */
.form-check-input:checked {
    background-color: #7413dc;
    border-color: #7413dc;
}

.form-check-input:focus {
    border-color: #b989ee;
    box-shadow: 0 0 0 0.25rem rgba(116, 19, 220, 0.25);
}

.form-control:focus,
.form-select:focus {
    border-color: #b989ee;
    box-shadow: 0 0 0 0.25rem rgba(116, 19, 220, 0.25);
}

.nav-pills {
    --bs-nav-pills-link-active-bg: #7413dc;
}

.dropdown-menu {
    --bs-dropdown-link-active-bg: #7413dc;
}

.progress,
.progress-stacked {
    --bs-progress-bar-bg: #7413dc;
}

.pagination {
    --bs-pagination-active-bg: #7413dc;
    --bs-pagination-active-border-color: #7413dc;
    --bs-pagination-color: #7413dc;
    --bs-pagination-hover-color: #5d0fb0;
}

/* Large square checkboxes on the booking/admin forms (the old theme rendered
   bool editors as big blocks; keep that affordance with form-check-input) */
.form-check-input.big-check {
    width: 2.5rem;
    height: 2.5rem;
    margin: 0;
}