/**
 * Bootstrap Custom Theme - Zocdoc Style
 * Overrides Bootstrap CSS variables with Zocdoc's design system
 */

/* Import Bootstrap */
@import url('/vendor/bootstrap/css/bootstrap.min.css');

/* Zocdoc Color Palette Override */
:root {
    /* Primary - Zocdoc Yellow */
    --bs-primary: #FEF04B;
    --bs-primary-rgb: 254, 240, 75;
    --bs-primary-bg-subtle: #FFF9EA;
    --bs-primary-border-subtle: #FCD22B;

    /* Body Colors */
    --bs-body-bg: #FFFFFF;
    --bs-body-color: #2D2D32;
    --bs-body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

    /* Border Radius - Zocdoc uses rounded corners */
    --bs-border-radius: 12px;
    --bs-border-radius-sm: 8px;
    --bs-border-radius-lg: 16px;
    --bs-border-radius-xl: 24px;
    --bs-border-radius-pill: 50rem;

    /* Spacing */
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;

    /* Secondary Colors */
    --bs-secondary: #6c757d;
    --bs-secondary-rgb: 108, 117, 125;

    /* Links */
    --bs-link-color: #2D2D32;
    --bs-link-hover-color: #000000;

    /* Shadows */
    --bs-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    --bs-box-shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.06);
    --bs-box-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

    /* Typography */
    --bs-font-size-base: 1rem;
    --bs-line-height-base: 1.6;
    --bs-h1-font-size: 2.5rem;
    --bs-h2-font-size: 2rem;
    --bs-h3-font-size: 1.5rem;
    --bs-h4-font-size: 1.25rem;
    --bs-h5-font-size: 1.125rem;
    --bs-h6-font-size: 1rem;
}

/* Button Customization */
.btn-primary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #2D2D32;
    font-weight: 600;
    transition: all 0.2s ease;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #FCD22B;
    border-color: #FCD22B;
    color: #2D2D32;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(254, 240, 75, 0.3);
}

.btn-primary:active {
    background-color: #F5C61E;
    border-color: #F5C61E;
    transform: translateY(0);
}

.btn-outline-primary {
    border-color: #2D2D32;
    color: #2D2D32;
    background-color: transparent;
    font-weight: 600;
}

.btn-outline-primary:hover {
    background-color: #2D2D32;
    border-color: #2D2D32;
    color: #FFFFFF;
}

/* Card Customization */
.card {
    border: 1px solid #E5E7EB;
    border-radius: var(--bs-border-radius);
    box-shadow: var(--bs-box-shadow-sm);
    transition: all 0.3s ease;
}

.card:hover {
    box-shadow: var(--bs-box-shadow);
    transform: translateY(-2px);
}

/* Form Controls */
.form-control {
    border-radius: var(--bs-border-radius-sm);
    border: 1px solid #D1D5DB;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    transition: all 0.2s ease;
}

.form-control:focus {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 3px rgba(254, 240, 75, 0.2);
}

/* Navbar Customization */
.navbar {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    padding: 1rem 0;
}

.navbar-brand {
    font-weight: 700;
    font-size: 1.5rem;
    color: #2D2D32;
}

/* Badge Customization */
.badge {
    border-radius: var(--bs-border-radius-pill);
    padding: 0.5rem 1rem;
    font-weight: 500;
    font-size: 0.875rem;
}

/* Container Max Width for Zocdoc-style layouts */
@media (min-width: 1200px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1140px;
    }
}

/* Utility Classes */
.bg-cream {
    background-color: #FFF9EA;
}

.bg-yellow {
    background-color: var(--bs-primary);
}

.text-dark-gray {
    color: #2D2D32;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}