/**
 * StampyCard Color Palette
 * Based on avatar branding colors
 */

@charset "UTF-8";

:root, [data-bs-theme=light], [data-menu-theme=light] {
    /* Primary - Stampy Orange */
    --tblr-primary: #FF6720;
    --tblr-primary-rgb: 255, 103, 32;
    --tblr-primary-text-emphasis: #9a3d14;
    --tblr-primary-bg-subtle: #fde8df;
    --tblr-primary-border-subtle: #fbd1bf;

    /* Tabler brand color = primary */
    --tblr-tabler: #FF6720;
    --tblr-tabler-rgb: 255, 103, 32;

    /* Success - Verified Green */
    --tblr-success: #38D39F;
    --tblr-success-rgb: 56, 211, 159;
    --tblr-success-text-emphasis: #165440;
    --tblr-success-bg-subtle: #d7f6ec;
    --tblr-success-border-subtle: #afedd9;

    /* Info - Scanner Blue */
    --tblr-info: #2E4C7D;
    --tblr-info-rgb: 46, 76, 125;
    --tblr-info-text-emphasis: #121e32;
    --tblr-info-bg-subtle: #d5dce5;
    --tblr-info-border-subtle: #abb9cc;

    /* Warning - Reward Glow */
    --tblr-warning: #FFD24A;
    --tblr-warning-rgb: 255, 210, 74;
    --tblr-warning-text-emphasis: #66541e;
    --tblr-warning-bg-subtle: #fff6db;
    --tblr-warning-border-subtle: #ffedb7;

    /* Danger - keep similar */
    --tblr-danger: #df4759;
    --tblr-danger-rgb: 223, 71, 89;

    /* Dark - Dark Cocoa */
    --tblr-dark: #3B1F14;
    --tblr-dark-rgb: 59, 31, 20;

    /* Grays - Neutral palette */
    --tblr-gray: #5A5A5A;
    --tblr-gray-dark: #3B1F14;
    --tblr-gray-100: #FAFAFA;
    --tblr-gray-200: #EDEDED;
    --tblr-gray-300: #d4d4d4;
    --tblr-gray-400: #a3a3a3;
    --tblr-gray-500: #737373;
    --tblr-gray-600: #5A5A5A;
    --tblr-gray-700: #404040;
    --tblr-gray-800: #262626;
    --tblr-gray-900: #1A1A1A;

    /* Body */
    --tblr-body-color: #3B1F14;
    --tblr-body-color-rgb: 59, 31, 20;
    --tblr-body-bg: #FAFAFA;
    --tblr-body-bg-rgb: 250, 250, 250;

    /* Secondary */
    --tblr-secondary: #5A5A5A;
    --tblr-secondary-rgb: 90, 90, 90;
    --tblr-secondary-bg: #EDEDED;
    --tblr-secondary-bg-rgb: 237, 237, 237;

    /* Light - Cream Card */
    --tblr-light: #FFF3E6;
    --tblr-light-rgb: 255, 243, 230;

    /* Muted */
    --tblr-muted: #5A5A5A;
    --tblr-muted-rgb: 90, 90, 90;

    /* Links */
    --tblr-link-color: #FF6720;
    --tblr-link-color-rgb: 255, 103, 32;
    --tblr-link-hover-color: #E55A10;
    --tblr-link-hover-color-rgb: 229, 90, 16;

    /* Border */
    --tblr-border-color: #EDEDED;
    --tblr-border-color-translucent: rgba(90, 90, 90, 0.16);

    /* Focus ring */
    --tblr-focus-ring-color: rgba(255, 103, 32, 0.25);

    /* Form validation */
    --tblr-form-valid-color: #38D39F;
    --tblr-form-valid-border-color: #38D39F;

    /* Switch */
    --bg-switch-checked-color: var(--tblr-primary);
}

/* Dark mode */
[data-bs-theme=dark], [data-menu-theme=dark] {
    --tblr-primary: #FF6720;
    --tblr-primary-rgb: 255, 103, 32;
    --tblr-tabler: #FF6720;
    --tblr-tabler-rgb: 255, 103, 32;

    --tblr-success: #38D39F;
    --tblr-success-rgb: 56, 211, 159;

    --tblr-info: #4A6FA5;
    --tblr-info-rgb: 74, 111, 165;

    --tblr-warning: #FFD24A;
    --tblr-warning-rgb: 255, 210, 74;

    --tblr-body-bg: #1A1A1A;
    --tblr-body-bg-rgb: 26, 26, 26;

    --tblr-link-color: #FF8C5A;
    --tblr-link-hover-color: #FF6720;
    --tblr-link-color-rgb: 255, 140, 90;
    --tblr-link-hover-color-rgb: 255, 103, 32;

    --tblr-bg-surface: #262626;
    --tblr-bg-main-color: #1A1A1A;
}

/* Custom button styles */
.btn-primary {
    --tblr-btn-bg: #FF6720;
    --tblr-btn-border-color: #FF6720;
    --tblr-btn-hover-bg: #E55A10;
    --tblr-btn-hover-border-color: #E55A10;
    --tblr-btn-active-bg: #c94a20;
    --tblr-btn-active-border-color: #c94a20;
}

.btn-outline-primary {
    --tblr-btn-color: #FF6720;
    --tblr-btn-border-color: #FF6720;
    --tblr-btn-hover-bg: #FF6720;
    --tblr-btn-hover-border-color: #FF6720;
    --tblr-btn-active-bg: #E55A10;
    --tblr-btn-active-border-color: #E55A10;
}

/* Sidebar logo container */
.navbar-brand,
.navbar-brand-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 1rem 0.5rem !important;
    width: 100% !important;
}

.navbar-brand img {
    max-height: 55px !important;
    width: auto !important;
    margin-bottom: 0.5rem !important;
    /*border-radius: 16px;*/
    filter: drop-shadow(0 4px 8px rgba(255, 103, 32, 0.2));
}

.navbar-brand h1 {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: #3B1F14 !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

/* Sidebar active state */
.navbar-vertical .navbar-nav .nav-link.active,
.navbar-vertical .navbar-nav .nav-link:hover {
    color: #FF6720 !important;
    background-color: rgba(255, 103, 32, 0.08) !important;
}

.navbar-vertical .navbar-nav .nav-link.active::before {
    background-color: #FF6720 !important;
}

/* Override all purple/primary hovers */
a:hover,
a:focus {
    color: #E55A10 !important;
}

a {
    color: #FF6720;
}

.nav-link:hover,
.nav-link:focus,
.nav-link.active {
    color: #FF6720 !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(255, 103, 32, 0.1) !important;
    color: #FF6720 !important;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: #FF6720 !important;
    color: #fff !important;
}

/* Form focus states */
.form-control:focus,
.form-select:focus,
input:focus,
textarea:focus,
select:focus {
    border-color: #FF6720 !important;
    box-shadow: 0 0 0 0.25rem rgba(255, 103, 32, 0.25) !important;
}

.form-check-input:checked {
    background-color: #FF6720 !important;
    border-color: #FF6720 !important;
}

.form-check-input:focus {
    border-color: #FF6720 !important;
    box-shadow: 0 0 0 0.25rem rgba(255, 103, 32, 0.25) !important;
}

/* Switch toggle */
.form-switch .form-check-input:checked {
    background-color: #FF6720 !important;
}

/* Buttons override */
.btn-primary,
.btn-primary:focus,
.btn-primary:active {
    background-color: #FF6720 !important;
    border-color: #FF6720 !important;
}

.btn-primary:hover {
    background-color: #E55A10 !important;
    border-color: #E55A10 !important;
}

.btn-outline-primary {
    color: #FF6720 !important;
    border-color: #FF6720 !important;
}

.btn-outline-primary:hover {
    background-color: #FF6720 !important;
    border-color: #FF6720 !important;
    color: #fff !important;
}

/* Links in navbar */
.navbar .nav-link:hover,
.navbar .nav-link.active {
    color: #FF6720 !important;
}

/* Breadcrumb links */
.breadcrumb a:hover {
    color: #E55A10 !important;
}

/* List group */
.list-group-item.active {
    background-color: #FF6720 !important;
    border-color: #FF6720 !important;
}

/* Tabs */
.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
    border-color: transparent transparent #FF6720 !important;
    color: #FF6720 !important;
}

.nav-tabs .nav-link.active {
    border-bottom-color: #FF6720 !important;
    color: #FF6720 !important;
}

/* Selection highlight */
::selection {
    background-color: rgba(255, 103, 32, 0.3);
    color: #3B1F14;
}

/* Backpack specific overrides */
.la-hover-primary:hover {
    color: #FF6720 !important;
}

[class*="bg-primary"] {
    background-color: #FF6720 !important;
}

[class*="text-primary"] {
    color: #FF6720 !important;
}

[class*="border-primary"] {
    border-color: #FF6720 !important;
}

/* Cards with cream background option */
.card-cream {
    background-color: #FFF3E6;
}

/* Badge success for rewards */
.badge-reward {
    background-color: #FFD24A;
    color: #3B1F14;
}

/* Login page specific */
.page-center {
    background: linear-gradient(135deg, #FAFAFA 0%, #FFF3E6 100%);
    min-height: 100vh;
}

.page-center .auth-logo-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.page-center .auth-logo-container img {
    max-height: 280px;
    width: auto;
    filter: drop-shadow(0 16px 32px rgba(255, 103, 32, 0.3));
    transition: transform 0.3s ease, filter 0.3s ease;
}

.page-center .auth-logo-container img:hover {
    transform: scale(1.05) rotate(-2deg);
    filter: drop-shadow(0 16px 32px rgba(255, 103, 32, 0.35));
}

.page-center .auth-logo-container h1 {
    font-size: 2.25rem;
    font-weight: 700;
    color: #3B1F14;
    margin: 0;
    letter-spacing: -0.5px;
    transition: color 0.3s ease, transform 0.3s ease;
}

.page-center .auth-logo-container:hover h1 {
    color: #FF6720;
    transform: scale(1.02);
}

.page-center .card {
    border: none;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(59, 31, 20, 0.1);
    background: #ffffff;
}

.page-center .card-body {
    padding: 2rem;
}

.page-center .form-label {
    color: #3B1F14;
    font-weight: 500;
}

.page-center .btn-primary {
    background: linear-gradient(135deg, #FF6720 0%, #E55A10 100%);
    border: none;
    border-radius: 10px;
    padding: 0.85rem 1.75rem;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(255, 103, 32, 0.3);
}

.page-center .btn-primary:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 8px 25px rgba(255, 103, 32, 0.5);
    background: linear-gradient(135deg, #E55A10 0%, #CC4D0A 100%);
}

.page-center .btn-primary:active {
    transform: translateY(0) scale(0.98);
    box-shadow: 0 2px 10px rgba(255, 103, 32, 0.4);
}

.page-center .text-muted {
    color: #5A5A5A !important;
}

.page-center .text-muted a {
    color: #FF6720;
    font-weight: 500;
}

.page-center .text-muted a:hover {
    color: #E55A10;
}

/* Progress bars */
.progress-bar {
    background-color: #FF6720;
}

/* Form controls focus */
.form-control:focus,
.form-select:focus {
    border-color: #FF6720;
    box-shadow: 0 0 0 0.25rem rgba(255, 103, 32, 0.25);
}

/* Pagination */
.page-item.active .page-link {
    background-color: #FF6720;
    border-color: #FF6720;
}

.page-link {
    color: #FF6720;
}

.page-link:hover {
    color: #E55A10;
}

/* Alerts */
.alert-primary {
    --tblr-alert-bg: #fde8df;
    --tblr-alert-border-color: #fbd1bf;
    --tblr-alert-color: #9a3d14;
}

/* Dropdown active */
.dropdown-item.active,
.dropdown-item:active {
    background-color: #FF6720;
}

/* Table hover */
.table-hover > tbody > tr:hover {
    --tblr-table-hover-bg: rgba(255, 103, 32, 0.05);
}

/* Nav tabs */
.nav-tabs .nav-link.active {
    border-bottom-color: #FF6720;
    color: #FF6720;
}

/* Toasts and notifications */
.toast-primary {
    background-color: #FF6720;
}
