/* =============================================
   TutorConnect UK – Custom Styles
   Built on Bootstrap 5.3
   ============================================= */

:root {
    --tc-primary: #0d6efd;
    --tc-dark:    #0a0f2e;
    --tc-grad:    linear-gradient(135deg, #0d6efd 0%, #6610f2 100%);
    --tc-radius:  14px;
    --tc-shadow:  0 2px 12px rgba(0,0,0,.08);
}

body { font-family: 'Inter', system-ui, sans-serif; }
a { text-decoration: none; }

/* ── NAVBAR ── */
.tc-navbar {
    background: #fff;
    border-bottom: 1px solid #e9ecef;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.tc-brand {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--tc-primary) !important;
}
.tc-nav-avatar {
    width: 32px; height: 32px; border-radius: 50%;
    object-fit: cover; border: 2px solid #e0e7ff;
}

/* ── FOOTER ── */
.tc-footer { background: var(--tc-dark); }
.footer-link { color: rgba(255,255,255,.55); font-size:.875rem; display:block; margin-bottom:.35rem; transition:.15s; }
.footer-link:hover { color:#fff; }
.footer-icon { color: rgba(255,255,255,.5); font-size:1.1rem; transition:.15s; }
.footer-icon:hover { color:#fff; }

/* ── AUTH ── */
.tc-auth-page {
    min-height: calc(100vh - 65px);
    background: linear-gradient(135deg, #f0f4ff, #f9f0ff);
    display: flex; align-items: center; justify-content: center;
    padding: 2rem 1rem;
}
.tc-auth-card {
    background: #fff; border-radius: 20px;
    padding: 2.5rem; width: 100%; max-width: 460px;
}
.tc-auth-brand {
    font-size: 1.3rem; font-weight: 800; color: var(--tc-primary);
    display: block;
}
.tc-demo-box { border: 1px dashed #dee2e6; }

/* Role Cards */
.tc-role-card {
    display: block; cursor: pointer; text-align: center; padding: 1.25rem 1rem;
    border: 2px solid #dee2e6; border-radius: var(--tc-radius);
    transition: all .2s ease;
}
.tc-role-card:hover { border-color: var(--tc-primary); }
.tc-role-card.selected { border-color: var(--tc-primary); background: #eff6ff; }

/* ── HERO ── */
.tc-hero { background: linear-gradient(135deg, #f0f4ff 0%, #fdf0ff 100%); }
.tc-gradient-text {
    background: var(--tc-grad);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    background-clip: text;
}
.tc-badge-pill {
    background: #eff6ff; color: var(--tc-primary);
    font-size: .82rem; font-weight: 700; padding: .45rem 1rem; border-radius: 50px;
}
.tc-stat-divider { width: 1px; height: 36px; background: #dee2e6; }
.tc-hero-visual { position: relative; }
.tc-hero-card {
    background: #fff; border-radius: 20px; padding: 1.5rem;
    position: relative; z-index: 2;
}
.tc-hero-map-badge {
    background: #fff; border-radius: 12px; padding: .6rem 1rem;
    position: absolute; bottom: -18px; left: 20px; z-index: 3;
    display: flex; align-items: center; white-space: nowrap;
}
.tc-avatar-mock { width: 48px; height: 48px; border-radius: 50%; }
.tc-mock-line { height: 10px; background: #e9ecef; border-radius: 6px; }
.tc-mock-sm  { height: 8px; }

/* ── STEPS ── */
.tc-step-card {
    background: #fff; border-radius: var(--tc-radius);
    box-shadow: var(--tc-shadow); border: 1px solid #e9ecef;
    transition: .25s;
}
.tc-step-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.tc-step-num {
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--tc-grad); color: #fff;
    font-weight: 800; font-size: 1rem;
    display: flex; align-items: center; justify-content: center;
}

/* ── CATEGORY CARDS ── */
.tc-category-card {
    background: #fff; border: 1px solid #e9ecef;
    border-radius: var(--tc-radius); padding: 1.25rem;
    transition: all .2s ease; display: block;
}
.tc-category-card:hover {
    border-color: var(--tc-primary);
    box-shadow: 0 4px 16px rgba(13,110,253,.12);
    transform: translateY(-3px);
    color: var(--tc-primary) !important;
}

/* ── TUTOR CARDS ── */
.tc-tutor-card {
    background: #fff; border: 1px solid #e9ecef;
    border-radius: var(--tc-radius); box-shadow: var(--tc-shadow);
    transition: .25s;
}
.tc-tutor-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.tc-tutor-avatar {
    width: 56px; height: 56px; border-radius: 50%;
    object-fit: cover; border: 2px solid #e0e7ff;
}
.tc-subject-badge {
    background: #eff6ff; color: #1d4ed8;
    font-weight: 600; font-size: .72rem; padding: .25rem .6rem;
}

/* ── WHY / CTA ── */
.tc-why-item {
    display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 1.25rem;
}
.tc-why-icon {
    width: 44px; height: 44px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.tc-cta-box {
    background: linear-gradient(135deg, #f0f4ff, #f9f0ff);
    border-radius: 20px; border: 2px solid #e0e7ff;
}

/* ── DASHBOARD ── */
.tc-dash-header {
    background: var(--tc-grad);
}
.text-white-75 { color: rgba(255,255,255,.75) !important; }
.tc-dash-avatar {
    width: 90px; height: 90px; border-radius: 50%;
    object-fit: cover; border: 3px solid rgba(255,255,255,.35);
}

/* ── SEARCH PAGE ── */
.tc-search-header { background: var(--tc-grad); }
.tc-search-header .form-select,
.tc-search-header .form-control {
    background: rgba(255,255,255,.12);
    border-color: rgba(255,255,255,.25);
    color: #fff;
}
.tc-search-header .form-select:focus,
.tc-search-header .form-control:focus {
    background: rgba(255,255,255,.2);
    border-color: rgba(255,255,255,.5);
    box-shadow: none; color: #fff;
}
.tc-search-header .form-select option { color: #000; background: #fff; }
.tc-search-header select option { color: #000; }
.text-white-75 { color: rgba(255,255,255,.75) !important; }

/* ── MAP ── */
.tc-map-wrap { border: 1px solid #dee2e6; }
.tc-map-info-window { font-family: 'Inter', sans-serif; max-width: 220px; }
.tc-map-info-window h6 { font-weight: 700; margin-bottom: 4px; font-size: .92rem; }
.tc-map-info-window p  { margin-bottom: 4px; font-size: .8rem; color: #666; }
.tc-map-info-window a  { color: #0d6efd; font-size: .82rem; font-weight: 600; }

/* ── PROFILE HERO ── */
.tc-profile-hero { background: linear-gradient(135deg, #0a0f2e, #0d6efd); }
.tc-profile-big-avatar {
    width: 130px; height: 130px; border-radius: 50%;
    object-fit: cover; border: 4px solid rgba(255,255,255,.35);
}
.tc-sticky-sidebar { position: sticky; top: 80px; }

/* ── STAR RATING (review form) ── */
.tc-star-rating { display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 4px; }
.tc-star-label { cursor: pointer; color: #dee2e6; transition: color .15s; line-height: 1; }
.tc-star-rating input:checked ~ label,
.tc-star-rating label:hover,
.tc-star-rating label:hover ~ label { color: #ffc107; }

/* ── SUBJECT ROW (profile edit) ── */
.tc-subject-row { transition: all .2s; }
.cursor-pointer { cursor: pointer; }

/* ── PRICE BOX ── */
.tc-price-box { background: #eff6ff; }

/* ── BOOKING CARDS ── */
.tc-booking-card { background: #fafafa; transition: .15s; }
.tc-booking-card:hover { background: #f0f4ff; }

/* ── MISC ── */
.min-w-0 { min-width: 0; }
.col-lg-2-4 { flex: 0 0 auto; width: 20%; }