:root {
    --brand-green: #2e7d32;
    --brand-green-soft: #e6f4ea;
    --brand-orange: #f9a825;
    --brand-orange-soft: #fff6df;
    --brand-blue: #1565c0;
    --brand-gray: #6c757d;
    --brand-bg: #f5f7f6;
}

html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* =========================
   STAT TILES
========================= */

.stat-tile {
    border-radius: 14px;
    padding: 1.2rem;
    text-align: center;
    background: #f8f9fa;
    box-shadow: 0 6px 18px rgba(0,0,0,0.06);
    transition: transform .25s ease, box-shadow .25s ease;
}

    .stat-tile.green {
        background: linear-gradient(135deg, #e6f7ef, #f6fffb);
        border-left: 6px solid #2ecc71;
    }

    .stat-tile.orange {
        background: linear-gradient(135deg, #fff3e0, #fffaf2);
        border-left: 6px solid #f39c12;
    }

.stat-label {
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #6c757d;
}

.stat-value {
    font-size: 2.2rem;
    font-weight: 700;
    margin: .3rem 0;
}

.stat-unit {
    font-size: .85rem;
    color: #6c757d;
}

/* Pulse highlight on update */
.stat-tile.pulse {
    animation: pulse 0.45s ease-out;
}
.stat-tile {
    border-radius: 16px;
    padding: 1.4rem;
    background: white;
    box-shadow: 0 10px 28px rgba(0,0,0,0.06);
    border-left: 6px solid transparent;
}

    .stat-tile.green {
        border-left-color: var(--brand-green);
        background: linear-gradient(135deg, #f1faf4, #ffffff);
    }

    .stat-tile.orange {
        border-left-color: var(--brand-orange);
        background: linear-gradient(135deg, #fff8e1, #ffffff);
    }

    .stat-tile.blue {
        border-left-color: var(--brand-blue);
        background: linear-gradient(135deg, #eef4fb, #ffffff);
    }


@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 rgba(0,0,0,0);
    }

    50% {
        transform: scale(1.03);
        box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    }

    100% {
        transform: scale(1);
    }
}
.feed-option {
    position: relative;
    z-index: 1056; /* higher than modal backdrop */
    pointer-events: auto !important;
}

.modal-body {
    pointer-events: auto;
}
#selectedFeedName {
    transition: color 0.2s ease;
}

.feed-option.btn-success {
    box-shadow: 0 0 0 2px rgba(25,135,84,.25);
}
.btn-group > .btn {
    padding: 0.75rem 0.5rem;
    font-weight: 600;
}

.btn-group .btn.active {
    box-shadow: inset 0 0 0 2px rgba(255,255,255,0.4);
}

@media (max-width: 576px) {
    .btn-lg {
        width: 100%;
        font-size: 1.1rem;
    }
}