:root {
    --hf-paper: #d8c49f;
    --hf-paper-light: #eadbbd;
    --hf-muted: #a59283;
    --hf-blood: #7c211f;
    --hf-blood-light: #b32620;
    --hf-night: #171311;
    --hf-panel: #211a17;
    --hf-line: rgba(216, 196, 159, .2);
}

html { min-height: 100%; }
body {
    min-height: 100vh;
    color: var(--hf-paper-light);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: var(--hf-night) url('../images/haverfield-background.webp') center/cover fixed no-repeat;
}

body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    background: rgba(16, 12, 10, .88);
    pointer-events: none;
}

h1, h2, h3, h4, .navbar-brand { font-family: Georgia, serif; font-weight: 400; }
a { color: #d89482; }
a:hover, a:focus { color: var(--hf-paper-light); }

.navbar-inverse {
    min-height: 64px;
    background: rgba(19, 15, 13, .97);
    border: 0;
    border-bottom: 1px solid var(--hf-line);
    box-shadow: 0 8px 30px rgba(0,0,0,.25);
}

.navbar-inverse .navbar-brand {
    height: 64px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--hf-paper-light);
    font-size: 20px;
}

.navbar-brand img { width: 32px; height: 32px; object-fit: contain; }
.navbar-inverse .navbar-nav > li > a { padding-top: 22px; padding-bottom: 22px; color: var(--hf-muted); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus { color: var(--hf-paper-light); background: rgba(255,255,255,.025); }
.navbar-inverse .navbar-toggle { margin-top: 14px; border-color: var(--hf-line); border-radius: 0; }
.dropdown-menu { background: #1d1714; border: 1px solid var(--hf-line); border-radius: 0; box-shadow: 0 18px 35px rgba(0,0,0,.35); }
.dropdown-menu > li > a { color: var(--hf-muted); }
.dropdown-menu > li > a:hover { color: white; background: var(--hf-blood); }

.ticket-app > .container { margin-top: 96px !important; padding-bottom: 70px; }
.ticket-app h3 { margin: 0 0 26px; color: var(--hf-paper-light); font-size: 36px; }
.panel, .card, .modal-content {
    overflow: hidden !important;
    color: var(--hf-paper-light);
    background: rgba(31, 24, 21, .95);
    border: 1px solid var(--hf-line);
    border-radius: 0;
    box-shadow: 0 18px 50px rgba(0,0,0,.25);
}

.panel-heading, .modal-header, .modal-footer { color: var(--hf-paper-light); background: rgba(255,255,255,.025); border-color: var(--hf-line); }
.card { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; background-clip: border-box; }
.card-body { flex: 1 1 auto; padding: 24px; }
.form-control { height: 46px; color: var(--hf-paper-light); background: rgba(255,255,255,.04); border: 1px solid var(--hf-line); border-radius: 0; box-shadow: none; }
.form-control:focus { color: white; background: rgba(255,255,255,.06); border-color: #a83d36; box-shadow: 0 0 0 2px rgba(179,38,32,.12); }
.form-control option { color: #211815; }
textarea.form-control { height: auto; }

.btn { border-radius: 0; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.btn-primary, .btn-success, .btn-info { color: white; background: var(--hf-blood); border-color: #a83d36; }
.btn-primary:hover, .btn-success:hover, .btn-info:hover { background: #962a27; border-color: #b34b44; }
.table { color: var(--hf-paper-light); background: rgba(31,24,21,.78); }
.table > thead > tr > th, .table > tbody > tr > td { border-color: var(--hf-line); }
.list-group-item { color: var(--hf-paper-light); background: rgba(31,24,21,.9); border-color: var(--hf-line); }

body.ticket-login { padding-top: 0 !important; display: flex; flex-direction: column; justify-content: center; }
.ticket-login::before { background: linear-gradient(105deg, rgba(17,12,10,.62), rgba(17,12,10,.78)); }
.ticket-login__brand { position: fixed; top: 32px; left: 38px; z-index: 2; display: flex; align-items: center; gap: 12px; color: var(--hf-paper-light); text-decoration: none; font-family: Georgia, serif; font-size: 18px; letter-spacing: .08em; text-transform: uppercase; }
.ticket-login__brand img { object-fit: contain; }
.ticket-login__brand small { margin-left: 6px; font-family: Inter, sans-serif; font-size: 8px; letter-spacing: .28em; }
.ticket-login__container { width: 100%; margin-top: 0 !important; padding-top: 100px; padding-bottom: 70px; }
.ticket-login__container .col-md-6 { float: none; width: min(510px, 100%); margin: 0 auto; }
.ticket-login__eyebrow { margin: 0 0 16px; color: #c66a60; font-size: 11px; font-weight: 800; letter-spacing: .28em; text-transform: uppercase; }
.ticket-login h1 { margin: 0 0 12px !important; color: var(--hf-paper-light); text-align: left !important; font-size: clamp(44px, 6vw, 68px); line-height: 1; }
.ticket-login__intro { max-width: 480px; margin: 0 0 34px; color: var(--hf-muted); font-size: 15px; line-height: 1.65; }
.ticket-login .panel-login { border: 1px solid var(--hf-line) !important; border-top: 4px solid var(--hf-blood-light) !important; border-radius: 0; box-shadow: 0 28px 65px rgba(0,0,0,.36) !important; }
.ticket-login .panel-login > .panel-heading { padding: 22px 22px 0; color: var(--hf-paper-light) !important; background: rgba(31,24,21,.98) !important; border: 0 !important; }
.ticket-login .panel-login > .panel-heading a { color: var(--hf-muted) !important; font-size: 11px !important; letter-spacing: .16em; text-transform: uppercase; }
.ticket-login .panel-login > .panel-heading a.active { color: var(--hf-paper-light) !important; }
.ticket-login .panel-login > .panel-heading hr { height: 1px !important; margin-top: 18px; background: var(--hf-line) !important; }
.ticket-login .panel-body { padding: 28px; }
.ticket-login .panel-login input[type="text"],
.ticket-login .panel-login input[type="password"] { height: 52px !important; color: var(--hf-paper-light); background: rgba(255,255,255,.04); border: 1px solid var(--hf-line) !important; border-radius: 0; }
.ticket-login .panel-login input::placeholder { color: #806f64; }
.ticket-login .btn-login, .ticket-login .btn-register { height: 50px; padding: 0 !important; color: white !important; background: var(--hf-blood) !important; border: 1px solid #a83d36 !important; border-radius: 0; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.ticket-login .btn-login:hover, .ticket-login .btn-register:hover { background: #962a27 !important; }
.ticket-login label { color: var(--hf-muted); font-weight: 400; }
.ticket-login .modal-content { margin-top: 18vh; }
.ticket-login .close { color: white; opacity: .75; }

.sweet-alert { border-radius: 0 !important; }
.sweet-alert p { font-size: 14px !important; }
.sweet-alert .sa-input-error { top: 23px !important; right: 13px !important; }
.sweet-alert h2 { margin: 0 0 5px !important; font-size: 18px !important; }
.sweet-alert button { padding: 5px 20px !important; border-radius: 0 !important; font-size: 15px !important; }

@media (max-width: 767px) {
    .ticket-login__brand { position: absolute; top: 22px; left: 22px; }
    .ticket-login__container { padding: 108px 20px 40px; }
    .ticket-login__container .col-md-6 { width: 100%; }
    .navbar-inverse .navbar-nav > li > a { padding-top: 12px; padding-bottom: 12px; }
}