/* Roof Tech brand theme - the ONE copy.
 *
 * Lifted out of resources/views/partials/head.blade.php so the Next.js span
 * calculator under /span-calculator/ can link the same file. It is exported
 * statically and cannot render Blade, and a second hand-kept copy of the
 * brand colours is exactly how two pages of one site drift apart.
 *
 * Loaded AFTER Bootstrap on both sides. Anything added here has to hold up in
 * a Bootstrap page and in a MUI one.
 */

/* ---- Roof Tech brand theme (primary #E31E24) ---- */
:root {
    --bs-primary: #E31E24;
    --bs-primary-rgb: 227, 30, 36;
    --bs-link-color: #E31E24;
    --bs-link-color-rgb: 227, 30, 36;
    --bs-link-hover-color: #B5121B;
    --bs-link-hover-color-rgb: 181, 18, 27;
}

.btn-primary {
    --bs-btn-bg: #E31E24;
    --bs-btn-border-color: #E31E24;
    --bs-btn-hover-bg: #B5121B;
    --bs-btn-hover-border-color: #B5121B;
    --bs-btn-active-bg: #B5121B;
    --bs-btn-active-border-color: #B5121B;
    --bs-btn-disabled-bg: #E31E24;
    --bs-btn-disabled-border-color: #E31E24;
}

.btn-outline-primary {
    --bs-btn-color: #E31E24;
    --bs-btn-border-color: #E31E24;
    --bs-btn-hover-bg: #B5121B;
    --bs-btn-hover-border-color: #B5121B;
    --bs-btn-active-bg: #B5121B;
    --bs-btn-active-border-color: #B5121B;
}

.bg-primary {
    background-color: #E31E24 !important;
}

.text-primary {
    color: #E31E24 !important;
}

.form-check-input:checked {
    background-color: #E31E24;
    border-color: #E31E24;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: #EF8285;
    box-shadow: 0 0 0 .25rem rgba(227, 30, 36, .25);
}

.page-link {
    color: #E31E24;
}

.page-item.active .page-link {
    background-color: #E31E24;
    border-color: #E31E24;
}

/* Square input corners */
.form-control,
.form-select {
    border-radius: 0;
}

/* ---- Layout ---- */
body {
    background-color: #f5f6fa;
}

.navbar.bg-white {
    border-bottom: 1px solid #e5e7eb;
}

.navbar-brand img {
    height: 34px;
    width: auto;
}

/* Top-nav link buttons */
.rt-nav-btn {
    color: #333333;
    border: 1px solid #D9DEE5;
    background: transparent;
}

.rt-nav-btn:hover,
.rt-nav-btn:focus {
    color: #333333;
    border-color: #D9DEE5;
    background: #F2F2F2;
}

.sidebar {
    min-height: calc(100vh - 56px);
    background: #1e293b;
}

.sidebar .nav-link {
    color: #cbd5e1;
    border-radius: .375rem;
    margin-bottom: .15rem;
}

.sidebar .nav-link.active {
    color: #fff;
    background: #E31E24;
}

.sidebar .nav-link:hover {
    color: #fff;
    background: #B5121B;
}

.sidebar .nav-link i {
    width: 1.25rem;
}

.stat-card {
    border: none;
    border-left: 4px solid var(--bs-primary);
}

.navbar-brand {
    font-weight: 600;
}