/* ═══════════════════════════════════════════════
   Augur — Design System v3
   Palette : ivoire / or / acajou / nazar
════════════════════════════════════════════════ */

/* ── Base ── */
body {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    background: #FDFAF5;
    color: #3D2B0F;
    font-size: 15px;
}
h1,h2,h3,h4,h5,.augur-serif {
    font-family: 'Cormorant Garamond', Georgia, serif;
}

/* ── Bottom navigation bar ─────────────────── */
.nav-bar {
    display: flex;
    justify-content: space-around;
    align-items: center;
    background: #F5F0E8;
    border-top: 1.5px solid #D4B84A;
    padding: 5px 0 8px;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 1000;
    font-family: 'Outfit', sans-serif;
    height: 56px;
    box-sizing: border-box;
}
.nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    text-decoration: none !important;
    color: #8B7355 !important;
    font-size: 11px;
    font-weight: 400;
    padding: 4px 8px;
    min-width: 60px;
    text-align: center;
}
.nav-item:hover { color: #5C3D1E !important; }
.nav-item.active { color: #B8860B !important; font-weight: 600; }
.nav-icon { font-size: 20px; line-height: 1; display: block; }
.nav-label { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 72px; display: block; }

/* ── Top navbar links (desktop only) ── */
.navbar-brand { text-decoration: none; }
.aug-desktop-links .nav-link { color: #5C3D1E !important; font-size: 0.9rem; }
.aug-desktop-links .nav-link:hover { color: #B8860B !important; }
.civ-alias-header { font-size: 11px; color: #8B7355; line-height: 1; min-height: 14px; }

/* ── Content offset for fixed bars ── */
.main-content { padding-bottom: 72px; }

/* ── Buttons ── */
.btn-augur-primary {
    background: #B8860B;
    color: #FDFAF5;
    border: none;
    border-radius: 7px;
    padding: 8px 16px;
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 14px;
    letter-spacing: 2px;
    cursor: pointer;
    display: block;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
    transition: background 0.15s;
}
.btn-augur-primary:hover:not(:disabled) { background: #9A7009; }
.btn-augur-primary:disabled { opacity: 0.5; cursor: not-allowed; }

.btn-augur-outline {
    background: transparent;
    color: #8B7355;
    border: 1.5px solid #D4C5A9;
    border-radius: 7px;
    padding: 7px 16px;
    font-family: 'Outfit', sans-serif;
    font-size: 13px;
    cursor: pointer;
    display: block;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
    transition: border-color 0.15s, color 0.15s;
}
.btn-augur-outline:hover { border-color: #B8860B; color: #B8860B; }

/* ── Badges ── */
.badge-alert   { background:#F5DDD0; color:#8B3D1E; border:1px solid #D4956A; border-radius:4px; font-size:0.7rem; padding:2px 6px; white-space:nowrap; }
.badge-digest  { background:#F5E6B8; color:#8B6914; border:1px solid #D4B84A; border-radius:4px; font-size:0.7rem; padding:2px 6px; white-space:nowrap; }
.badge-sport   { background:#DFF0DC; color:#2D6B26; border:1px solid #8BC385; border-radius:4px; font-size:0.7rem; padding:2px 6px; white-space:nowrap; }
.badge-default { background:#EDE5D4; color:#5C3D1E; border:1px solid #D4C5A9; border-radius:4px; font-size:0.7rem; padding:2px 6px; white-space:nowrap; }

/* ── Dashboard cards ── */
.omen-card {
    background:#FAF6EE; border:1px solid #D4C5A9; border-radius:10px;
    padding:10px 12px; cursor:pointer; transition:border-color 0.15s; height:100%;
}
.omen-card:hover { border-color:#B8860B; }
.maturity-pip { width:22px; height:5px; border-radius:3px; }

/* ── Dashboard list view ── */
.omen-row {
    display:flex; align-items:center; gap:8px;
    padding:8px 10px; background:#FAF6EE; border:1px solid #D4C5A9;
    border-radius:8px; cursor:pointer; transition:border-color 0.15s;
    margin-bottom:4px; text-decoration:none; color:inherit;
}
.omen-row:hover { border-color:#B8860B; }
.omen-row-name { flex:1; min-width:0; font-family:'Cormorant Garamond',serif; font-size:14px; color:#3D2B0F; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.omen-row-pips { display:flex; gap:2px; flex-shrink:0; }
.omen-row-pip  { width:9px; height:3px; border-radius:2px; }

/* ── Dashboard view toggle ── */
.view-toggle { display:flex; gap:3px; }
.view-toggle-btn {
    display:flex; align-items:center; justify-content:center;
    width:28px; height:28px; border-radius:5px;
    border:1px solid #D4C5A9; background:#FDFAF5;
    cursor:pointer; font-size:13px; color:#8B7355; transition:all 0.15s;
}
.view-toggle-btn.active { background:#B8860B; border-color:#B8860B; color:#FDFAF5; }

/* ── Connector grid ── */
.connector-grid-tile {
    display:flex; flex-direction:column; align-items:center;
    padding:9px 6px; background:#FDFAF5; border:1.5px solid #D4C5A9;
    border-radius:8px; cursor:pointer; transition:all 0.15s; text-align:center;
    user-select:none;
}
.connector-grid-tile:hover,
.connector-grid-tile.selected { border-color:#B8860B; background:#FDF5E4; }
.connector-grid-tile.selected { box-shadow:0 0 0 1px #B8860B; }
.cgt-icon { font-size:20px; display:block; margin-bottom:3px; }
.cgt-name { font-size:12px; font-weight:500; color:#3D2B0F; display:block; margin-bottom:1px; }
.cgt-desc { font-size:10px; color:#8B7355; display:block; line-height:1.3; }

/* ── Civilization cards ── */
.civ-card { cursor:pointer; border:2px solid #D4C5A9; border-radius:8px; padding:10px; background:#FDFAF5; transition:border-color 0.15s; text-align:center; user-select:none; }
.civ-card:hover { border-color:#B8860B; background:#FAF6EE; }
.civ-card.selected { border-color:#B8860B; background:#FAF6EE; box-shadow:0 0 0 1px #B8860B; }

/* ── Augur name preview ── */
.augur-name-preview { border:1px solid #D4B84A; background:#FAF6EE; border-radius:8px; padding:14px; text-align:center; font-family:'Cormorant Garamond',serif; font-size:1.3rem; color:#5C3D1E; letter-spacing:1px; min-height:52px; }

/* ── Ornament separator ── */
.aug-sep { text-align:center; color:#D4C5A9; font-size:9px; letter-spacing:6px; margin:6px 0; }

/* ── Starfield (Power) ── */
.star { position:absolute; width:3px; height:3px; border-radius:50%; background:#D4B84A; animation:twinkle var(--twinkle-duration,2s) ease-in-out infinite; animation-delay:var(--twinkle-delay,0s); opacity:0; }
@keyframes twinkle { 0%,100%{opacity:0;transform:scale(0.8);} 50%{opacity:0.85;transform:scale(1.2);} }

/* ── Blazor error UI ── */
#blazor-error-ui { background:lightyellow; bottom:0; box-shadow:0 -1px 2px rgba(0,0,0,.2); display:none; left:0; padding:.6rem 1.25rem .7rem; position:fixed; width:100%; z-index:2000; }
#blazor-error-ui .dismiss { cursor:pointer; position:absolute; right:.75rem; top:.5rem; }

/* ── Segment control (Mes Omens view toggle) ─────────────── */
.seg-ctrl {
    display: flex;
    background: #F5F0E8;
    border: 1px solid #D4C5A9;
    border-radius: 8px;
    padding: 3px;
    margin-bottom: 12px;
}
.seg-ctrl-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 44px;
    border: none;
    background: transparent;
    border-radius: 6px;
    cursor: pointer;
    font-family: 'Outfit', sans-serif;
    font-size: 13px;
    color: #8B7355;
    transition: all 0.15s;
    font-weight: 400;
    padding: 0 8px;
}
.seg-ctrl-btn.active {
    background: #5C3D1E;
    color: #FDFAF5;
    font-weight: 500;
}

/* ── Confirmation modal overlay ───────────────────────────── */
.aug-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(61, 43, 15, 0.5);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.aug-modal {
    background: #FDFAF5;
    border: 1px solid #D4B84A;
    border-radius: 12px;
    padding: 20px;
    max-width: 340px;
    width: 100%;
    box-shadow: 0 8px 32px rgba(61, 43, 15, 0.25);
}
.aug-modal-title {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 1.15rem;
    color: #5C3D1E;
    margin-bottom: 8px;
    font-weight: 500;
}
.aug-modal-body {
    font-size: 13px;
    color: #8B7355;
    margin-bottom: 16px;
    line-height: 1.6;
}
.aug-modal-actions {
    display: flex;
    gap: 8px;
}
.aug-modal-actions button { flex: 1; }

/* Danger button (delete) */
.btn-aug-danger {
    background: #8B1A1A;
    color: #FDFAF5;
    border: none;
    border-radius: 7px;
    padding: 8px 16px;
    font-family: 'Outfit', sans-serif;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.15s;
}
.btn-aug-danger:hover { background: #6B1212; }