/* PetHub brand layer on top of the AppStack theme (Static/AppStack). Colours come from pethubui/src/assets/core/variables.scss */
:root {
  --pet-primary: #e65f5c;
  --pet-primary-dark: #f06f66;
  --pet-primary-light: #fcdfdd;
  --pet-primary-lighter: #fef7f7;
  --pet-secondary: #9048fc;
  --pet-success: #00966d;
  --pet-danger: #ff383c;
  --pet-warning: #ff9f00;
  --pet-blue: #1a71ff;
  --pet-gray: #8c8c8c;

  --bs-primary: #e65f5c;
  --bs-primary-rgb: 230, 95, 92;
  --bs-link-color: #e65f5c;
  --bs-link-hover-color: #cf4c49;
}

body {
    font-family: "DM Sans", "Noto Sans", "Fredoka One", Roboto, Helvetica, Arial, sans-serif !important;
    color: rgba(0, 0, 0, 0.87) !important;
    font-size: 1rem;
    line-height: 1.5;
}

/* ---------- brand colour overrides ---------- */
.btn-primary {
  --bs-btn-bg: #e65f5c; --bs-btn-border-color: #e65f5c;
  --bs-btn-hover-bg: #cf4c49; --bs-btn-hover-border-color: #c24643;
  --bs-btn-active-bg: #c24643; --bs-btn-active-border-color: #b84240;
  --bs-btn-disabled-bg: #e65f5c; --bs-btn-disabled-border-color: #e65f5c;
  --bs-btn-focus-shadow-rgb: 232, 120, 117;
}
.btn-outline-primary {
  --bs-btn-color: #e65f5c; --bs-btn-border-color: #e65f5c;
  --bs-btn-hover-bg: #e65f5c; --bs-btn-hover-border-color: #e65f5c;
  --bs-btn-active-bg: #e65f5c; --bs-btn-active-border-color: #e65f5c;
}
.text-primary { color: #e65f5c !important; }
.bg-primary { background-color: #e65f5c !important; }
.form-check-input:checked { background-color: #e65f5c; border-color: #e65f5c; }
.form-control:focus, .form-select:focus { border-color: #f0a19f; box-shadow: 0 0 0 .2rem rgba(230, 95, 92, .15); }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: #e65f5c;
    border-color: white;
    border-bottom:solid 2px #e65f5c !important;
}
.nav-tabs .nav-link:hover { border:none}
.sidebar-item.active > .sidebar-link,
.sidebar-item.active .sidebar-link:hover,
.sidebar-link:hover { border-left-color: #e65f5c; }
.sidebar-item.active > .sidebar-link i,
.sidebar-item.active > .sidebar-link svg { color: #e65f5c; }
.sidebar-dropdown .sidebar-item.active .sidebar-link { color: #e65f5c; }
.text-primary-pet {
    color: #ff8884 !important;
}
body[data-theme=light] .sidebar-item.active, body[data-theme=light] .sidebar-link:hover, body[data-theme=light] .sidebar-link svg:hover {
    color: #e65f5c;
}
    body[data-theme=light] .sidebar-item.active > .sidebar-link, body[data-theme=light] .sidebar-dropdown .sidebar-item .sidebar-link:hover, body[data-theme=light] .sidebar-item:hover svg{
        color: #e65f5c;
    }

    .badge-soft-primary {
        background: #fcdfdd;
        color: #e65f5c;
    }
body[data-theme=light] .sidebar-item.active .sidebar-link:hover i, body[data-theme=light] .sidebar-item.active .sidebar-link:hover svg, body[data-theme=light] .sidebar-item.active > .sidebar-link i, body[data-theme=light] .sidebar-item.active > .sidebar-link svg {
    color: #e65f5c;
}

body[data-theme=dark] .sidebar-dropdown .sidebar-item.active .sidebar-link, body[data-theme=light] .sidebar-dropdown .sidebar-item.active .sidebar-link {
    color: #568fed;
}
/* ---------- auth pages ---------- */
.auth-banner {
    background: linear-gradient(160deg, #e65f5c 0%, #f06f66 100%);
    padding: 3rem;
}
.auth-banner-inner { max-width: 460px; text-align: left; }
.auth-banner ul { list-style: none; padding: 0; margin: 1.5rem 0 0; }
.auth-banner li, .auth-banner li b, .auth-banner li span { color: #fff; }
.auth-banner li { color: #fff; margin-bottom: 1rem; padding-left: 2rem; position: relative; }
.auth-banner li::before { content: ""; position: absolute; left: 0; top: .15rem; width: 1.2rem; height: 1.2rem; background: url("/img/pethub/svg/checkBulletPoint.svg") no-repeat center / contain; filter: brightness(0) invert(1); }
.auth-form-wrap { max-width: 460px; }
.auth-form-wrap .logo { display: block; margin: 0 auto 1.5rem; max-width: 220px; }
.input-icon { position: relative; }
.input-icon > img.icon-start { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 20px; pointer-events: none; opacity: .7; }
.input-icon > .form-control, .input-icon > .form-select { padding-left: 2.6rem; }
.input-icon .toggle-visibility { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); cursor: pointer; width: 20px; opacity: .7; }
.select-card {
  border: 2px solid #ecedf2; border-radius: .75rem; padding: 1.5rem; text-align: center; cursor: pointer; transition: all .2s; background: #fff; display: block; color: inherit; text-decoration: none;
}
.select-card:hover { border-color: #e65f5c; background: #fef7f7; color: inherit; }
.select-card img { width: 64px; height: 64px; }
.wizard-progress { height: 6px; }
.wizard-progress .progress-bar { background-color: #e65f5c; }

/* ---------- span selection (pill toggles) ---------- */
.pill-group { display: flex; flex-wrap: wrap; gap: .5rem; }
.pill-group .pill {
  border: 1px solid #ced4da; border-radius: 2rem; padding: .3rem .9rem; cursor: pointer; user-select: none; background: #fff; font-size: .875rem;
}
.pill-group .pill.selected { background: #e65f5c; color: #fff; border-color: #e65f5c; }

/* ---------- working schedule (Team > Working days) ---------- */
.schedule-day { display: flex; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid #eef0f4; }
.schedule-day:last-child { border-bottom: 0; }
.schedule-day-head { flex: 0 0 9.5rem; padding-top: .25rem; font-weight: 500; }
.schedule-day-body { flex: 1 1 auto; min-width: 0; }
.schedule-day.is-closed .schedule-day-head label { color: #8a93a6; font-weight: 400; }
.schedule-day .js-closed { padding-top: .3rem; }
.schedule-period { margin-bottom: .5rem; }
.schedule-period .js-remove-period { line-height: 1; font-size: 1.1rem; }
.schedule-day .form-check-input:checked { background-color: #e65f5c; border-color: #e65f5c; }
@media (max-width: 767.98px) {
  .schedule-day { flex-direction: column; gap: .5rem; }
  .schedule-day-head { flex-basis: auto; }
}

/* ---------- status badges ---------- */
.badge-status-0 { background: #9048fc; }
.badge-status-1 { background: #ff9f00; }
.badge-status-2 { background: #1a71ff; }
.badge-status-3 { background: #00966d; }
.badge-status-4 { background: #ff383c; }

/* ---------- dashboard ---------- */
.stat-card.secondary .stat { background: #e7e7fa; }
.stat-card.success .stat { background: #e9fcf8; }
.dashboard-calendar .fc { font-size: .8rem; }
.pet-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin: 0 1px; }
.pet-dot-wrapper { display: flex; justify-content: center; flex-wrap: wrap; }
.chart-sm { height: 260px; }
.review-avatars img { width: 36px; height: 36px; border: 2px solid #fff; margin-left: -10px; }
.review-avatars img:first-child { margin-left: 0; }

/* ---------- calendar page ---------- */
.fc .fc-daygrid-day.pet-selected-day { background: #fcdfdd; }
.fc .fc-event { cursor: pointer; }
.pet-week-event { padding: 2px 4px; border-radius: 4px; font-size: .75rem; white-space: normal; }
.pet-week-event__time { font-weight: 700; margin-right: 4px; }
.pet-day-event { border-radius: 10px; padding: 6px 8px; }
.upcoming-item { border-radius: .6rem; padding: .6rem .8rem; margin-bottom: .6rem; border-left: 4px solid #9048fc; background: #f5f7fa; }

/* ---------- appointments list (kanban columns) ---------- */
.appointments-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; align-items: start; }
.column-top-card { border-top: 4px solid #9048fc; }
.column-top-card.status-1 { border-top-color: #ff9f00; }
.column-top-card.status-2 { border-top-color: #1a71ff; }
.column-top-card.status-3 { border-top-color: #00966d; }
.column-top-card.status-4 { border-top-color: #ff383c; }
.appointment-card { display: flex; gap: .75rem; align-items: center; }
.appointment-card img { width: 36px; height: 36px; }

/* ---------- client profile ---------- */
.pet-avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 3px solid transparent; background: #ecedf2; }
.pet-pick { cursor: pointer; text-align: center; }
.pet-pick.active .pet-avatar { border-color: #e65f5c; }
.pet-pick.active span { color: #e65f5c; font-weight: 700; }

/* ---------- profile pages ---------- */
.avatar-upload { position: relative; width: 120px; height: 120px; margin: 0 auto 1rem; }
.avatar-upload img { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; background: #ecedf2; }
.avatar-upload label { position: absolute; right: 0; bottom: 0; background: #fff; border-radius: 50%; padding: 6px; box-shadow: 0 1px 4px rgba(0, 0, 0, .3); cursor: pointer; line-height: 0; }
.address-results { position: absolute; z-index: 1050; background: #fff; border: 1px solid #dee2e6; border-radius: .25rem; width: 100%; max-height: 240px; overflow-y: auto; box-shadow: 0 4px 10px rgba(0, 0, 0, .1); }
.address-results .list-group-item { cursor: pointer; font-size: .875rem; }

/* ---------- terms ---------- */
.terms-page { max-width: 900px; margin: 0 auto; padding: 2rem 1rem; }

/* ---------- error pages ---------- */
.error-page { background: #e65f5c; color: #fff; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 2rem; }
.error-page h1 { font-size: 7rem; font-weight: 800; color: #fff; }

/* ---------- auth pages: match the production login ---------- */
.auth-form-side { background: #fafafa; }
.auth-form-side .auth-form-wrap { max-width: 375px; }
.auth-form-side .logo.logo-lg { max-width: 300px; margin-bottom: 2rem; }
.auth-form-side .form-control {
  background: #fff; border: 1px solid #b9bcc2; border-radius: 10px; height: 50px; font-size: .9rem;
}
    .auth-form-side .form-select {
        background: #fff;
        border: 1px solid #b9bcc2;
        border-radius: 10px;
        height: 50px;
        font-size: .9rem;
    }
.auth-form-side .form-control:focus { border-color: #e65f5c; box-shadow: 0 0 0 .15rem rgba(230,95,92,.18); }
.auth-form-side .btn-primary { border-radius: 12px; height: 48px; font-weight: 600; }
.auth-form-side .btn-primary:disabled { background: #dcdcdc; border-color: #dcdcdc; color: #9a9a9a; opacity: 1; }
.auth-form-side a { color: #e65f5c; text-decoration: none; }
.auth-divider { display: flex; align-items: center; gap: 1rem; margin-top: 1.25rem; color: #181b1f; font-size: .85rem; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; border-top: 1px solid #d5d7da; }
.auth-banner { background: #e65f5c; position: relative; }
.auth-promo { position: relative; width: 100%; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: #fff; padding: 0 2rem; }
.auth-promo-title { font-family: "Fredoka", sans-serif; font-weight: 700; font-size: clamp(2rem, 3.2vw, 3.75rem); color: #fff; margin-bottom: 1rem; }
.auth-promo-sub { font-family: "DM Sans", sans-serif; font-size: clamp(1.1rem, 1.8vw, 2.2rem); color: #fff; margin: 0; }
.auth-promo-badge { position: absolute; top: 28px; right: 28px; width: 180px; transform: rotate(-15deg); }
.auth-promo-apps { position: absolute; bottom: 64px; left: 0; right: 0; }
.auth-promo-apps-title { font-family: "Fredoka", sans-serif; font-weight: 700; font-size: clamp(1.3rem, 1.8vw, 2.2rem); }
.auth-promo-apps img { height: 46px; }
.auth-promo .lang-btn { background: transparent; border: 1px solid rgba(255,255,255,.7); }
.auth-promo .lang-btn::after { display: none; }
.auth-banner { padding: 0; }
.auth-form-side .text-end .small { font-size: .85rem; }
.lang-btn img { height: 18px; }
#dashboardCalendar .fc-event, .pet-dot-wrapper { cursor: pointer; }