:root { --bg:#0b0d0f; --panel:#14171a; --panel2:#1c2024; --text:#f5f1e8; --muted:#aaa79f; --accent:#d7b56d; --accent2:#a98645; --line:rgba(255,255,255,.11); --danger:#ee7575; --ok:#72d38a; --blue:#83aef8; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:radial-gradient(circle at 12% -10%,rgba(215,181,109,.1),transparent 30%),#0b0d0f; color:var(--text); font-family:Inter,Segoe UI,Arial,sans-serif; min-height:100vh; overflow-x:hidden; }
a { color:var(--accent); text-decoration:none; transition:color .2s ease,background .2s ease,border-color .2s ease,opacity .2s ease; }
.app-header { position:sticky; top:0; z-index:30; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:14px clamp(16px,2vw,32px); background:rgba(11,13,15,.9); border-bottom:1px solid var(--line); backdrop-filter:blur(16px); }
.logo-wrap { display:flex; align-items:center; gap:12px; min-width:0; color:var(--text); }
.logo-img { width:auto; height:40px; max-width:150px; object-fit:contain; filter:drop-shadow(0 3px 12px rgba(0,0,0,.28)); }
.brand-lockup { display:grid; gap:1px; }
.brand-text { font-weight:800; letter-spacing:.02em; }
.brand-context { color:var(--muted); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
nav { display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
nav a { color:var(--text); opacity:.82; padding:9px 11px; border-radius:9px; font-size:14px; font-weight:650; }
nav a:hover { background:var(--panel2); opacity:1; }
.app-main { width:100%; max-width:1600px; margin:24px auto; padding:0 clamp(16px,2vw,32px); }
.hero { display:grid; grid-template-columns:1.05fr .95fr; gap:22px; align-items:stretch; }
.hero-photo { min-height:430px; border-radius:24px; background-size:cover; background-position:center; border:1px solid var(--line); box-shadow:0 22px 55px rgba(0,0,0,.42); position:relative; overflow:hidden; }
.hero-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.4),transparent 55%), linear-gradient(0deg,rgba(0,0,0,.35),transparent); }
.card { background:linear-gradient(180deg, rgba(23,25,29,.96), rgba(15,17,22,.96)); border:1px solid var(--line); border-radius:20px; padding:22px; box-shadow:0 18px 38px rgba(0,0,0,.28); }
.card.glass { background:rgba(15,17,21,.84); backdrop-filter:blur(8px); }
h1 { font-size:clamp(34px,5vw,68px); line-height:.95; margin:0 0 14px; letter-spacing:-.04em; }
h2 { margin:0 0 14px; }
h3 { margin:16px 0 10px; }
.muted { color:var(--muted); }
.small { font-size:12px; }
.grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
/* Fullscreen admin layout: do not cap page width on desktop; let cards/grids use the whole browser. */
section, .card, .grid, .manage-list, .pos-layout, .booking-layout, .dashboard-top { max-width:100%; }
.grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.stat { background:var(--panel2); border:1px solid var(--line); border-radius:15px; padding:18px; }
.stat strong { display:block; font-size:28px; margin-top:4px; }
form { display:grid; gap:12px; }
label { display:grid; gap:6px; color:var(--muted); font-size:13px; }
input, select, textarea, button { width:100%; border-radius:13px; border:1px solid var(--line); background:#101217; color:var(--text); padding:12px 13px; font:inherit; }
textarea { min-height:90px; resize:vertical; }
button, .button { display:inline-flex; align-items:center; justify-content:center; border:0; background:linear-gradient(135deg,var(--accent),#b8913f); color:#15120a; font-weight:900; cursor:pointer; padding:12px 15px; border-radius:13px; box-shadow:0 8px 18px rgba(226,197,117,.14); }
.button { width:auto; }
button.secondary, .button.secondary { background:var(--panel2); color:var(--text); border:1px solid var(--line); box-shadow:none; }
button.danger, .button.danger { background:var(--danger); color:#1a0909; }
button.ok, .button.ok { background:var(--ok); color:#071707; }
table { width:100%; border-collapse:collapse; }
th, td { text-align:left; padding:11px; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.05em; }
.badge { display:inline-block; border-radius:999px; padding:4px 9px; background:var(--panel2); border:1px solid var(--line); font-size:12px; }
.badge.low { background:var(--danger); color:#160808; border:0; font-weight:900; }
.badge.ok { background:var(--ok); color:#071707; border:0; font-weight:900; }
.notice { margin:0 0 16px; padding:14px 16px; border-radius:15px; background:#13251a; border:1px solid #315b3c; }
.notice.error { background:#2a1517; border-color:#6b2a30; }
.inline { display:flex; gap:10px; align-items:end; }
.inline > * { flex:1; }
.row-actions { display:flex; gap:8px; flex-wrap:wrap; }
.nav-main { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.nav-more { position:relative; }
.nav-more summary { list-style:none; cursor:pointer; color:var(--text); opacity:.9; padding:8px 12px; border-radius:10px; border:1px solid var(--line); background:var(--panel2); font-weight:800; }
.nav-more summary::-webkit-details-marker { display:none; }
.nav-more[open] summary { border-color:var(--accent); }
.nav-menu { position:absolute; right:0; top:calc(100% + 8px); min-width:220px; background:#111318; border:1px solid var(--line); border-radius:14px; padding:8px; box-shadow:0 18px 40px rgba(0,0,0,.42); display:grid; gap:4px; }
.nav-menu a { display:block; width:100%; padding:10px 12px; }
.manage-list { display:grid; gap:14px; }
.manage-card { background:rgba(16,18,23,.72); border:1px solid var(--line); border-radius:18px; padding:15px; }
.manage-card:hover { border-color:rgba(226,197,117,.42); }
.manage-title { display:flex; gap:12px; align-items:center; margin-bottom:12px; }
.manage-title > div { flex:1; min-width:0; }
.manage-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.manage-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.action-strip { display:flex; gap:10px; flex-wrap:wrap; align-items:end; margin-top:12px; }
.action-strip form { flex:1 1 220px; }
.action-strip .delete-form { flex:0 0 auto; }
.compact-action { display:flex; gap:8px; align-items:end; }
.compact-action input { min-width:110px; }
.management-note { background:rgba(226,197,117,.07); border:1px dashed rgba(226,197,117,.32); border-radius:15px; padding:12px 14px; color:var(--muted); }
.product-img { width:54px; height:54px; object-fit:cover; border-radius:10px; background:#0f1116; border:1px solid var(--line); }
.gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.gallery div { min-height:160px; border-radius:18px; background-size:cover; background-position:center; border:1px solid var(--line); }
.pos-layout { display:grid; grid-template-columns:1.2fr .8fr; gap:18px; }
.pos-products { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; max-height:640px; overflow:auto; padding-right:4px; }
.pos-tile { text-align:left; background:var(--panel2); border:1px solid var(--line); border-radius:15px; padding:12px; cursor:pointer; }
.pos-tile:hover { border-color:var(--accent); }
.pos-cart { position:sticky; top:90px; }
.receipt { max-width:420px; margin:auto; background:#fff; color:#111; border-radius:6px; padding:22px; font-family:Consolas,monospace; }
.receipt h1 { color:#111; font-size:24px; text-align:center; }
.receipt table th,.receipt table td { color:#111; border-bottom:1px dashed #aaa; font-size:13px; }
.camera-box { background:#06070a; border:1px solid var(--line); border-radius:18px; overflow:hidden; min-height:260px; display:flex; align-items:center; justify-content:center; }
.camera-box img, .camera-box video { width:100%; max-height:520px; object-fit:contain; }
.footer { padding:18px clamp(10px,1.4vw,24px); border-top:1px solid var(--line); color:var(--muted); margin-top:32px; }
.kbd { font-family:Consolas,monospace; background:#050608; border:1px solid var(--line); padding:2px 6px; border-radius:6px; }
.booking-layout, .dashboard-top { display:grid; grid-template-columns:.92fr 1.08fr; gap:18px; align-items:start; }
.week-head { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; margin-bottom:12px; }
.week-nav { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.week-days { display:grid; grid-template-columns:repeat(7,minmax(150px,1fr)); gap:10px; overflow-x:auto; padding-bottom:6px; }
.day-card { min-width:150px; background:#101217; border:1px solid var(--line); border-radius:16px; padding:13px; }
.day-card h3 { margin:0 0 4px; color:var(--accent); }
.day-bookings { margin-top:10px; display:grid; gap:8px; }
.booking-pill { background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:8px; font-size:13px; }
.quick-booking-card { border-color:rgba(226,197,117,.45); }
.role-perms { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 12px; }
.role-perms label { display:flex; align-items:center; gap:7px; }
.role-perms input[type=checkbox] { width:auto; }

/* Professional shared shell */
:focus-visible { outline:3px solid rgba(215,181,109,.42); outline-offset:2px; }
.card { background:#14171a; border:1px solid var(--line); border-radius:16px; padding:22px; box-shadow:0 16px 42px rgba(0,0,0,.18); }
h1 { font-size:clamp(32px,4vw,52px); line-height:1.02; letter-spacing:-.035em; }
h2 { letter-spacing:-.02em; }
input,select,textarea { transition:border-color .2s ease,box-shadow .2s ease,background .2s ease; }
input:focus,select:focus,textarea:focus { border-color:rgba(215,181,109,.75); box-shadow:0 0 0 3px rgba(215,181,109,.1); outline:0; }
button,.button { transition:transform .2s ease,filter .2s ease,background .2s ease; }
button:hover,.button:hover { transform:translateY(-1px); filter:brightness(1.04); }
button:active,.button:active { transform:translateY(0); }
.page-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin:6px 0 24px; }
.page-heading h1 { margin:4px 0 8px; }
.page-heading p { max-width:720px; margin:0; color:var(--muted); line-height:1.6; }
.admin-kicker { color:var(--accent); font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.login-card { width:min(100%,520px); margin:8vh auto; padding:34px; }
.login-card h1 { margin-top:10px; }

/* Customer-facing website */
.public-shell { --site-accent:var(--accent); background:#0a0c0d; }
.public-shell .app-header { padding-inline:max(20px,calc((100vw - 1240px)/2)); }
.public-shell .app-main { max-width:1280px; margin:0 auto; padding:0 20px 36px; }
.public-shell .logo-img { height:46px; max-width:170px; }
.public-shell .brand-text { font-size:15px; }
.public-nav { gap:12px; overflow:visible; }
.public-nav .nav-book-link { background:var(--text); color:#101214; opacity:1; padding:10px 16px; }
.public-nav .nav-book-link:hover { background:var(--site-accent); }
.public-site { --accent:var(--site-accent); }
.public-hero { display:grid; grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr); align-items:center; gap:clamp(36px,6vw,88px); min-height:680px; padding:58px 0 64px; }
.public-eyebrow { display:inline-flex; align-items:center; gap:10px; color:var(--site-accent); font-size:12px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.public-eyebrow::before { content:""; width:28px; height:1px; background:currentColor; }
.public-hero-copy h1 { max-width:780px; margin:22px 0 24px; font-family:Georgia,"Times New Roman",serif; font-size:clamp(58px,7vw,98px); font-weight:500; line-height:.91; letter-spacing:-.055em; }
.public-lead { max-width:650px; margin:0; color:#c7c3ba; font-size:clamp(18px,2vw,22px); line-height:1.62; }
.hero-actions { display:flex; align-items:center; gap:22px; margin:34px 0; flex-wrap:wrap; }
.public-primary { background:var(--site-accent); color:#16130d; box-shadow:none; padding:14px 19px; }
.text-link { color:var(--text); font-weight:750; }
.text-link span { display:inline-block; margin-left:5px; transition:transform .2s ease; }
.text-link:hover span { transform:translateX(4px); }
.public-details { display:flex; flex-wrap:wrap; gap:22px 34px; padding-top:30px; border-top:1px solid var(--line); }
.public-details span,.public-details a { display:grid; gap:5px; color:var(--text); font-size:14px; }
.public-details small { color:#86857f; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.public-hero-media { min-height:580px; position:relative; overflow:hidden; border-radius:30px 30px 8px 30px; background:#171a1d; box-shadow:0 34px 70px rgba(0,0,0,.35); }
.public-hero-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 58%,rgba(0,0,0,.48)); pointer-events:none; }
.public-hero-media>img { width:100%; height:100%; min-height:580px; position:absolute; inset:0; object-fit:cover; }
.hero-badge { position:absolute; z-index:1; right:0; bottom:0; display:grid; gap:4px; max-width:280px; padding:20px 24px; background:var(--site-accent); color:#17130d; }
.hero-badge span { font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.hero-badge strong { font-family:Georgia,"Times New Roman",serif; font-size:20px; font-weight:600; line-height:1.2; }
.public-booking-layout { display:grid; grid-template-columns:minmax(0,.78fr) minmax(520px,1.22fr); gap:clamp(34px,6vw,80px); align-items:center; margin:24px 0 88px; padding:clamp(28px,5vw,64px); border-radius:32px; background:#efe9dd; color:#171814; }
.booking-context h2 { max-width:520px; margin:18px 0; font-family:Georgia,"Times New Roman",serif; font-size:clamp(46px,5vw,70px); font-weight:500; line-height:.95; letter-spacing:-.045em; }
.booking-context>p { max-width:540px; color:#595a53; font-size:17px; line-height:1.7; }
.booking-assurances { display:flex; flex-wrap:wrap; gap:8px; margin:24px 0; }
.booking-assurances span { padding:8px 10px; border:1px solid rgba(20,22,18,.15); border-radius:999px; color:#494a44; font-size:12px; font-weight:700; }
.feature-mini { display:flex; align-items:center; gap:14px; margin-top:32px; padding-top:24px; border-top:1px solid rgba(20,22,18,.14); }
.feature-mini img { width:76px; height:76px; object-fit:cover; border-radius:50%; }
.feature-mini div { display:grid; gap:5px; }
.feature-mini small { color:#717269; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.feature-mini strong { font-family:Georgia,"Times New Roman",serif; font-size:18px; }
.booking-card { background:#111416; color:var(--text); border:0; border-radius:22px; padding:clamp(22px,4vw,38px); box-shadow:0 28px 60px rgba(20,18,13,.2); }
.booking-card-head { display:flex; align-items:center; gap:14px; margin-bottom:24px; }
.booking-card-head>span { display:grid; place-items:center; width:42px; height:42px; border:1px solid var(--line); border-radius:50%; color:var(--site-accent); font-size:12px; font-weight:800; }
.booking-card-head small { color:#8d8b85; font-size:10px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.booking-card-head h2 { margin:3px 0 0; font-size:26px; }
.booking-card label { color:#b8b4ac; }
.booking-card input,.booking-card select,.booking-card textarea { background:#0b0d0f; border-color:rgba(255,255,255,.13); }
.optional { color:#777873; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.booking-submit { justify-content:space-between; background:var(--site-accent); box-shadow:none; }
.public-services-section { padding:12px 0 92px; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:30px; }
.section-heading h2,.public-closing h2 { margin:12px 0 0; font-family:Georgia,"Times New Roman",serif; font-size:clamp(42px,5vw,68px); font-weight:500; line-height:.98; }
.section-heading>p { max-width:390px; margin:0; color:var(--muted); line-height:1.6; }
.public-service-grid { border-top:1px solid var(--line); }
.public-service-card { display:grid; grid-template-columns:52px 1fr auto; gap:18px; align-items:center; padding:22px 8px; border-bottom:1px solid var(--line); transition:background .2s ease,padding .2s ease; }
.public-service-card:hover { padding-inline:16px; background:rgba(255,255,255,.025); }
.service-number { color:#76756f; font-size:12px; font-weight:800; }
.public-service-card h3 { margin:0 0 4px; font-size:20px; }
.public-service-card p { margin:0; color:var(--muted); font-size:13px; }
.public-service-card>strong { color:var(--site-accent); font-family:Georgia,"Times New Roman",serif; font-size:22px; font-weight:600; }
.empty-state { padding:28px 0; color:var(--muted); }
.public-products-section { padding:0 0 92px; }
.product-toolbar { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.34fr); gap:12px; margin:0 0 24px; padding:16px; border:1px solid var(--line); border-radius:16px; background:#111416; }
.product-toolbar label { color:#a8a69f; }
.product-toolbar input,.product-toolbar select { background:#0a0c0e; }
.public-product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.public-product-card { display:flex; min-width:0; flex-direction:column; overflow:hidden; border:1px solid var(--line); border-radius:20px; background:#14171a; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.public-product-card:hover { transform:translateY(-3px); border-color:rgba(215,181,109,.4); box-shadow:0 22px 42px rgba(0,0,0,.24); }
.product-image-link { display:grid; place-items:center; aspect-ratio:1/1; overflow:hidden; background:#f3f1ed; }
.product-image-link img { width:100%; height:100%; padding:16px; object-fit:contain; transition:transform .28s ease; }
.public-product-card:hover .product-image-link img { transform:scale(1.025); }
.product-card-body { display:flex; flex:1; flex-direction:column; gap:12px; padding:20px; }
.product-meta { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.product-category { color:var(--site-accent); font-size:10px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.product-price { font-family:Georgia,"Times New Roman",serif; color:var(--site-accent); font-size:22px; font-weight:600; }
.public-product-card h3 { min-height:2.7em; margin:0; font-size:19px; line-height:1.35; }
.product-description { margin:0; color:#aaa79f; font-size:13px; line-height:1.62; }
.product-facts { display:flex; flex-wrap:wrap; gap:7px; }
.product-facts span { padding:6px 8px; border:1px solid var(--line); border-radius:999px; color:#b9b6ae; font-size:11px; }
.product-purchase { width:100%; margin-top:auto; }
.product-empty { display:none; margin:18px 0 0; padding:20px; border:1px dashed rgba(215,181,109,.32); border-radius:14px; color:var(--muted); }
.public-closing { display:flex; align-items:center; justify-content:space-between; gap:30px; margin-bottom:48px; padding:clamp(28px,5vw,60px); border-radius:28px; background:#171a1d; border:1px solid var(--line); }
.public-closing h2 { max-width:720px; font-size:clamp(38px,4vw,58px); }
.public-shell .footer { display:flex; justify-content:center; gap:16px 28px; flex-wrap:wrap; padding:24px; font-size:12px; }
.footer-admin { color:#777873; }

/* Website editor */
.appearance-layout { display:grid; grid-template-columns:minmax(620px,1.12fr) minmax(420px,.88fr); gap:22px; align-items:start; }
.appearance-form { display:grid; gap:28px; }
.form-section { display:grid; gap:16px; padding-bottom:28px; border-bottom:1px solid var(--line); }
.form-section:last-of-type { border-bottom:0; padding-bottom:0; }
.form-section-head { display:flex; align-items:flex-start; gap:13px; }
.form-section-head>span { display:grid; place-items:center; width:34px; height:34px; flex:0 0 auto; border:1px solid var(--line); border-radius:50%; color:var(--accent); font-size:11px; font-weight:800; }
.form-section-head h2 { margin:2px 0 4px; }
.form-section-head p { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.media-editor-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.media-editor-card { display:grid; align-content:start; gap:12px; padding:12px; border:1px solid var(--line); border-radius:14px; background:#101316; }
.media-editor-card h3 { margin:0 0 3px; }
.media-editor-card p { margin:0; color:var(--muted); font-size:12px; line-height:1.45; }
.media-preview { height:150px; overflow:hidden; border-radius:10px; background:#080a0b; border:1px solid var(--line); }
.media-preview img { width:100%; height:100%; object-fit:cover; }
.logo-preview img { padding:18px; object-fit:contain; }
.check-row { display:flex; align-items:center; gap:8px; color:var(--muted); }
.check-row input { width:auto; min-height:0; }
.editor-actions { display:flex; gap:10px; flex-wrap:wrap; }
.editor-actions button { width:auto; }
.preview-panel { position:sticky; top:94px; overflow:hidden; border:1px solid var(--line); border-radius:16px; background:#080a0b; box-shadow:0 20px 55px rgba(0,0,0,.24); }
.preview-toolbar { height:48px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; padding:0 14px; border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; }
.preview-toolbar>div { display:flex; gap:6px; }
.preview-toolbar>div span { width:8px; height:8px; border-radius:50%; background:#44494e; }
.preview-toolbar>a { justify-self:end; }
.site-preview { display:block; width:100%; height:780px; border:0; background:#fff; }

.public-booking { max-width:none; margin:0; }
.public-booking h1 { margin-bottom:10px; }
.public-services { max-width:none; margin:16px 0 0; }
.compact-lead { font-size:16px; line-height:1.5; margin-bottom:18px; }
.mobile-clean-section { width:100%; }

/* Optimized admin workspace */
.admin-shell .app-main { margin-top:20px; }
.admin-shell .page-heading { margin:2px 0 22px; }
.admin-shell .page-heading h1 { font-size:clamp(32px,3.4vw,46px); }
.admin-shell .footer { display:flex; justify-content:space-between; gap:16px; padding-inline:clamp(16px,2vw,32px); font-size:12px; }
.admin-shell .nav-main a[aria-current="page"] { color:var(--text); opacity:1; background:rgba(215,181,109,.12); box-shadow:inset 0 0 0 1px rgba(215,181,109,.28); }
.admin-shell .nav-menu a[aria-current="page"] { color:var(--accent); }
.section-toolbar { display:flex; justify-content:space-between; align-items:end; gap:18px; margin-bottom:16px; }
.section-toolbar h2 { margin:0 0 5px; }
.section-toolbar p { margin:0; }
.search-field { width:min(100%,340px); }
.search-field input { min-width:240px; background:#0d0f13; }
.table-wrap { width:100%; overflow:auto; border:1px solid var(--line); border-radius:13px; -webkit-overflow-scrolling:touch; }
.table-wrap table { min-width:720px; }
.table-wrap th { position:sticky; top:0; z-index:1; background:#171a1e; }
.table-wrap tbody tr { transition:background .18s ease; }
.table-wrap tbody tr:hover { background:rgba(255,255,255,.025); }
.table-wrap th:first-child,.table-wrap td:first-child { padding-left:15px; }
.table-wrap th:last-child,.table-wrap td:last-child { padding-right:15px; }
.empty-panel { display:grid; justify-items:start; gap:9px; min-height:190px; align-content:center; padding:28px; border:1px dashed rgba(215,181,109,.3); border-radius:14px; background:rgba(215,181,109,.035); }
.empty-panel h2,.empty-panel p { margin:0; }
.empty-panel p { max-width:560px; color:var(--muted); line-height:1.55; }
.summary-strip { margin-bottom:18px; }
.summary-strip .stat { min-height:98px; }
.summary-strip .stat strong { font-size:24px; }
.manage-accordion { padding:0; overflow:clip; }
.manage-accordion > summary { position:relative; display:flex; align-items:center; gap:12px; padding:15px 52px 15px 15px; list-style:none; cursor:pointer; user-select:none; }
.manage-accordion > summary::-webkit-details-marker { display:none; }
.manage-accordion > summary::after { content:"Edit"; position:absolute; right:15px; color:var(--accent); font-size:11px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.manage-accordion[open] > summary::after { content:"Close"; }
.manage-accordion[open] > summary { background:rgba(255,255,255,.025); }
.manage-accordion .manage-title { width:100%; margin:0; }
.manage-body { padding:15px; border-top:1px solid var(--line); }
.permission-card { border:1px solid var(--line); border-radius:14px; background:#101317; overflow:hidden; }
.permission-card > summary { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:15px; list-style:none; cursor:pointer; font-weight:800; }
.permission-card > summary::-webkit-details-marker { display:none; }
.permission-card > summary::after { content:"Configure"; color:var(--accent); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.permission-card[open] > summary::after { content:"Close"; }
.permission-card form { padding:16px; border-top:1px solid var(--line); }
.integration-card { max-width:820px; }
.integration-status { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0; }
.integration-status > div { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:14px; border:1px solid var(--line); border-radius:12px; background:#101317; }
.filter-empty { display:none; margin:10px 0 0; color:var(--muted); }
[hidden] { display:none!important; }
@media (max-width:1000px){
  .hero,.pos-layout,.booking-layout,.dashboard-top{grid-template-columns:1fr}
  .grid,.grid.two,.grid.three{grid-template-columns:1fr}
  .pos-products{grid-template-columns:1fr 1fr}
  .admin-shell .app-header{display:block; padding:10px 12px;}
  .logo-wrap{margin-bottom:8px}
  nav{justify-content:flex-start; gap:6px;}
  .nav-main{justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; gap:6px; padding-bottom:4px; -webkit-overflow-scrolling:touch; scrollbar-width:none;}
  .nav-main::-webkit-scrollbar{display:none;}
  .nav-main > a,.nav-main > .nav-more{flex:0 0 auto;}
  .nav-main a{white-space:nowrap; font-size:14px; padding:8px 9px;}
  .nav-menu{left:0; right:auto;}
  .manage-grid,.manage-grid.three{grid-template-columns:1fr 1fr;}
  .inline{display:grid; grid-template-columns:1fr; gap:10px;}
  table{display:block;overflow-x:auto; -webkit-overflow-scrolling:touch;}
  .gallery{grid-template-columns:1fr}
  .hero-photo{min-height:240px}
  .week-head{display:block}.week-nav{justify-content:flex-start}.week-days{grid-template-columns:repeat(7,170px)}
  .section-toolbar{align-items:stretch;}
}
@media (max-width:700px){
  body{background:#0b0c10;}
  main{max-width:none; margin:10px 0; padding:0 8px;}
  header{position:sticky; top:0; z-index:20;}
  .logo-img{height:38px; max-width:160px; object-fit:contain;}
  .brand-text{font-size:12px; letter-spacing:.08em;}
  h1{font-size:clamp(34px,12vw,48px); line-height:1.02; margin-bottom:10px;}
  h2{font-size:22px;}
  .card{border-radius:15px; padding:14px; box-shadow:none;}
  .stat{padding:13px;}
  input, select, textarea, button, .button{min-height:44px; font-size:16px; border-radius:12px;}
  .public-booking,.public-services{max-width:none; margin-left:0; margin-right:0;}
  .pos-products{grid-template-columns:1fr; max-height:none; overflow:visible; padding-right:0;}
  .pos-cart{position:static;}
  .camera-box{min-height:220px;}
  .role-perms{grid-template-columns:1fr;}
  .manage-grid,.manage-grid.three{grid-template-columns:1fr;}
  .action-strip{display:grid; grid-template-columns:1fr;}
  .action-strip form{width:100%;}
  .action-strip .delete-form{width:100%;}
  .compact-action{display:grid; grid-template-columns:1fr;}
  th,td{padding:9px;}
  .footer{margin-top:16px; padding:14px 10px; font-size:12px;}
  .admin-shell .footer{display:grid; gap:5px;}
  .section-toolbar{display:grid;}
  .search-field{width:100%;}
  .search-field input{min-width:0;}
  .manage-accordion > summary{padding-right:48px;}
  .integration-status{grid-template-columns:1fr;}
  .empty-panel{min-height:165px; padding:20px;}
}
@media (max-width:420px){
  main{padding:0 6px;}
  .card{padding:11px;}
  .nav-main a{font-size:13px; padding:7px 8px;}
  .nav-more summary{font-size:13px; padding:7px 9px;}
  .grid{gap:10px;}
}
@media (max-width:1100px){
  .public-hero{grid-template-columns:1fr; min-height:0; padding-top:46px;}
  .public-hero-copy{max-width:850px;}
  .public-hero-media{min-height:520px;}
  .public-hero-media>img{min-height:520px;}
  .public-booking-layout{grid-template-columns:1fr;}
  .booking-context{max-width:760px;}
  .appearance-layout{grid-template-columns:1fr;}
  .preview-panel{position:static;}
  .public-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:700px){
  .public-shell .app-header{display:flex; align-items:center; padding:10px 14px;}
  .public-shell .logo-wrap{margin:0;}
  .public-shell .logo-img{height:38px; max-width:130px;}
  .public-shell .brand-text{font-size:13px;}
  .public-nav{justify-content:flex-end; padding:0; overflow:visible;}
  .public-nav a:first-child{display:none;}
  .public-nav .nav-book-link{font-size:13px; padding:9px 12px;}
  .public-shell .app-main{padding:0 12px 24px;}
  .public-hero{gap:28px; padding:38px 0 44px;}
  .public-hero-copy h1{font-size:clamp(48px,15vw,68px); margin:18px 0;}
  .public-lead{font-size:17px; line-height:1.55;}
  .hero-actions{margin:26px 0;}
  .public-details{display:grid; grid-template-columns:1fr 1fr; gap:18px; padding-top:22px;}
  .public-hero-media,.public-hero-media>img{min-height:390px;}
  .public-hero-media{border-radius:22px 22px 6px 22px;}
  .hero-badge{max-width:245px; padding:16px 18px;}
  .public-booking-layout{gap:26px; margin:8px 0 62px; padding:22px 14px; border-radius:22px;}
  .booking-context{padding:4px 6px;}
  .booking-context h2{font-size:48px;}
  .feature-mini{margin-top:24px;}
  .booking-card{padding:18px 14px; border-radius:16px;}
  .booking-card-head{margin-bottom:18px;}
  .booking-card-head h2{font-size:22px;}
  .public-services-section{padding-bottom:62px;}
  .public-products-section{padding-bottom:62px;}
  .section-heading{display:block;}
  .section-heading>p{margin-top:16px;}
  .public-service-card{grid-template-columns:36px 1fr auto; gap:10px; padding:18px 2px;}
  .public-service-card h3{font-size:17px;}
  .public-service-card>strong{font-size:19px;}
  .product-toolbar{grid-template-columns:1fr; padding:12px;}
  .public-product-grid{grid-template-columns:1fr;}
  .public-product-card h3{min-height:0;}
  .public-closing{display:grid; padding:24px 20px; border-radius:20px;}
  .public-closing .button{justify-self:start;}
  .public-shell .footer{display:grid; justify-items:center; gap:8px;}
  .page-heading{display:grid; align-items:start;}
  .page-heading .button{justify-self:start;}
  .appearance-form{padding:16px;}
  .media-editor-grid{grid-template-columns:1fr;}
  .media-preview{height:210px;}
  .editor-actions{display:grid;}
  .editor-actions button{width:100%;}
  .preview-toolbar{grid-template-columns:1fr auto;}
  .preview-toolbar>strong{display:none;}
  .site-preview{height:650px;}
}
@media print { body { background:white; } header, .footer, .no-print { display:none!important; } main { width:100%; margin:0; } .receipt { box-shadow:none; border:0; } }