@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap');

:root {
    --primary: #007bff;
    --london: #00247d;
    --dubai: #ffcc00;
    --brno: #28a745;
    --dark: #0a0a0a;
    --light: #f4f7f9;
}

body { font-family: 'Inter', sans-serif; margin: 0; background: var(--light); color: #333; line-height: 1.6; }
.container { width: 92%; max-width: 1200px; margin: auto; }

/* Sticky Navigace */
nav {
    position: sticky; top: 0; z-index: 9999;
    background: rgba(10, 10, 10, 0.98); backdrop-filter: blur(10px);
    padding: 12px 0; border-bottom: 2px solid #333;
}
nav .container { display: flex; align-items: center; justify-content: space-between; }
nav ul { display: flex; list-style: none; gap: 20px; margin: 0; padding: 0; align-items: center; }
nav a { color: #aaa; text-decoration: none; font-weight: 500; font-size: 0.9em; transition: 0.3s; }
nav a:hover, nav a.active { color: white; }

/* Logo v Navigaci */
.nav-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.nav-logo img { height: 32px; width: auto; }
.nav-logo span { font-weight: 800; color: white; letter-spacing: 1px; font-size: 1.2em; }

/* NEXIS ID Profil */
.nav-right { display: flex; align-items: center; gap: 15px; }
.btn-id { background: linear-gradient(135deg, var(--london), var(--primary)); color: white; border: none; padding: 8px 18px; border-radius: 50px; cursor: pointer; font-weight: bold; font-size: 0.8em; }
#my-ticket-nav { display: none; background: var(--brno); color: white; padding: 7px 15px; border-radius: 50px; font-weight: bold; cursor: pointer; font-size: 0.8em; }
.miles-badge { color: var(--dubai); font-size: 0.85em; font-weight: bold; }

/* Hero & Grid */
header.hero { background: var(--dark); color: white; padding: 80px 0; text-align: center; }
.brand-rail { color: var(--primary); }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 30px; padding: 50px 0; }
.grid-item { background: white; border-radius: 20px; overflow: hidden; box-shadow: 0 15px 40px rgba(0,0,0,0.06); transition: 0.4s; }
.line-accent { height: 10px; width: 100%; }

/* Division Cards (Home) */
.division-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin: 40px 0; }
.division-card { background: white; border-radius: 20px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
.div-img { height: 250px; background-size: cover; background-position: center; }
.div-content { padding: 25px; }

/* Modaly */
.modal { display: none; position: fixed; z-index: 10000; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85); backdrop-filter: blur(10px); }
.modal-content { background: white; margin: 5vh auto; border-radius: 25px; width: 90%; max-width: 500px; overflow: hidden; box-shadow: 0 30px 70px rgba(0,0,0,0.5); }
.modal-header { padding: 25px; background: #f8f9fa; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; align-items: center; }
.modal-body { padding: 30px; }

/* Jízdenka a Wallet */
.ticket-container { display: flex; border-radius: 15px; overflow: hidden; border: 1px solid #eee; background: white; }
.ticket-left { padding: 25px; flex: 1; }
.ticket-right { padding: 25px; background: #f9f9f9; border-left: 2px dashed #ccc; display: flex; align-items: center; justify-content: center; }
.wallet-pass { width: 320px; margin: auto; border-radius: 25px; padding: 25px; color: white; text-align: left; }

/* Chat Assistant */
#chat-widget { position: fixed; bottom: 20px; right: 20px; width: 300px; background: white; border-radius: 20px; box-shadow: 0 10px 40px rgba(0,0,0,0.2); z-index: 10001; transition: 0.4s; overflow: hidden; border: 1px solid #eee; }
.chat-closed { height: 50px; width: 220px !important; }
#chat-header { background: var(--london); color: white; padding: 15px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; }
#chat-body { height: 250px; padding: 15px; overflow-y: auto; font-size: 0.85em; display: flex; flex-direction: column; gap: 8px; }
.chat-msg { padding: 8px 12px; border-radius: 12px; max-width: 85%; }
.chat-msg.ai { background: #f0f2f5; align-self: flex-start; }
.chat-msg.user { background: var(--london); color: white; align-self: flex-end; }
#chat-footer { padding: 10px; display: flex; border-top: 1px solid #eee; }
#chat-input { flex: 1; border: none; padding: 5px; outline: none; }
.ai-status { width: 8px; height: 8px; background: #00ff00; border-radius: 50%; box-shadow: 0 0 5px #00ff00; margin-right: 8px; }

/* Footer */
footer { background: var(--dark); color: #777; padding: 50px 0; text-align: center; border-top: 1px solid #222; }
.pulse-green { animation: pulse 2s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(40,167,69,0.7); } 70% { box-shadow: 0 0 0 10px rgba(40,167,69,0); } 100% { box-shadow: 0 0 0 0 rgba(40,167,69,0); } }