:root {
    --brand: #c21131;
    --brand-dark: #a7102b;
    --ink: #333;
    --muted: #737373;
    --line: #e5e5e5;
}

html { min-height: 100%; }
body {
    min-height: 100%;
    font-family: "Oxygen", Arial, sans-serif;
    font-size: 14px;
    color: var(--ink);
    background: #fff url('../images/data/background.jpg') repeat;
}
a { color: var(--brand); }
a:hover, a:focus { color: var(--brand-dark); }

#main-header,
#main-header .navbar-collapse { background: var(--brand); }
#main-header .logo { padding: 10px 0; }
#main-header .logo img { max-height: 80px; width: auto; }
#main-header .navbar-nav > li > a {
    padding-top: 40px;
    padding-bottom: 40px;
    color: #fff;
    font-size: 16px;
}
#main-header .navbar-nav > li > a:hover,
#main-header .navbar-nav > li > a:focus,
#main-header .navbar-nav > li.active > a { background: var(--brand-dark); color: #fff; }
.btn-navbar { margin-top: 28px; color: #fff; background: transparent; border: 1px solid rgba(255,255,255,.65); }

#page-wrapper { min-height: 520px; }
.page-hero {
    padding: 34px 0 26px;
    margin-bottom: 26px;
    color: #fff;
    background: linear-gradient(135deg, #8f0d26, var(--brand));
}
.page-hero h1 { margin: 0 0 8px; font-size: 32px; font-weight: 700; }
.page-hero p { max-width: 680px; margin: 0; font-size: 16px; opacity: .92; }
.content-wrap,
.site-card {
    padding: 24px;
    margin-bottom: 24px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 4px;
    box-shadow: 0 2px 7px rgba(0,0,0,.04);
}
.site-card h2, .site-card h3, .content-wrap h2, .content-wrap h3 { margin-top: 0; }
.section-title { margin: 4px 0 22px; font-weight: 700; }
.icon-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 14px;
    border-radius: 50%;
    color: #fff;
    background: var(--brand);
    font-size: 22px;
}
.btn-primary, .btn-success { background: var(--brand); border-color: var(--brand-dark); }
.btn-primary:hover, .btn-primary:focus, .btn-success:hover, .btn-success:focus { background: var(--brand-dark); border-color: #850b20; }
.form-control:focus { border-color: var(--brand); box-shadow: 0 0 0 2px rgba(194,17,49,.12); }
.required::after { content: " *"; color: var(--brand); }
.form-status { display: none; margin-top: 18px; }
.form-status.is-visible { display: block; }
.muted { color: var(--muted); }
.summary-row { display: flex; justify-content: space-between; gap: 15px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.summary-row:last-child { border-bottom: 0; }
.summary-total { font-size: 18px; font-weight: 700; }
.cart-item { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); }
.cart-item:last-child { border-bottom: 0; }
.cart-item .quantity { width: 70px; }
.empty-state { padding: 38px 15px; text-align: center; }
.empty-state .fa { display: block; margin-bottom: 14px; color: #bbb; font-size: 48px; }
.location-card { border-left: 4px solid var(--brand); }
.opening-hours { width: 100%; }
.opening-hours td { padding: 7px 0; border-bottom: 1px solid var(--line); }
.opening-hours td:last-child { text-align: right; font-weight: 700; }
.policy-nav { position: sticky; top: 15px; }
.policy-nav a { display: block; padding: 8px 0; border-bottom: 1px solid var(--line); }
.checkout-steps { display: flex; gap: 8px; margin-bottom: 22px; }
.checkout-step { flex: 1; padding: 10px; text-align: center; color: var(--muted); background: #f5f5f5; border-radius: 3px; }
.checkout-step.active { color: #fff; background: var(--brand); }

#page-footer { margin-top: 36px; color: #fff; background: #343a3c; }
#page-footer .main-footer { padding: 30px 0 22px; }
#page-footer .footer-title { margin-top: 0; color: #fff; }
#page-footer ul { padding: 0; list-style: none; }
#page-footer li { margin-bottom: 7px; }
#page-footer a { color: #fff; }
#page-footer .bottom-footer { padding: 15px 0; background: #121618; }
.footer-logo { max-height: 72px; max-width: 100%; }
.social-icons { display: flex; gap: 8px; }
.social-icons a { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.12); }

@media (max-width: 767px) {
    #main-header .logo img { height: 62px; }
    #main-header .navbar-nav > li > a { padding: 12px 15px; }
    .page-hero { padding: 26px 0 22px; }
    .page-hero h1 { font-size: 27px; }
    .content-wrap, .site-card { padding: 18px; }
    .cart-item { grid-template-columns: 1fr auto; }
    .cart-item .quantity { grid-column: 1; }
    .policy-nav { position: static; }
    #page-footer .footer-column { margin-bottom: 22px; }
}