:root {
    --primary: #f51e30;
    --secondary: #ff8500;
    --accent: #06b6d4;
    --dark: #090911;
    --dark-2: #11111b;
    --card: #181827;
    --card-2: #202033;
    --border: #303047;
    --text: #ffffff;
    --muted: #a8a8b8;
    --soft: #74748a;
    --success: #22c55e;
    --danger: #ef4444;
    --gradient: linear-gradient(135deg, var(--primary), var(--secondary));
    --shadow: 0 24px 80px rgba(0,0,0,.35);
    --radius: 22px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family: Inter, Arial, sans-serif; background: var(--dark); color: var(--text); line-height: 1.6; overflow-x:hidden; }
a { color: inherit; text-decoration: none; }
img { max-width:100%; }
.container { width: min(1180px, calc(100% - 40px)); margin:0 auto; }
.site-header { position: sticky; top:0; z-index:1000; backdrop-filter: blur(18px); background: rgba(9,9,17,.82); border-bottom:1px solid rgba(255,255,255,.08); }
.navbar { display:flex; align-items:center; justify-content:space-between; min-height:78px; gap:20px; }
.brand { display:flex; align-items:center; gap:12px; font-weight:800; letter-spacing:-.03em; }
.brand-mark { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:var(--gradient); box-shadow:0 0 30px rgba(245,30,48,.28); }
.brand-text small { display:block; font-size:12px; font-weight:500; color:var(--muted); letter-spacing:0; margin-top:-3px; }
.nav-links { display:flex; align-items:center; gap:22px; list-style:none; padding:0; margin:0; }
.nav-links a { color:var(--muted); font-weight:650; font-size:14px; }
.nav-links a:hover { color:#fff; }
.nav-cta { display:flex; gap:10px; align-items:center; }
.mobile-toggle { display:none; background:transparent; border:1px solid var(--border); color:#fff; border-radius:12px; padding:10px 12px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; border:0; border-radius:12px; padding:13px 18px; font-weight:800; cursor:pointer; transition:.2s ease; font-family:inherit; }
.btn-primary { background:var(--gradient); color:#fff; box-shadow:0 12px 30px rgba(245,30,48,.25); }
.btn-secondary { background:rgba(255,255,255,.06); color:#fff; border:1px solid var(--border); }
.btn-ghost { background:transparent; color:var(--muted); border:1px solid var(--border); }
.btn:hover { transform:translateY(-2px); }
.hero { position:relative; padding:92px 0 70px; background: radial-gradient(circle at 20% 20%, rgba(245,30,48,.20), transparent 34%), radial-gradient(circle at 80% 10%, rgba(255,133,0,.16), transparent 33%), linear-gradient(180deg, #090911, #141421); overflow:hidden; }
.hero:after { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px); background-size:64px 64px; opacity:.45; pointer-events:none; }
.hero-grid { position:relative; z-index:1; display:grid; grid-template-columns: 1.1fr .9fr; gap:50px; align-items:center; }
.badge { display:inline-flex; align-items:center; gap:8px; border:1px solid rgba(245,30,48,.26); background:rgba(245,30,48,.08); color:#ffb1b8; padding:8px 12px; border-radius:100px; font-size:13px; font-weight:750; margin-bottom:20px; }
.badge .dot { width:8px; height:8px; border-radius:50%; background:var(--primary); box-shadow:0 0 14px var(--primary); }
h1, h2, h3 { margin:0 0 16px; line-height:1.12; letter-spacing:-.045em; }
h1 { font-size: clamp(40px, 7vw, 72px); font-weight:900; }
h2 { font-size: clamp(32px, 5vw, 50px); font-weight:900; }
h3 { font-size: 25px; font-weight:850; }
.lead { font-size: clamp(18px, 2vw, 22px); color:var(--muted); max-width:720px; margin:0 0 30px; }
.gradient-text { background:var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin:28px 0 34px; }
.hero-stats { display:grid; grid-template-columns: repeat(3,1fr); gap:14px; }
.stat-mini { background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.09); border-radius:18px; padding:18px; }
.stat-mini strong { display:block; font-size:25px; background:var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat-mini span { color:var(--muted); font-size:13px; }
.mock-card { background:rgba(24,24,39,.92); border:1px solid rgba(255,255,255,.09); border-radius:24px; box-shadow:var(--shadow); overflow:hidden; transform: perspective(900px) rotateY(-5deg) rotateX(3deg); }
.mock-top { height:54px; display:flex; align-items:center; gap:8px; padding:0 20px; border-bottom:1px solid rgba(255,255,255,.09); color:var(--soft); }
.win { width:12px; height:12px; border-radius:50%; background:#ff5f57; } .win.y { background:#ffbd2e; } .win.g { background:#28c840; }
.mock-body { padding:22px; }
.metric-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.metric { border:1px solid var(--border); background:rgba(255,255,255,.035); padding:16px; border-radius:16px; }
.metric label { display:block; color:var(--soft); font-size:12px; font-weight:750; margin-bottom:5px; }
.metric strong { font-size:28px; }
.barline { height:8px; background:#2e2e43; border-radius:100px; margin-top:12px; overflow:hidden; }
.barline span { display:block; height:100%; background:var(--gradient); border-radius:100px; }
.section { padding:78px 0; }
.section.alt { background:var(--dark-2); }
.section-head { text-align:center; max-width:820px; margin:0 auto 42px; }
.section-head p { color:var(--muted); font-size:18px; }
.cards { display:grid; grid-template-columns: repeat(3,1fr); gap:22px; }
.card { background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:28px; box-shadow:0 18px 60px rgba(0,0,0,.16); }
.card:hover { border-color:rgba(245,30,48,.35); }
.icon { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg, rgba(245,30,48,.16), rgba(255,133,0,.16)); border:1px solid rgba(245,30,48,.24); font-size:24px; margin-bottom:18px; }
.card p, .muted { color:var(--muted); }
.split { display:grid; grid-template-columns: 1fr 1fr; gap:44px; align-items:center; }
.check-list { list-style:none; padding:0; margin:20px 0 0; }
.check-list li { padding:10px 0 10px 36px; position:relative; color:var(--muted); border-bottom:1px solid rgba(255,255,255,.06); }
.check-list li:before { content:"✓"; position:absolute; left:0; top:10px; width:24px; height:24px; border-radius:50%; display:grid; place-items:center; background:rgba(34,197,94,.16); color:#48db7b; font-size:12px; font-weight:900; }
.product-band { display:grid; grid-template-columns: repeat(2,1fr); gap:24px; }
.product-card { min-height:420px; display:flex; flex-direction:column; justify-content:space-between; background: radial-gradient(circle at top right, rgba(255,133,0,.14), transparent 35%), var(--card); border:1px solid var(--border); border-radius:28px; padding:32px; }
.tag-row { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.tag { padding:7px 10px; border-radius:100px; background:rgba(255,255,255,.06); color:var(--muted); font-size:12px; border:1px solid rgba(255,255,255,.08); }
.form-card { background:var(--card); border:1px solid var(--border); border-radius:26px; padding:30px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group { margin-bottom:16px; }
.form-group label { display:block; color:var(--muted); font-weight:750; font-size:13px; margin-bottom:7px; }
input, select, textarea { width:100%; background:#0f0f18; color:#fff; border:1px solid var(--border); border-radius:13px; padding:13px 14px; font:inherit; }
textarea { min-height:125px; resize:vertical; }
.alert { border-radius:14px; padding:14px 16px; margin-bottom:18px; border:1px solid; }
.alert.success { background:rgba(34,197,94,.12); color:#bbf7d0; border-color:rgba(34,197,94,.26); }
.alert.error { background:rgba(239,68,68,.12); color:#fecaca; border-color:rgba(239,68,68,.26); }
.locations { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.location { background:var(--card); border:1px solid var(--border); border-radius:20px; padding:22px; }
.location strong { display:block; font-size:18px; margin-bottom:6px; }
.location span { color:var(--primary); font-weight:800; font-size:13px; }
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.blog-card { background:var(--card); border:1px solid var(--border); border-radius:24px; overflow:hidden; display:flex; flex-direction:column; }
.blog-thumb { height:150px; background:radial-gradient(circle at 20% 20%, rgba(245,30,48,.35), transparent 45%), radial-gradient(circle at 80% 50%, rgba(255,133,0,.30), transparent 40%), #171727; }
.blog-card .body { padding:22px; flex:1; }
.blog-card h3 { font-size:21px; }
.blog-meta { color:var(--soft); font-size:13px; margin-bottom:10px; }
.article { max-width:860px; margin:0 auto; }
.article .content { color:#d9d9e5; font-size:18px; }
.article .content h2 { font-size:32px; margin-top:34px; }
.article .content p { margin: 0 0 18px; }
.article .content ul { color:#d9d9e5; }
.pricing-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:22px; }
.price { font-size:44px; font-weight:900; margin:12px 0; }
.revenue-calculator { margin-top:32px; background:linear-gradient(135deg, rgba(245,30,48,.12), rgba(255,133,0,.10)); border:1px solid rgba(245,30,48,.22); border-radius:28px; padding:30px; }
.calc-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:center; }
.range-line { margin:18px 0; }
.range-line input { padding:0; accent-color: var(--primary); }
.calc-result { background:var(--gradient); border-radius:22px; padding:26px; text-align:center; }
.calc-result .amount { font-size:46px; font-weight:900; }
.site-footer { background:#07070d; border-top:1px solid rgba(255,255,255,.08); padding:56px 0 26px; }
.footer-grid { display:grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap:32px; }
.footer-title { font-weight:850; margin-bottom:14px; }
.footer-links { list-style:none; padding:0; margin:0; }
.footer-links li { margin-bottom:9px; }
.footer-links a { color:var(--muted); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); margin-top:36px; padding-top:22px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; color:var(--soft); font-size:14px; }
/* Chatbot */
.chat-launch { position:fixed; right:24px; bottom:24px; z-index:1100; border:0; width:72px; height:72px; border-radius:50%; background:var(--gradient); color:#fff; box-shadow:0 18px 60px rgba(245,30,48,.35); font-size:28px; cursor:pointer; }
.chat-panel { position:fixed; right:24px; bottom:24px; width:min(440px, calc(100vw - 32px)); max-height:min(720px, calc(100vh - 48px)); background:#10101a; border:1px solid var(--border); border-radius:26px; z-index:1200; overflow:hidden; display:none; box-shadow:0 30px 100px rgba(0,0,0,.45); }
.chat-panel.open { display:flex; flex-direction:column; }
.chat-head { background:var(--gradient); padding:20px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.chat-head strong { display:block; font-size:20px; }
.chat-head span { font-size:13px; opacity:.9; }
.chat-close { border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.12); color:#fff; border-radius:14px; width:42px; height:42px; font-size:22px; cursor:pointer; }
.chat-messages { padding:18px; overflow:auto; flex:1; }
.chat-bubble { max-width:88%; border-radius:18px; padding:13px 15px; margin-bottom:12px; color:#d9d9e5; background:#202033; border:1px solid var(--border); white-space:pre-wrap; }
.chat-bubble.user { margin-left:auto; background:var(--gradient); color:#fff; border:0; }
.chat-suggestions { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.chat-suggestions button { background:#1c1c2c; color:#d4d4df; border:1px solid var(--border); border-radius:100px; padding:8px 12px; cursor:pointer; }
.chat-input { border-top:1px solid var(--border); padding:14px; display:flex; gap:10px; }
.chat-input input { flex:1; }
.chat-input button { width:54px; border-radius:16px; border:0; background:var(--gradient); color:#fff; font-size:20px; cursor:pointer; }
/* Admin */
.admin-body { background:#0c0c14; }
.admin-shell { display:grid; grid-template-columns:260px 1fr; min-height:100vh; }
.admin-sidebar { background:#08080f; border-right:1px solid var(--border); padding:22px; position:sticky; top:0; height:100vh; overflow:auto; }
.admin-sidebar a { display:block; padding:11px 13px; border-radius:12px; color:var(--muted); margin-bottom:6px; }
.admin-sidebar a:hover, .admin-sidebar a.active { background:rgba(245,30,48,.12); color:#fff; }
.admin-main { padding:30px; }
.admin-top { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:24px; }
.table-wrap { overflow:auto; border:1px solid var(--border); border-radius:18px; background:var(--card); }
table { width:100%; border-collapse:collapse; }
th, td { padding:14px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
th { color:#fff; background:#12121e; font-size:13px; }
td { color:#d9d9e5; }
.admin-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:16px; }
.admin-stat { background:var(--card); border:1px solid var(--border); border-radius:18px; padding:20px; }
.admin-stat strong { font-size:30px; display:block; }
.login-wrap { min-height:100vh; display:grid; place-items:center; background:radial-gradient(circle at 20% 20%, rgba(245,30,48,.20), transparent 35%), #090911; }
.login-card { width:min(430px, calc(100% - 40px)); background:var(--card); border:1px solid var(--border); border-radius:24px; padding:32px; }
.actions { display:flex; gap:8px; flex-wrap:wrap; }
.small { font-size:13px; color:var(--soft); }
@media (max-width: 900px) {
    .hero-grid, .split, .product-band, .calc-grid { grid-template-columns:1fr; }
    .cards, .pricing-grid, .blog-grid, .locations, .footer-grid { grid-template-columns:1fr; }
    .hero-stats { grid-template-columns:1fr; }
    .nav-links, .nav-cta { display:none; }
    .mobile-toggle { display:block; }
    .nav-links.open { display:flex; position:absolute; left:20px; right:20px; top:78px; background:#10101a; border:1px solid var(--border); border-radius:20px; flex-direction:column; align-items:flex-start; padding:18px; }
    .form-grid { grid-template-columns:1fr; }
    .admin-shell { grid-template-columns:1fr; }
    .admin-sidebar { position:relative; height:auto; }
    .admin-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 540px) {
    .container { width:min(100% - 28px, 1180px); }
    .section { padding:54px 0; }
    .chat-panel { inset:12px; width:auto; max-height:none; }
    .chat-launch { right:18px; bottom:18px; }
    .admin-grid { grid-template-columns:1fr; }
}

/* v1.1 updates */
.brand-logo { display:block; height:58px; width:auto; max-width:260px; object-fit:contain; }
.admin-logo { height:54px; max-width:220px; }
.blog-image { width:100%; height:180px; object-fit:cover; display:block; background:#171727; }
.article-image { width:100%; border-radius:28px; border:1px solid var(--border); margin:26px 0 8px; display:block; background:#171727; }
.booking-picker, .slot-picker { margin:18px 0; }
.calendar-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin:10px 0 14px; }
.calendar-toolbar strong { font-size:18px; }
.calendar-weekdays { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; margin-bottom:8px; color:var(--soft); font-size:12px; font-weight:800; text-align:center; }
.calendar-grid { display:grid; gap:8px; }
.calendar-grid.week-view { grid-template-columns:repeat(7,1fr); }
.calendar-grid.month-view { grid-template-columns:repeat(7,1fr); }
.calendar-day { min-height:86px; border:1px solid var(--border); background:#10101a; color:#fff; border-radius:18px; padding:12px; cursor:pointer; text-align:left; transition:.2s ease; }
.calendar-day span { display:block; color:var(--soft); font-size:12px; font-weight:800; margin-bottom:6px; }
.calendar-day strong { font-size:24px; }
.calendar-day:hover { border-color:rgba(245,30,48,.55); transform:translateY(-1px); }
.calendar-day.selected { border-color:var(--primary); box-shadow:0 0 0 2px rgba(245,30,48,.16); background:rgba(245,30,48,.12); }
.calendar-day.disabled { opacity:.35; cursor:not-allowed; transform:none; }
.calendar-day.muted-day { opacity:.48; }
.slot-picker label { display:block; color:var(--muted); font-weight:800; font-size:13px; margin-bottom:8px; }
.slot-buttons { display:flex; flex-wrap:wrap; gap:10px; min-height:42px; align-items:center; }
.slot-btn { border:1px solid var(--border); background:#10101a; color:#fff; padding:10px 14px; border-radius:999px; cursor:pointer; font-weight:800; }
.slot-btn:hover, .slot-btn.selected { border-color:var(--primary); background:rgba(245,30,48,.18); }
.chat-action-row { margin:0 0 12px; }
.tiny { font-size:12px; }
.admin-calendar-grid .admin-day { cursor:default; min-height:138px; }
.admin-calendar-grid .day-select { width:100%; background:transparent; border:0; color:#fff; text-align:left; cursor:pointer; padding:0 0 8px; }
.admin-calendar-grid .day-select span { display:block; color:var(--soft); font-size:12px; font-weight:800; }
.admin-calendar-grid .day-select strong { font-size:22px; }
.admin-slot-list { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.admin-slot-chip { display:inline-flex; padding:5px 8px; border-radius:999px; background:rgba(245,30,48,.14); border:1px solid rgba(245,30,48,.28); color:#fff; font-size:12px; }
.calendar-control-panel { background:var(--card); border:1px solid var(--border); border-radius:24px; padding:22px; margin-bottom:22px; }
@media (max-width: 760px) {
  .calendar-grid.week-view, .calendar-grid.month-view, .calendar-weekdays { grid-template-columns:repeat(2,1fr); }
  .calendar-weekdays { display:none; }
  .calendar-day { min-height:74px; }
  .brand-logo { max-width:210px; height:48px; }
}

/* v1.2 booking calendar redesign */
.booking-widget { background:#fff; color:#1a1a22; border:1px solid #e5e7eb; border-radius:4px; padding:34px; box-shadow:0 8px 26px rgba(0,0,0,.08); }
.booking-widget h3 { color:#1a1a22; font-size:16px; letter-spacing:-.02em; margin-bottom:18px; }
.booking-widget h3 span { color:#ef4444; }
.booking-columns { display:grid; grid-template-columns: 1fr 2fr 1.55fr; gap:34px; align-items:start; }
.booking-column + .booking-column { border-left:1px solid #e5e7eb; padding-left:34px; }
.service-options { display:flex; flex-direction:column; gap:9px; }
.service-option { border:1px solid #dfe3ea; background:#fff; color:#222; border-radius:6px; padding:11px 13px; text-align:left; cursor:pointer; font-weight:700; transition:.18s ease; }
.service-option small { display:block; color:#64748b; font-size:12px; font-weight:600; margin-top:2px; }
.service-option.selected, .service-option:hover { background:#5b8cc8; border-color:#5b8cc8; color:#fff; }
.service-option.selected small, .service-option:hover small { color:rgba(255,255,255,.86); }
.booking-heading-row { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.btn-small { padding:8px 12px; font-size:12px; border-radius:8px; }
.mini-calendar-toolbar { display:flex; align-items:center; justify-content:space-between; margin:4px 0 15px; }
.mini-calendar-toolbar strong { color:#111827; font-size:15px; }
.mini-calendar-toolbar button { border:0; background:#fff; color:#334155; font-size:28px; cursor:pointer; line-height:1; padding:4px 8px; border-radius:6px; }
.mini-calendar-toolbar button:hover { background:#f1f5f9; }
.calendar-weekdays.compact { color:#475569; font-size:10px; gap:0; margin:0 0 8px; }
.booking-mini-calendar { display:grid; grid-template-columns:repeat(7, 1fr); gap:10px; min-height:250px; }
.booking-mini-calendar.week-view { grid-template-columns:repeat(7, 1fr); min-height:84px; }
.mini-day { width:40px; height:40px; border:0; background:transparent; border-radius:50%; display:grid; place-items:center; color:#232735; font-weight:800; cursor:pointer; margin:auto; position:relative; }
.mini-day span { line-height:1; }
.mini-day small { position:absolute; right:-3px; top:-3px; min-width:17px; height:17px; border-radius:50%; background:rgba(0,0,0,.75); color:#fff; font-size:10px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.8); }
.mini-day.available { background:#6ea0d8; color:#fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.16); }
.mini-day.partial { background:#96ad38; color:#fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.2); }
.mini-day.pending { background:#9c9272; color:#fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.2); }
.mini-day.booked { background:#985d65; color:#fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.2); }
.mini-day.closed, .mini-day.disabled { color:#c4c8d0; background:transparent; box-shadow:none; cursor:not-allowed; }
.mini-day.muted-day { opacity:.45; }
.mini-day.selected { outline:3px solid rgba(59,130,246,.25); transform:scale(1.08); }
.calendar-legend { display:flex; flex-wrap:wrap; gap:12px 18px; margin-top:18px; color:#333; font-size:13px; }
.calendar-legend span { display:inline-flex; gap:8px; align-items:center; }
.legend { width:22px; height:22px; border-radius:50%; display:inline-block; box-shadow: inset 0 -2px 0 rgba(0,0,0,.16); }
.legend.available { background:#6ea0d8; } .legend.pending { background:#9c9272; } .legend.partial { background:#96ad38; } .legend.booked { background:#985d65; }
.time-buttons { display:grid; grid-template-columns:repeat(2, minmax(110px,1fr)); gap:10px 14px; }
.time-btn { min-height:44px; border:1px solid #dfe3ea; background:#fff; color:#1f2937; border-radius:6px; display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:pointer; font-weight:800; }
.time-btn span { color:#64748b; font-size:11px; font-weight:700; margin-top:1px; }
.time-btn:hover, .time-btn.selected { background:#5b8cc8; border-color:#5b8cc8; color:#fff; }
.time-btn:hover span, .time-btn.selected span { color:rgba(255,255,255,.86); }
.time-btn.pending { background:#f9f5e8; border-color:#d7ccb4; color:#8b7355; cursor:not-allowed; }
.time-btn.booked { background:#fdebed; border-color:#e5b8bd; color:#985d65; cursor:not-allowed; }
.time-btn.closed { background:#f1f5f9; border-color:#e2e8f0; color:#9aa4b2; cursor:not-allowed; }
.time-btn:disabled { opacity:.9; }
.booking-summary-bar { margin-top:36px; border-top:1px solid #e5e7eb; padding-top:24px; display:grid; grid-template-columns: 1fr 1fr 1fr auto; gap:18px; align-items:center; }
.booking-summary-bar span { color:#64748b; margin-right:8px; }
.booking-summary-bar strong { color:#111827; }
.booking-details-panel { display:none; margin-top:28px; border-top:1px solid #e5e7eb; padding-top:28px; }
.booking-details-panel.open { display:block; }
.booking-details-panel input, .booking-details-panel textarea { background:#fff; color:#111827; border-color:#dfe3ea; }
.booking-details-panel label { color:#374151; }
.booking-widget .muted { color:#64748b; }
.booking-widget .btn-primary { color:#fff; }
.booking-widget .btn-ghost, .booking-widget .btn-secondary { color:#1f2937; background:#fff; border-color:#dfe3ea; }

/* v1.2 admin calendar */
.admin-booking-manager { background:var(--card); color:#fff; border:1px solid var(--border); border-radius:24px; padding:24px; }
.admin-booking-manager .booking-widget { background:#fff; color:#1a1a22; }
.admin-service-option { border:1px solid #dfe3ea; background:#fff; color:#222; border-radius:6px; padding:11px 13px; text-align:left; cursor:pointer; font-weight:700; margin-bottom:9px; width:100%; }
.admin-service-option.selected, .admin-service-option:hover { background:#5b8cc8; border-color:#5b8cc8; color:#fff; }
.admin-actions-panel { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:24px; }
.admin-actions-panel .form-card { background:var(--card); color:#fff; }
.admin-actions-panel .form-card h3 { color:#fff; }
.admin-actions-panel .form-card input, .admin-actions-panel .form-card select { background:#0f0f18; color:#fff; border-color:var(--border); }
.admin-actions-panel label { color:var(--muted); }
.admin-selected-box { background:#10101a; border:1px solid var(--border); border-radius:18px; padding:16px; margin-bottom:18px; color:#fff; }
.admin-selected-box strong { display:block; color:#fff; font-size:18px; }
#adminRecurringSlots { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.admin-slot-chip { display:inline-flex; padding:7px 10px; border-radius:999px; background:rgba(245,30,48,.14); border:1px solid rgba(245,30,48,.28); color:#fff; font-size:12px; }
.admin .mini-day { width:38px; height:38px; }
.admin-booking-manager .time-buttons { max-height:360px; overflow:auto; padding-right:4px; }

@media (max-width: 980px) {
  .booking-columns { grid-template-columns:1fr; }
  .booking-column + .booking-column { border-left:0; padding-left:0; border-top:1px solid #e5e7eb; padding-top:24px; }
  .booking-summary-bar { grid-template-columns:1fr; }
  .admin-actions-panel { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .booking-widget { padding:20px; }
  .time-buttons { grid-template-columns:1fr; }
  .booking-mini-calendar { gap:6px; }
  .mini-day { width:34px; height:34px; }
}

/* v1.3 booking calendar theme and admin fixes */
.booking-widget {
  background: linear-gradient(180deg, rgba(24,24,39,.98), rgba(16,16,27,.98));
  color: var(--text);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 24px;
  box-shadow: var(--shadow);
}
.booking-widget h3,
.mini-calendar-toolbar strong,
.booking-summary-bar strong { color: #fff; }
.booking-column + .booking-column { border-left-color: var(--border); }
.service-option,
.admin-service-option {
  background: rgba(255,255,255,.045);
  color: #fff;
  border-color: var(--border);
  border-radius: 12px;
}
.service-option small,
.admin-service-option small { color: var(--muted); }
.service-option.selected,
.service-option:hover,
.admin-service-option.selected,
.admin-service-option:hover {
  background: var(--gradient);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 12px 28px rgba(245,30,48,.20);
}
.service-option.selected small,
.service-option:hover small,
.admin-service-option.selected small,
.admin-service-option:hover small { color: rgba(255,255,255,.86); }
.mini-calendar-toolbar button,
.mini-calendar-toolbar .calendar-nav {
  border: 1px solid var(--border);
  background: rgba(255,255,255,.055);
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  line-height: 1;
  padding: 4px 10px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
}
.mini-calendar-toolbar button:hover,
.mini-calendar-toolbar .calendar-nav:hover { background: rgba(245,30,48,.18); border-color: rgba(245,30,48,.45); }
.calendar-weekdays.compact { color: var(--muted); }
.mini-day {
  color: #e7e7ef;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  text-decoration: none;
}
.mini-day.available { background: linear-gradient(135deg, #12b981, #0ea5e9); color: #fff; }
.mini-day.partial { background: linear-gradient(135deg, #f59e0b, #84cc16); color: #fff; }
.mini-day.pending { background: linear-gradient(135deg, #a78bfa, #f59e0b); color: #fff; }
.mini-day.booked { background: linear-gradient(135deg, #ef4444, #b91c1c); color: #fff; }
.mini-day.closed, .mini-day.disabled { color: #6f7082; background: rgba(255,255,255,.025); border-color: rgba(255,255,255,.055); box-shadow:none; }
.mini-day.available::after { content:'✓'; }
.mini-day.partial::after { content:'◐'; }
.mini-day.pending::after { content:'⏳'; font-size:10px; }
.mini-day.booked::after { content:'●'; }
.mini-day.closed::after, .mini-day.disabled::after { content:'×'; }
.mini-day::after {
  position:absolute;
  left:50%;
  bottom:-11px;
  transform:translateX(-50%);
  width:18px;
  height:18px;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:900;
  background:#10101a;
  color:#fff;
  border:1px solid rgba(255,255,255,.16);
}
.mini-day.selected { outline: 3px solid rgba(245,30,48,.28); transform: scale(1.08); }
.calendar-legend { color: var(--muted); }
.legend.available { background: linear-gradient(135deg, #12b981, #0ea5e9); }
.legend.pending { background: linear-gradient(135deg, #a78bfa, #f59e0b); }
.legend.partial { background: linear-gradient(135deg, #f59e0b, #84cc16); }
.legend.booked { background: linear-gradient(135deg, #ef4444, #b91c1c); }
.legend.closed { background: rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.20); }
.time-btn {
  background: rgba(255,255,255,.045);
  color: #fff;
  border-color: var(--border);
  border-radius: 12px;
  text-decoration: none;
}
.time-btn span { color: var(--muted); }
.time-btn:hover, .time-btn.selected { background: var(--gradient); border-color: transparent; color: #fff; }
.time-btn.pending { background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.34); color:#fbbf24; }
.time-btn.booked { background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.34); color:#fca5a5; }
.time-btn.closed { background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.08); color:#77798c; }
.booking-summary-bar,
.booking-details-panel { border-top-color: var(--border); }
.booking-summary-bar span,
.booking-widget .muted { color: var(--muted); }
.booking-details-panel input,
.booking-details-panel textarea,
.booking-details-panel select,
.booking-widget input,
.booking-widget textarea,
.booking-widget select {
  background:#0f0f18;
  color:#fff;
  border-color:var(--border);
}
.booking-details-panel label { color: var(--muted); }
.booking-widget .btn-ghost,
.booking-widget .btn-secondary { color:#fff; background:rgba(255,255,255,.055); border-color:var(--border); }
.booking-widget .btn-primary { color:#fff; }
.admin-booking-manager .booking-widget { background: linear-gradient(180deg, rgba(24,24,39,.98), rgba(16,16,27,.98)); color:#fff; }
.admin-calendar-shell { display:flex; flex-direction:column; gap:20px; }
.admin-calendar-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; flex-wrap:wrap; background:var(--card); border:1px solid var(--border); border-radius:24px; padding:22px; }
.admin-calendar-header h2 { margin-bottom:6px; }
.admin-calendar-view-toggle { display:flex; gap:10px; flex-wrap:wrap; }
.admin-service-bar { display:flex; gap:14px; align-items:center; flex-wrap:wrap; background:var(--card); border:1px solid var(--border); border-radius:18px; padding:16px 18px; }
.admin-service-bar label { color:var(--muted); font-weight:800; }
.admin-service-bar select { min-width:280px; background:#0f0f18; color:#fff; border:1px solid var(--border); border-radius:12px; padding:12px; }
.booking-admin-live .booking-columns { grid-template-columns: 2fr 1.45fr; }
.booking-admin-live .wide-date-column { min-width:0; }
.booking-admin-live .mini-day { width:46px; height:46px; }
.booking-admin-live .booking-mini-calendar.week-view { min-height:94px; }
.admin-selected-box { background:rgba(255,255,255,.045); border:1px solid var(--border); border-radius:16px; padding:14px; margin-bottom:14px; display:flex; flex-direction:column; gap:4px; }
.admin-time-buttons .time-btn { min-height:54px; }
.improved-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-chip-list { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.compact-table table th,
.compact-table table td { padding:10px; font-size:13px; }
.btn[disabled], button[disabled] { opacity:.45; cursor:not-allowed; transform:none; }
@media (max-width: 1040px) {
  .booking-admin-live .booking-columns { grid-template-columns:1fr; }
  .booking-column + .booking-column { border-left:0; padding-left:0; border-top:1px solid var(--border); padding-top:24px; }
  .improved-actions { grid-template-columns:1fr; }
}
@media (max-width: 760px) {
  .booking-mini-calendar.month-view { grid-template-columns:repeat(7, minmax(34px, 1fr)); }
  .booking-admin-live .mini-day { width:36px; height:36px; font-size:13px; }
  .mini-day::after { display:none; }
  .time-buttons { grid-template-columns:1fr; }
}
