/*
 * Shared colours and Bootstrap overrides for the website and the admin.
 * bootstrap.min.css comes from the original template with green as the
 * primary and orange as the secondary colour; here everything is switched to
 * the Sweet Home Reality blue so all pages look the same.
 */
:root {
    --shr-primary: #008cce;
    --shr-primary-hover: #0077b0;
    --shr-primary-rgb: 0, 140, 206;
    --shr-primary-dark: #0a436c;
    --shr-navy: #0e2e50;
    --shr-text: #555;
    --shr-muted: #6c757d;
    --shr-surface: #f5f7fa;
    --shr-border: #dde3ea;
    --shr-radius: 20px;
    --shr-radius-sm: 10px;
    --shr-shadow: 0 0 30px rgba(0, 0, 0, .12);

    --bs-primary: var(--shr-primary);
    --bs-primary-rgb: var(--shr-primary-rgb);
    --bs-secondary: var(--shr-muted);
}

a {
    color: var(--shr-primary);
}

a:hover {
    color: var(--shr-primary-hover);
}

.text-primary {
    color: var(--shr-primary) !important;
}

.bg-primary,
.badge.bg-primary {
    background-color: var(--shr-primary) !important;
}

.btn-primary {
    color: #fff;
    background-color: var(--shr-primary);
    border-color: var(--shr-primary);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    color: #fff;
    background-color: var(--shr-primary-hover);
    border-color: var(--shr-primary-hover);
}

.btn-outline-primary {
    color: var(--shr-primary);
    border-color: var(--shr-primary);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    color: #fff;
    background-color: var(--shr-primary);
    border-color: var(--shr-primary);
}

.btn-outline-secondary {
    color: var(--shr-primary-dark);
    border-color: var(--shr-border);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active {
    color: var(--shr-primary-dark);
    background-color: var(--shr-surface);
    border-color: var(--shr-primary-dark);
}

.btn-link {
    color: var(--shr-primary);
}

.btn:focus-visible,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: rgba(var(--shr-primary-rgb), .6);
    box-shadow: 0 0 0 .25rem rgba(var(--shr-primary-rgb), .2);
}

.form-check-input:checked {
    background-color: var(--shr-primary);
    border-color: var(--shr-primary);
}

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}