/* =============================================================================
   cloudeConnect - brand overrides
   -----------------------------------------------------------------------------
   Loaded AFTER the theme's style.css. That 394 KB file is never edited: keeping
   every change here means the theme can be updated by replacing one file, and
   what we changed is always visible in one place.

   The palette is taken from the supplied logo:
     #1565E8  wordmark "Connect" blue      -> primary
     #38B6F1  cloud cyan highlight         -> primary light
     #F7931E  cloud orange                 -> secondary
     #F26522  deep orange accent           -> secondary dark
   ============================================================================= */

:root,
[data-bs-theme="light"] {
    --primary: #1565E8;
    --primary-rgb: 21, 101, 232;
    --bs-primary: #1565E8;
    --bs-primary-rgb: 21, 101, 232;

    --secondary: #F7931E;
    --secondary-rgb: 247, 147, 30;
    --bs-secondary: #F7931E;
    --bs-secondary-rgb: 247, 147, 30;

    --cc-primary: #1565E8;
    --cc-primary-light: #38B6F1;
    --cc-secondary: #F7931E;
    --cc-secondary-dark: #F26522;
    --cc-gradient: linear-gradient(90deg, #1565E8 0%, #F7931E 100%);
}

[data-bs-theme="dark"] {
    --primary: #2F7BF0;
    --bs-primary: #2F7BF0;
    --cc-primary: #2F7BF0;
}

/* --- Buttons --------------------------------------------------------------- */

.btn-primary {
    background-color: var(--cc-primary);
    border-color: var(--cc-primary);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #0F52C4;
    border-color: #0F52C4;
}

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

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

/* The theme already has this class; this just repoints it at our gradient. */
.btn-liner-gradient {
    background: var(--cc-gradient);
    border: 0;
    color: #fff;
}

.btn-liner-gradient:hover {
    filter: brightness(1.06);
    color: #fff;
}

/* --- Text and links -------------------------------------------------------- */

a { color: var(--cc-primary); }
a:hover { color: #0F52C4; }

.text-primary { color: var(--cc-primary) !important; }
.bg-primary { background-color: var(--cc-primary) !important; }
.border-primary { border-color: var(--cc-primary) !important; }

.badge-soft-primary {
    background-color: rgba(21, 101, 232, 0.12);
    color: var(--cc-primary);
}

.badge-soft-secondary {
    background-color: rgba(247, 147, 30, 0.14);
    color: var(--cc-secondary-dark);
}

/* --- Brand marks ----------------------------------------------------------- */

.logo-lg img { height: 34px; width: auto; }
.logo-sm img { height: 30px; width: auto; }
.sidebar-logo .logo-lg img { height: 32px; width: auto; }

.cc-auth-logo { max-width: 260px; height: auto; }

/* --- Auth pages ------------------------------------------------------------ */

.auth-bg-custom {
    background:
        radial-gradient(1200px 600px at 12% -10%, rgba(21, 101, 232, 0.14), transparent 60%),
        radial-gradient(900px 500px at 105% 110%, rgba(247, 147, 30, 0.16), transparent 60%);
}

/* --- Public booking page ---------------------------------------------------
   The invitee-facing page is the only screen an outsider ever sees, so it gets
   a little more care than an internal admin list.
   -------------------------------------------------------------------------- */

.cc-public-shell { min-height: 100vh; background: #F5F7FB; }
[data-bs-theme="dark"] .cc-public-shell { background: #0E1116; }

.cc-booking-card {
    border: 1px solid var(--bs-border-color, #E3E8F0);
    border-radius: 14px;
    overflow: hidden;
    background: var(--bs-body-bg, #fff);
}

.cc-booking-accent { height: 5px; background: var(--cc-gradient); }

.cc-meeting-option {
    display: block;
    border: 1px solid var(--bs-border-color, #E3E8F0);
    border-radius: 10px;
    padding: 1rem 1.15rem;
    margin-bottom: 0.75rem;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.cc-meeting-option:hover {
    border-color: var(--cc-primary);
    box-shadow: 0 6px 18px rgba(21, 101, 232, 0.10);
    transform: translateY(-1px);
    color: inherit;
}

/* Slot buttons. A fixed minimum width keeps the grid even whether the label
   reads "9:00 AM" or "11:30 AM". */
.cc-slot {
    min-width: 108px;
    font-variant-numeric: tabular-nums;
}

.cc-slot-day-header {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bs-body-bg, #fff);
    padding: .35rem 0;
}

.cc-slot-scroll { max-height: 460px; overflow-y: auto; }

/* --- Dashboard tiles -------------------------------------------------------- */

.cc-stat-tile { border-radius: 12px; }
.cc-stat-tile .cc-stat-value { font-size: 1.65rem; font-weight: 700; line-height: 1.1; }
.cc-stat-icon {
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 10px; font-size: 1.15rem;
}

/* --- Empty states ----------------------------------------------------------
   Shown far more often than anybody expects on a fresh tenant, so they are
   styled rather than left as bare text.
   -------------------------------------------------------------------------- */

.cc-empty { text-align: center; padding: 3rem 1.5rem; }
.cc-empty i { font-size: 2.6rem; color: var(--cc-primary); opacity: .55; }
.cc-empty h5 { margin-top: 1rem; }
.cc-empty p { color: var(--bs-secondary-color, #6B7280); max-width: 26rem; margin: .35rem auto 1.25rem; }