/* Custom tweaks for Bootstrap-based admin layout */

/* Ensure navbar stays at the top if you want it fixed */
.absolute-top {
    position: sticky;
    top: 0;
    z-index: 1030;
}

/* Footer styling */
.site-footer {
    padding: 1rem 0;
    font-size: 0.95rem;
    color: #555;
    border-top: 1px solid #e5e5e5;
}

    .site-footer .copy {
        text-align: center;
    }

/* Optional: Make main content stand out */
main[role="main"] {
    background: #fff;
    border-radius: 0.5rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.03);
    padding: 2rem 1rem;
    margin-bottom: 2rem;
}

/* Responsive tweaks for navbar brand centering */
@media (max-width: 767.98px) {
    .navbar-brand {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

h1, h2, h3, h4, h5, h6 {
    color: #1a237e; /* Navy - change this to your preferred color */
}

/* ── Color Grade Picker ─────────────────────────────── */
.colorgrade-picker { min-height: 3rem; }
.colorgrade-swatch {
    width: 44px; height: 44px;
    border: 2px solid rgba(0,0,0,0.15);
    border-radius: 6px; padding: 0; cursor: pointer;
    transition: transform .1s ease, box-shadow .1s ease, border-color .1s ease;
    font-size: .75rem; color: #fff;
    text-shadow: 0 1px 1px rgba(0,0,0,0.35); line-height: 1;
}
.colorgrade-swatch:hover { transform: scale(1.08); }
.colorgrade-swatch:focus { outline: none; box-shadow: 0 0 0 3px rgba(13,110,253,.35); }
.colorgrade-swatch.selected {
    border-color: #000;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000;
}
.colorgrade-swatch-none { width: auto; min-width: 64px; padding: 0 10px; }
.colorgrade-separator { border: none; border-top: 1px solid #dee2e6; }