*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --color-primary: #006633;
    --color-primary-dark: #004d26;
    --color-danger: #c0392b;
    --color-success: #27ae60;
    --color-warning: #f39c12;
    --color-text: #222;
    --color-bg: #f5f5f5;
    --color-card: #fff;
    --radius: 6px;
    --shadow: 0 2px 8px rgba(0,0,0,.1);
}

body { font-family: system-ui, sans-serif; background: var(--color-bg); color: var(--color-text); }

.container { max-width: 900px; margin: 0 auto; padding: 0 1rem; }

/* Header */
.site-header { background: var(--color-primary); color: #fff; padding: .75rem 0; }
.site-header .container { display: flex; justify-content: space-between; align-items: center; }
.site-logo { color: #fff; font-weight: bold; font-size: 1.1rem; text-decoration: none; }
.site-header nav { display: flex; gap: 1rem; align-items: center; }
.site-header nav a { color: rgba(255,255,255,.85); text-decoration: none; }
.site-header nav a:hover { color: #fff; }

/* Main */
main.container { padding-top: 2rem; padding-bottom: 3rem; }

/* Footer */
.site-footer { border-top: 1px solid #ddd; padding: 1rem 0; text-align: center; color: #888; font-size: .85rem; }

/* Messages */
.messages { list-style: none; margin-bottom: 1.5rem; }
.message { padding: .75rem 1rem; border-radius: var(--radius); margin-bottom: .5rem; }
.message--error, .message--danger { background: #fdecea; color: var(--color-danger); }
.message--success { background: #eafaf1; color: var(--color-success); }
.message--warning { background: #fef9e7; color: var(--color-warning); }

/* Card */
.card { background: var(--color-card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.5rem; margin-bottom: 1.5rem; }

/* Auth */
.auth-card { max-width: 400px; margin: 2rem auto; background: var(--color-card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 2rem; }
.auth-card h1 { margin-bottom: .5rem; }
.auth-subtitle { color: #666; margin-bottom: 1.5rem; font-size: .95rem; }

/* Forms */
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; font-weight: 600; margin-bottom: .35rem; font-size: .9rem; }
.form-group input { width: 100%; padding: .6rem .8rem; border: 1px solid #ccc; border-radius: var(--radius); font-size: 1rem; }
.form-group input:focus { outline: 2px solid var(--color-primary); border-color: transparent; }
.field-errors { color: var(--color-danger); font-size: .85rem; margin-top: .3rem; list-style: none; }

/* Buttons */
.btn { display: inline-block; padding: .6rem 1.2rem; border-radius: var(--radius); font-size: 1rem; cursor: pointer; text-decoration: none; border: none; }
.btn--primary { background: var(--color-primary); color: #fff; }
.btn--primary:hover { background: var(--color-primary-dark); }
.btn--secondary { background: #eee; color: var(--color-text); }
.btn--secondary:hover { background: #ddd; }
.btn--full { width: 100%; text-align: center; }

/* Detail list */
.detail-list { display: grid; grid-template-columns: auto 1fr; gap: .4rem 1rem; }
.detail-list dt { font-weight: 600; color: #555; }

/* Danger button */
.btn--danger { background: var(--color-danger); color: #fff; }
.btn--danger:hover { background: #a93226; }
.btn--active { outline: 2px solid var(--color-primary); }

/* Card grid */
.card-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.card-title { font-size: 1.1rem; margin-bottom: .25rem; }
.card-title a { color: var(--color-primary); text-decoration: none; }
.card-subtitle { color: #666; font-size: .9rem; margin-bottom: .5rem; }
.card-meta { font-size: .85rem; color: #888; margin: .5rem 0; }

/* Date nav */
.date-nav { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; margin: 1.5rem 0 1rem; }
.date-nav input[type=date] { padding: .5rem .75rem; border: 1px solid #ccc; border-radius: var(--radius); font-size: .95rem; }

/* Reservar agora */
.reservar-agora { margin: 1rem 0; padding: 1rem; background: #f0faf4; border: 2px solid var(--color-primary); border-radius: var(--radius); display: inline-block; }

/* Slots */
.slots-grid { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
.slot-label { display: flex; align-items: center; gap: .4rem; cursor: pointer; }
.slot-label input[type=radio] { accent-color: var(--color-primary); }
.slot-label span { padding: .5rem .9rem; border: 2px solid #ddd; border-radius: var(--radius); font-size: .95rem; }
.slot-label input:checked + span { border-color: var(--color-primary); background: #e8f5ee; color: var(--color-primary); font-weight: 600; }
.slot-tag { padding: .4rem .8rem; background: #e8f5ee; color: var(--color-primary); border-radius: var(--radius); font-size: .9rem; }
.empty-state { color: #888; font-style: italic; }

/* Table */
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.table th { text-align: left; padding: .6rem .8rem; background: #f0f0f0; border-bottom: 2px solid #ddd; }
.table td { padding: .6rem .8rem; border-bottom: 1px solid #eee; }
.table tr:hover td { background: #fafafa; }

/* Badges de status */
.badge { display: inline-block; padding: .2rem .6rem; border-radius: 99px; font-size: .8rem; font-weight: 600; }
.badge--pendente { background: #fff3cd; color: #856404; }
.badge--ativa { background: #d1e7dd; color: #0a3622; }
.badge--concluida { background: #cfe2ff; color: #084298; }
.badge--encerrada_ausencia { background: #f8d7da; color: #842029; }
.badge--expirada_noshow { background: #e2e3e5; color: #41464b; }
.badge--cancelada { background: #e2e3e5; color: #41464b; }

/* Checkin card */
.checkin-card { border-left: 4px solid var(--color-primary); }
.checkin-link { word-break: break-all; font-family: monospace; }
.text-muted { color: #888; font-size: .9rem; }

/* Status dot (online/offline) */
.status-dot { display:inline-flex; align-items:center; gap:.4rem; font-size:.8rem; font-weight:600; padding:.2rem .65rem; border-radius:99px; }
.status-dot::before { content:""; display:block; width:8px; height:8px; border-radius:50%; }
.status-dot--online { background:#d1e7dd; color:#0a3622; }
.status-dot--online::before { background:#27ae60; }
.status-dot--offline { background:#e2e3e5; color:#41464b; }
.status-dot--offline::before { background:#aaa; }

/* Status reserva inline */
.status-reserva { padding:.5rem .75rem; border-radius:var(--radius); font-size:.9rem; margin-top:.5rem; }
.status-reserva--ativa { background:#d1e7dd; color:#0a3622; border-left:3px solid var(--color-success); }
.status-reserva--livre { background:#f5f5f5; color:#555; }
.status-reserva--pendente { background:#fff3cd; color:#664d03; border-left:3px solid #ffc107; }