/* ═══════════════════════════════════════════════════════
   TPC City Maribor – style.css
   MOBILE-FIRST · Outfit + Inter · Navy/Crimson palette
   Base = mobile, scale up with min-width queries
   ═══════════════════════════════════════════════════════ */

:root {
  --nav:#0f1f30; --nav-2:#1a3048; --bg:#f0f4f8; --bg-2:#e4eaf1;
  --surface:#f7f9fc; --card:#ffffff; --text:#0f1e2d; --muted:#5c6d7e;
  --line:#d4dce6; --accent:#d42b24; --accent-dk:#b01e18; --accent-lt:#fce8e7;
  --success:#1a9060; --warning:#c96b00; --info:#1768b0;
  --r-xl:16px; --r-lg:13px; --r-md:10px; --r-sm:7px;
  --shadow-sm:0 2px 8px rgba(15,31,48,.06);
  --shadow:0 8px 28px rgba(15,31,48,.10);
  --shadow-lg:0 20px 50px rgba(15,31,48,.14);
  --container:1320px;
  --font-head:'Outfit',sans-serif; --font-body:'Inter',sans-serif;
  --transition:.2s ease;
  --pad:16px;
}
@media(min-width:600px)  { :root { --r-xl:18px; --r-lg:14px; --r-md:11px; --pad:20px; } }
@media(min-width:900px)  { :root { --r-xl:20px; --r-lg:16px; --r-md:12px; --pad:24px; } }
@media(min-width:1100px) { :root { --r-xl:22px; --pad:28px; } }

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { font-family:var(--font-body); color:var(--text); background:var(--bg); line-height:1.6; min-height:100vh; }
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
button,input,textarea,select { font:inherit; }
h1,h2,h3,h4,h5 { font-family:var(--font-head); line-height:1.1; }

/* Layout */
.site-wrap { width:calc(100% - 16px); margin:0 auto; padding:10px 0 0; }
@media(min-width:700px)  { .site-wrap { width:calc(100% - 24px); padding:14px 0 0; } }
@media(min-width:1340px) { .site-wrap { width:var(--container); padding:16px 0 0; } }

/* TOPBAR */
.topbar { background:linear-gradient(160deg,var(--nav),var(--nav-2)); color:#fff; border-radius:var(--r-xl); box-shadow:var(--shadow-lg); border:1px solid rgba(255,255,255,.06); position:sticky; top:8px; z-index:100; }
.topbar-inner { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; gap:10px; flex-wrap:wrap; }
@media(min-width:700px) { .topbar-inner { padding:14px 20px; } }
.brand { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.brand-mark { width:38px; height:38px; border-radius:10px; background:var(--accent); display:grid; place-items:center; font-family:var(--font-head); font-weight:800; font-size:.88rem; color:#fff; flex-shrink:0; }
@media(min-width:700px) { .brand-mark { width:44px; height:44px; border-radius:12px; } }
.brand-logo { max-height:34px; width:auto; }
@media(min-width:700px) { .brand-logo { max-height:42px; } }
.brand-text strong { display:block; font-family:var(--font-head); font-weight:800; font-size:1.1rem; color:#fff; letter-spacing:.02em; }
@media(min-width:700px) { .brand-text strong { font-size:1.4rem; } }
.navlinks { display:none; flex-direction:column; gap:4px; width:100%; padding:10px 0 6px; order:10; }
.navlinks.nav-open { display:flex; }
@media(min-width:700px) { .navlinks { display:flex; flex-direction:row; width:auto; padding:0; order:0; } }
.navlinks a { padding:9px 14px; border-radius:var(--r-md); font-weight:600; font-size:.93rem; color:rgba(255,255,255,.82); transition:var(--transition); white-space:nowrap; }
.navlinks a:hover { background:rgba(255,255,255,.10); color:#fff; }
.navlinks a.active { background:var(--accent); color:#fff; }
.burger { display:flex; flex-direction:column; justify-content:center; gap:5px; width:38px; height:38px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:9px; cursor:pointer; padding:8px; }
.burger span { display:block; height:2px; background:#fff; border-radius:2px; transition:var(--transition); }
.burger[aria-expanded="true"] span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
@media(min-width:700px) { .burger { display:none; } }

/* HERO */
.hero { margin-top:12px; display:grid; grid-template-columns:1fr; background:linear-gradient(135deg,#e8f0f8,#dce7f2); border:1px solid var(--line); border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-lg); min-height:220px; }
@media(min-width:700px)  { .hero { min-height:320px; margin-top:16px; } }
@media(min-width:900px)  { .hero { grid-template-columns:1fr 1fr; min-height:420px; } }
@media(min-width:1100px) { .hero { min-height:460px; margin-top:20px; } }
.hero-copy { padding:24px 18px; display:flex; flex-direction:column; justify-content:center; gap:14px; }
@media(min-width:700px)  { .hero-copy { padding:36px 32px; gap:16px; } }
@media(min-width:1100px) { .hero-copy { padding:52px 44px; gap:18px; } }
.eyebrow { font-family:var(--font-head); font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.18em; color:var(--accent); }
.hero h1 { font-size:clamp(1.7rem,7vw,3.8rem); line-height:1.05; max-width:14ch; }
.hero h1 .accent { color:var(--accent); }
.hero p { color:var(--muted); font-size:clamp(.88rem,2.5vw,1.08rem); max-width:42ch; line-height:1.7; }
.hero-visual { display:none; }
@media(min-width:900px) { .hero-visual { display:flex; align-items:flex-end; justify-content:center; padding:24px 16px 0; overflow:hidden; } }
.hero-visual img { max-height:420px; width:100%; object-fit:contain; object-position:bottom; }

/* Building */
.hero-placeholder { width:100%; display:flex; align-items:flex-end; justify-content:center; }
.building-illustration { width:260px; }
.bld-body { display:flex; flex-direction:column; gap:3px; background:linear-gradient(180deg,#1a3252,#0f1f30); border-radius:14px 14px 0 0; padding:16px 16px 0; }
.bld-floor { display:flex; gap:4px; padding:8px 0; border-bottom:1px solid rgba(255,255,255,.06); }
.bld-window { flex:1; height:22px; border-radius:4px; background:rgba(255,220,80,.35); }
.bld-window:nth-child(even) { background:rgba(120,180,255,.25); }

/* BUTTONS */
.btnrow,.detail-actions { display:flex; gap:8px; flex-wrap:wrap; }
.card-actions { display:flex; gap:0; margin-top: 0; border-top: 1px solid var(--line); }
.card-actions .btn-sm {
  flex: 1;
  min-height: 38px;
  font-size: .78rem;
  border-radius: 0;
  border: none;
  text-align: center;
  justify-content: center;
  border-right: 1px solid var(--line);
}
.card-actions .btn-sm:last-child { border-right: none; }
.card-actions .btn-ghost { background: var(--surface); }
.card-actions .btn-primary { border-radius: 0; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:0 16px; border-radius:var(--r-md); font-family:var(--font-head); font-weight:700; font-size:.91rem; border:1px solid transparent; cursor:pointer; transition:var(--transition); white-space:nowrap; text-decoration:none; }
@media(min-width:700px) { .btn { padding:0 20px; } }
.btn-primary  { background:var(--accent); color:#fff; box-shadow:0 6px 18px rgba(212,43,36,.22); }
.btn-primary:hover  { background:var(--accent-dk); transform:translateY(-1px); }
.btn-secondary { background:#fff; color:var(--nav); border-color:var(--line); }
.btn-secondary:hover { border-color:#a0b2c4; background:var(--surface); }
.btn-ghost  { background:transparent; border-color:var(--line); color:var(--text); }
.btn-ghost:hover { background:var(--surface); }
.btn-success { background:var(--success); color:#fff; }
.btn-danger  { background:#e02020; color:#fff; }
.btn-warning { background:var(--warning); color:#fff; }
.btn-sm  { min-height:36px; padding:0 12px; font-size:.85rem; }
.btn-xs  { min-height:30px; padding:0 10px; font-size:.79rem; border-radius:8px; }
.btn-lg  { min-height:52px; padding:0 28px; font-size:1rem; }
.btn-block { width:100%; }

/* SECTIONS */
.section { margin-top:14px; background:rgba(255,255,255,.72); border-radius:var(--r-xl); border:1px solid rgba(210,220,232,.9); box-shadow:var(--shadow); overflow:hidden; backdrop-filter:blur(8px); }
@media(min-width:700px) { .section { margin-top:20px; } }
@media(min-width:1100px) { .section { margin-top:24px; } }
.section-head { padding:16px var(--pad) 12px; display:flex; justify-content:space-between; align-items:flex-end; gap:12px; flex-wrap:wrap; }
@media(min-width:700px) { .section-head { padding:22px var(--pad) 14px; } }
@media(min-width:1100px) { .section-head { padding:26px var(--pad) 16px; } }
.section-head h2 { font-size:clamp(1.15rem,3vw,1.9rem); }
.section-head p { color:var(--muted); margin-top:4px; font-size:.93rem; }

/* PAGE HERO */
.page-hero { margin-top:12px; background:linear-gradient(135deg,var(--nav),var(--nav-2)); border-radius:var(--r-xl); padding:22px 18px; color:#fff; box-shadow:var(--shadow-lg); }
@media(min-width:700px)  { .page-hero { padding:30px 28px; margin-top:16px; } }
@media(min-width:1100px) { .page-hero { padding:44px 40px; margin-top:20px; } }
.page-hero h1 { font-size:clamp(1.3rem,5vw,2.8rem); color:#fff; }
.page-hero p  { color:rgba(255,255,255,.72); margin-top:8px; font-size:clamp(.86rem,2vw,1.05rem); }

/* ═══════════════════════════════════════════════════
   FLOOR SECTIONS — enotni razmiki, mobile-first
   ═══════════════════════════════════════════════════ */
/* FLOOR SECTIONS — enotni razmiki za VSA nadstropja */
#storesContainer {
  display: flex;
  flex-direction: column;
}
.floor-section {
  padding: var(--pad) var(--pad) var(--pad);
}
.floor-section + .floor-section {
  padding-top: 28px;
  border-top: 2px solid var(--line);
}
@media(min-width:700px) {
  .floor-section + .floor-section { padding-top: 32px; }
}

.floor-badge {
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 16px; border-radius:999px;
  background:var(--nav); color:#fff;
  font-family:var(--font-head); font-weight:700; font-size:.82rem;
  letter-spacing:.05em; margin-bottom:14px;
  box-shadow:0 2px 8px rgba(15,31,48,.18);
}
@media(min-width:700px) { .floor-badge { padding:8px 20px; font-size:.85rem; margin-bottom:20px; } }

/* STORE GRID */
.stores-grid { display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:480px)  { .stores-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px)  { .stores-grid { grid-template-columns:repeat(3,1fr); gap:14px; } }
@media(min-width:1100px) { .stores-grid { grid-template-columns:repeat(4,1fr); gap:16px; } }
.store-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}
.store-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: #b8c8da; }

/* Logo box — fills most of the card */
.store-logo-box {
  flex: 1;
  min-height: 120px;
  background: linear-gradient(135deg, #f4f8fd, #eaf1f9);
  display: grid;
  place-items: center;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.store-logo-box img {
  max-height: 90px;
  max-width: calc(100% - 16px);
  width: calc(100% - 16px);
  height: auto;
  object-fit: contain;
  padding: 10px;
  transition: transform .25s ease;
}
.store-card:hover .store-logo-box img { transform: scale(1.05); }
.store-logo-box span {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 1.6rem;
  color: var(--nav-2);
}

/* Store info — compact bottom strip */
.store-info {
  padding: 9px 12px 7px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.store-info h3 {
  font-size: .88rem;
  margin: 0;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.store-info .tag {
  font-size: .72rem;
  padding: 1px 6px;
  border-radius: 4px;
  align-self: flex-start;
  line-height: 1.6;
}
.store-short-desc { display: none; }

/* TAGS */
.tag { display:inline-flex; align-items:center; gap:4px; padding:3px 8px; border-radius:999px; background:#eef3f8; border:1px solid #d4dde8; font-size:.75rem; font-weight:600; color:#3a5068; }
@media(min-width:700px) { .tag { padding:4px 10px; font-size:.78rem; } }
.tag-floor   { background:#f0f4e8; border-color:#c8d8b0; color:#3a5020; }
.tag-hours   { background:#f8f2e8; border-color:#e0c888; color:#6a4410; }
.tag-phone   { background:#e8f4f0; border-color:#a0c8b8; color:#1a5040; }
.tag-keyword { background:#eff0fe; border-color:#b8bcf0; color:#3038a0; font-size:.71rem; }
.tag-perm    { background:#e8f2e8; border-color:#a0c8a0; color:#1a6020; }
.tag-pinned  { background:#fef8e8; border-color:#e8d080; color:#806010; }
.tag-inactive{ background:#f8e8e8; border-color:#e0a8a8; color:#802020; }
.sdh-keywords{ display:flex; gap:5px; flex-wrap:wrap; margin-top:8px; }
.req { color:var(--accent); }

/* FEATURED */
.featured-grid { display:grid; grid-template-columns:1fr; gap:10px; padding:0 var(--pad) var(--pad); }
@media(min-width:500px)  { .featured-grid { grid-template-columns:repeat(2,1fr); gap:12px; } }
@media(min-width:1100px) { .featured-grid { grid-template-columns:repeat(3,1fr); gap:14px; } }
.featured-card { border-radius:var(--r-md); border:1px solid var(--line); background:var(--card); overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:row; align-items:stretch; transition:var(--transition); }
.featured-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); }
.featured-img { width:80px; flex-shrink:0; background:linear-gradient(135deg,#e8f0f8,#d4e0ec); overflow:hidden; position:relative; }
@media(min-width:700px) { .featured-img { width:96px; } }
.featured-img img { width:100%; height:100%; object-fit:cover; transition:.4s ease; }
.featured-card:hover .featured-img img { transform:scale(1.06); }
.img-placeholder { width:100%; height:100%; display:grid; place-items:center; font-size:2rem; }
.featured-body { padding:10px 12px; display:flex; flex-direction:column; gap:4px; flex:1; min-width:0; justify-content:center; }
.featured-body h3 { font-size:.88rem; font-weight:700; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.featured-body p { font-size:.77rem; color:var(--muted); line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.featured-body .btn { margin-top:6px; align-self:flex-start; min-height:28px; padding:0 10px; font-size:.75rem; border-radius:7px; }
.feat-location { font-size:.73rem; color:var(--muted); display:flex; align-items:center; gap:3px; }

/* EVENTS */
.events-strip { display:grid; grid-template-columns:1fr; gap:12px; padding:0 var(--pad) var(--pad); }
@media(min-width:600px)  { .events-strip { grid-template-columns:repeat(2,1fr); gap:14px; } }
@media(min-width:1100px) { .events-strip { grid-template-columns:repeat(3,1fr); gap:20px; } }
.event-card { background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow-sm); transition:var(--transition); }
.event-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); }
.event-img { aspect-ratio:16/10; background:linear-gradient(135deg,#e8f0f8,#d8e8f8); overflow:hidden; position:relative; }
.event-img img { width:100%; height:100%; object-fit:cover; }
.pin-badge { position:absolute; top:10px; left:10px; background:rgba(15,31,48,.85); color:#fff; font-size:.72rem; font-weight:700; padding:4px 10px; border-radius:999px; backdrop-filter:blur(4px); }
.event-body { padding:14px; display:flex; flex-direction:column; gap:7px; flex:1; }
@media(min-width:700px) { .event-body { padding:18px; gap:8px; } }
.event-body h3 { font-size:.95rem; }
.event-desc { font-size:.86rem; color:var(--muted); line-height:1.5; flex:1; }

/* Events list */
.events-list { display:grid; gap:14px; margin-top:14px; }
@media(min-width:700px) { .events-list { gap:20px; margin-top:20px; } }
.event-full-card { display:grid; grid-template-columns:1fr; background:var(--card); border:1px solid var(--line); border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-sm); transition:var(--transition); }
@media(min-width:700px) { .event-full-card { grid-template-columns:260px 1fr; } }
@media(min-width:1100px) { .event-full-card { grid-template-columns:300px 1fr; } }
.event-full-card:hover { box-shadow:var(--shadow); }
.event-full-card.event-pinned { border-color:#e8d888; }
.efc-img { aspect-ratio:16/9; overflow:hidden; background:#e0e8f2; position:relative; }
@media(min-width:700px) { .efc-img { aspect-ratio:4/3; } }
.efc-img img { width:100%; height:100%; object-fit:cover; }
.img-placeholder-lg { width:100%; height:100%; display:grid; place-items:center; font-size:4rem; }
.efc-body { padding:18px; display:flex; flex-direction:column; gap:10px; justify-content:center; }
@media(min-width:700px)  { .efc-body { padding:24px 28px; } }
@media(min-width:1100px) { .efc-body { padding:28px 32px; } }
.efc-body h2 { font-size:clamp(1.05rem,3vw,1.4rem); }
.efc-desc { color:var(--muted); font-size:.92rem; line-height:1.6; }

/* Event detail */
.event-detail-wrap { margin-top:14px; }
.event-detail-cover { border-radius:var(--r-xl); overflow:hidden; margin-bottom:14px; max-height:280px; }
@media(min-width:700px) { .event-detail-cover { max-height:420px; margin-bottom:20px; } }
@media(min-width:1100px) { .event-detail-cover { max-height:460px; } }
.event-detail-cover img { width:100%; height:100%; object-fit:cover; }
.event-detail-body { background:var(--card); border-radius:var(--r-xl); border:1px solid var(--line); padding:18px; box-shadow:var(--shadow); }
@media(min-width:700px)  { .event-detail-body { padding:28px 32px; } }
@media(min-width:1100px) { .event-detail-body { padding:36px 40px; } }
.event-meta-row { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.event-detail-body h1 { font-size:clamp(1.35rem,5vw,2.6rem); margin-bottom:14px; }
.event-full-desc { color:var(--muted); line-height:1.8; font-size:clamp(.92rem,2vw,1.05rem); }
.event-btn-row { margin-top:18px; }
.back-link { margin-top:14px; }

/* CONTACT */
.contact-layout { display:grid; grid-template-columns:1fr; gap:16px; padding:0 var(--pad) var(--pad); }
@media(min-width:900px)  { .contact-layout { grid-template-columns:300px 1fr; gap:24px; } }
@media(min-width:1100px) { .contact-layout { grid-template-columns:340px 1fr; } }
.contact-info { display:flex; flex-direction:column; gap:10px; }
.ci-row { display:flex; align-items:flex-start; gap:12px; padding:13px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); }
@media(min-width:700px) { .ci-row { padding:16px; gap:14px; } }
.ci-icon { font-size:1.2rem; flex-shrink:0; margin-top:2px; }
.ci-row strong { display:block; font-family:var(--font-head); font-size:.9rem; }
.ci-row p { color:var(--muted); font-size:.88rem; margin-top:2px; }
.ci-row a:hover { color:var(--accent); }
.contact-form-wrap h3 { font-size:1.1rem; margin-bottom:14px; }

/* FORMS */
.form-grid,.admin-form { display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:600px) { .form-grid { grid-template-columns:1fr 1fr; } }
.field-full { grid-column:1/-1; }
.field { display:flex; flex-direction:column; gap:6px; }
.field label { font-family:var(--font-head); font-weight:700; font-size:.86rem; color:#2d4055; }
.field input:not([type="checkbox"]):not([type="radio"]),.field textarea,.field select { width:100%; min-height:44px; padding:10px 14px; border-radius:var(--r-md); border:1.5px solid var(--line); background:#fff; color:var(--text); font-size:.94rem; transition:var(--transition); appearance:none; }
.field input:not([type="checkbox"]):not([type="radio"]):focus,.field textarea:focus,.field select:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(212,43,36,.10); }
.field textarea { min-height:110px; resize:vertical; line-height:1.6; }
.field-hint { font-size:.81rem; color:var(--muted); margin-top:2px; }
.field-row { display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:600px) { .field-row { grid-template-columns:1fr 1fr; gap:14px; } }
.checkbox-label { display:flex; align-items:center; gap:8px; cursor:pointer; font-weight:600; font-size:.9rem; }
.checkbox-label input[type="checkbox"] { width:16px; height:16px; accent-color:var(--accent); }
.checkboxes-row { display:flex; gap:14px; flex-wrap:wrap; padding:4px 0; }

/* NOTICES */
.notice,.notice-success,.notice-info { padding:11px 15px; border-radius:var(--r-md); font-weight:600; font-size:.91rem; }
.notice-success { background:#eafaf2; border:1px solid #a0d8b8; color:#1a6040; }
.notice-info    { background:#e8f2fc; border:1px solid #a0c8e8; color:#1a4870; }
.notice-warning { background:#fef8e8; border:1px solid #e8d080; color:#806010; }

/* BREADCRUMB */
.breadcrumb-nav { display:flex; align-items:center; gap:6px; padding:10px 0 4px; font-size:.85rem; color:var(--muted); flex-wrap:wrap; }
.breadcrumb-nav a:hover { color:var(--accent); }

/* STORE DETAIL */
.store-detail-wrap { margin-top:8px; display:flex; flex-direction:column; gap:14px; padding-bottom:28px; }
@media(min-width:700px) { .store-detail-wrap { gap:20px; padding-bottom:40px; } }
.store-detail-header { display:flex; flex-direction:column; gap:14px; background:var(--card); border:1px solid var(--line); border-radius:var(--r-xl); padding:18px; box-shadow:var(--shadow); }
@media(min-width:600px) { .store-detail-header { flex-direction:row; align-items:flex-start; padding:22px 26px; } }
@media(min-width:1100px) { .store-detail-header { padding:28px 32px; } }
.sdh-logo { width:68px; height:68px; border-radius:12px; background:linear-gradient(135deg,#f0f6fc,#e4eef8); border:1px solid var(--line); display:grid; place-items:center; flex-shrink:0; overflow:hidden; align-self:flex-start; }
@media(min-width:700px) { .sdh-logo { width:88px; height:88px; border-radius:18px; } }
.sdh-logo img { max-width:54px; max-height:54px; object-fit:contain; }
@media(min-width:700px) { .sdh-logo img { max-width:70px; max-height:70px; } }
.sdh-logo span { font-family:var(--font-head); font-weight:800; font-size:1.4rem; color:var(--nav-2); }
.sdh-info { flex:1; }
.sdh-info h1 { font-size:clamp(1.25rem,5vw,2.2rem); margin-bottom:8px; }
.sdh-meta { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:6px; }
.sdh-short-desc { font-size:.92rem; color:var(--muted); margin:6px 0 0; max-width:60ch; line-height:1.5; }
.sdh-keywords-inline { display:flex; gap:5px; flex-wrap:wrap; margin-top:8px; }
.sdh-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }

/* Large logo on right side of store header */
.sdh-logo-right {
  display: none;
  flex-shrink: 0;
  align-self: center;
  width: 140px;
  height: 100px;
  border-radius: 14px;
  background: linear-gradient(135deg, #f4f8fc, #eaf0f8);
  border: 1px solid var(--line);
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 10px;
}
.sdh-logo-right img {
  max-width: 120px;
  max-height: 80px;
  width: auto;
  height: auto;
  object-fit: contain;
}
@media(min-width:700px) {
  .sdh-logo-right {
    display: grid;
    width: 160px;
    height: 110px;
  }
  .sdh-logo-right img { max-width: 140px; max-height: 90px; }
}
@media(min-width:1100px) {
  .sdh-logo-right { width: 180px; height: 120px; }
  .sdh-logo-right img { max-width: 160px; max-height: 100px; }
}
.store-description { padding:0 var(--pad) var(--pad); color:var(--muted); line-height:1.8; font-size:.97rem; }
.store-keywords {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  padding: 4px var(--pad) 14px;
  /* ensure tags don't touch edges on any screen size */
  box-sizing: border-box;
}
.store-keywords .tag-keyword {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-shrink: 1;
}
.store-cover {
  border-radius: var(--r-xl);
  overflow: hidden;
  background: #f0f4f8;
}
.store-cover img {
  width: 100%;
  height: auto;
  max-height: 520px;
  object-fit: contain;
  object-position: center;
  display: block;
}

/* Cover znotraj description kartice — levo od besedila */
.store-cover-inline {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  padding: 0 var(--pad) 20px;
}
.store-cover-inline-img {
  flex-shrink: 0;
  width: 160px;
  border-radius: var(--r-lg);
  overflow: hidden;
  background: #f4f8fc;
  border: 1px solid var(--line);
}
@media(min-width:600px)  { .store-cover-inline-img { width: 200px; } }
@media(min-width:900px)  { .store-cover-inline-img { width: 260px; } }
.store-cover-inline-img img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}
.store-cover-inline-text {
  flex: 1;
  min-width: 0;
}

/* Gallery */
.store-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; padding:0 var(--pad) var(--pad); }
@media(min-width:600px)  { .store-gallery { grid-template-columns:repeat(4,1fr); gap:7px; } }
@media(min-width:1100px) { .store-gallery { grid-template-columns:repeat(5,1fr); gap:8px; } }
.store-gallery-compact { grid-template-columns:repeat(4,1fr); }
@media(min-width:600px)  { .store-gallery-compact { grid-template-columns:repeat(5,1fr); } }
@media(min-width:900px)  { .store-gallery-compact { grid-template-columns:repeat(6,1fr); } }
.gallery-item { border-radius:var(--r-sm); overflow:hidden; cursor:pointer; position:relative; aspect-ratio:1/1; background:#e0e8f0; }
@media(min-width:700px) { .gallery-item { border-radius:var(--r-md); } }
.gallery-item img { width:100%; height:100%; object-fit:cover; object-position:center; transition:.3s ease; }
.gallery-item:hover img { transform:scale(1.05); }
.gallery-caption { position:absolute; bottom:0; left:0; right:0; background:rgba(15,31,48,.7); color:#fff; font-size:.73rem; padding:5px 8px; backdrop-filter:blur(4px); }

/* Lightbox */
.lightbox { position:fixed; inset:0; z-index:1000; background:rgba(8,18,28,.92); display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .2s; }
.lightbox.is-open { opacity:1; pointer-events:all; }
.lb-content img { max-width:92vw; max-height:88vh; border-radius:var(--r-lg); }
.lb-close,.lb-prev,.lb-next { position:absolute; background:rgba(255,255,255,.1); color:#fff; border:1px solid rgba(255,255,255,.2); border-radius:50%; width:42px; height:42px; display:grid; place-items:center; font-size:1.3rem; cursor:pointer; transition:var(--transition); }
.lb-close:hover,.lb-prev:hover,.lb-next:hover { background:rgba(255,255,255,.25); }
.lb-close { top:16px; right:16px; }
.lb-prev  { left:10px; top:50%; transform:translateY(-50%); }
.lb-next  { right:10px; top:50%; transform:translateY(-50%); }

/* Offers */
/* ── OFFERS GRID ─────────────────────────────────────────── */
.offers-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 0 var(--pad) var(--pad);
}
@media(min-width:480px)  { .offers-grid { grid-template-columns: repeat(2, 1fr); } }
@media(min-width:900px)  { .offers-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
@media(min-width:1200px) { .offers-grid { grid-template-columns: repeat(4, 1fr); } }

.offer-card {
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  /* NO transform here — iOS Safari blocks clicks on children when
     parent has transform+overflow:hidden */
}
.offer-card:hover { box-shadow: var(--shadow); border-color: #b8c8da; }
.offer-card.offer-color-1 { background: linear-gradient(160deg, #fde8e6 0%, #fdf5f5 100%); }
.offer-card.offer-color-2 { background: linear-gradient(160deg, #e6f4ed 0%, #f0faf5 100%); }
.offer-card.offer-color-3 { background: linear-gradient(160deg, #fef6e6 0%, #fdfbf0 100%); }

/* Square image */
.offer-img-wrap {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  flex-shrink: 0;
  background: rgba(255,255,255,.5);
}
.offer-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .3s ease;
}
.offer-card:hover .offer-img-wrap img { transform: scale(1.04); }
.offer-img-placeholder {
  width: 100%; height: 100%;
  display: grid; place-items: center;
  font-size: 2.5rem;
  color: var(--muted);
}

/* Card body — flex-grow so all cards same height */
.offer-body {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
@media(min-width:700px) { .offer-body { padding: 14px; } }

.offer-title {
  font-size: .92rem;
  font-weight: 700;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.offer-valid {
  font-size: .76rem;
  color: var(--muted);
  font-weight: 600;
}

/* Push actions to bottom */
.offer-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 8px;
}
.offer-actions .btn { flex: 1; text-align: center; font-size: .8rem; min-height: 44px; padding: 0 10px; touch-action: manipulation; cursor: pointer; }

/* ── OFFER POPUP ─────────────────────────────────────────── */
/* ── OFFER POPUP ─────────────────────────────────────────── */
.offer-popup-overlay {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(8,18,28,.75);
  display: flex; align-items: flex-end; justify-content: center;
  padding: 0;
  opacity: 0; pointer-events: none;
  transition: opacity .25s ease;
  backdrop-filter: blur(6px);
}
@media(min-width:600px) {
  .offer-popup-overlay { align-items: center; padding: 20px; }
}
.offer-popup-overlay.is-open { opacity: 1; pointer-events: all; }

.offer-popup {
  background: #fff;
  border-radius: var(--r-xl) var(--r-xl) 0 0;
  width: 100%;
  max-height: 92vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  position: relative;
  box-shadow: 0 -8px 40px rgba(8,18,28,.2);
  transform: translateY(100%);
  transition: transform .3s cubic-bezier(.22,.8,.32,1);
  display: flex;
  flex-direction: column;
}
@media(min-width:600px) {
  .offer-popup {
    border-radius: var(--r-xl);
    max-width: 760px;
    max-height: 88vh;
    box-shadow: var(--shadow-lg);
    transform: translateY(20px) scale(.97);
    overflow: hidden;
  }
}
.offer-popup-overlay.is-open .offer-popup {
  transform: translateY(0) scale(1);
}

/* Close button */
.offer-popup-close {
  position: absolute; top: 12px; right: 12px;
  width: 36px; height: 36px;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(0,0,0,.1);
  border-radius: 50%;
  font-size: 1.1rem; font-weight: 700;
  cursor: pointer; display: grid; place-items: center;
  color: var(--text); transition: var(--transition);
  z-index: 10;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.offer-popup-close:hover { background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.2); }

/* Inner: image left + content right on desktop */
.offer-popup-inner {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  /* on mobile the popup itself scrolls */
}
@media(min-width:600px) {
  .offer-popup-inner {
    flex-direction: row;
    overflow: hidden;
    flex: 1;
    min-height: 0;
  }
}

/* Image column */
.offer-popup-img-col {
  width: 100%;
  flex-shrink: 0;
  background: #f0f4f8;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.offer-popup-img-col img {
  width: 100%;
  max-height: 52vw;
  object-fit: contain;
  object-position: center;
  display: block;
}
@media(min-width:600px) {
  .offer-popup-img-col {
    width: 44%;
    min-height: 0;
    max-height: none;
    align-self: stretch;
  }
  .offer-popup-img-col img {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
    object-position: center;
  }
}
@media(min-width:900px) {
  .offer-popup-img-col { width: 42%; }
}
.offer-popup-img-col:empty { display: none; }

/* Content column */
.offer-popup-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 20px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  gap: 12px;
  min-height: 0;
}
@media(min-width:600px) { .offer-popup-content { padding: 28px 28px 24px; gap: 14px; } }
@media(min-width:900px) { .offer-popup-content { padding: 32px 32px 28px; } }

/* Badge: valid date */
.offer-popup-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #fef8e8;
  border: 1px solid #e8d080;
  color: #806010;
  border-radius: 999px;
  padding: 4px 12px;
  font-size: .78rem;
  font-weight: 700;
  align-self: flex-start;
}

/* Title */
.offer-popup-title {
  font-size: clamp(1.1rem, 4vw, 1.5rem);
  line-height: 1.2;
  color: var(--text);
  padding-right: 20px;
}
@media(min-width:600px) { .offer-popup-title { padding-right: 0; } }

/* Description with scroll */
.offer-popup-desc-scroll {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}
.offer-popup-desc {
  font-size: .93rem;
  color: var(--muted);
  line-height: 1.75;
  white-space: pre-wrap;
}

/* Actions pinned to bottom */
.offer-popup-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 8px;
  border-top: 1px solid var(--line);
  margin-top: auto;
}
.offer-popup-actions .btn {
  flex: 1;
  min-width: 120px;
  text-align: center;
  justify-content: center;
}

/* Disclaimer */
.store-disclaimer { display:flex; align-items:flex-start; gap:10px; background:#f4f8fc; border:1px solid #d0dcea; border-left:4px solid var(--info); border-radius:var(--r-md); padding:12px 14px; font-size:.85rem; color:var(--muted); line-height:1.6; }
.disclaimer-icon { font-size:1rem; flex-shrink:0; margin-top:2px; }

/* Contact form store */
.contact-form-grid { display:grid; grid-template-columns:1fr; gap:12px; padding:0 var(--pad) var(--pad); }
@media(min-width:600px) { .contact-form-grid { grid-template-columns:1fr 1fr; gap:14px; } }

/* FILTER BAR */
.filter-bar { display:flex; align-items:stretch; gap:8px; flex-wrap:wrap; padding:12px var(--pad) 14px; }
@media(min-width:700px) { .filter-bar { gap:12px; padding:16px var(--pad) 20px; align-items:center; } }
.filter-input,.filter-select { height:42px; padding:0 12px; border-radius:var(--r-md); border:1.5px solid var(--line); background:#fff; font-size:.9rem; color:var(--text); width:100%; transition:var(--transition); appearance:none; }
@media(min-width:600px) { .filter-input { width:220px; } .filter-select { width:auto; min-width:140px; } }
.filter-input:focus,.filter-select:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(212,43,36,.10); }
.filter-count { font-size:.86rem; color:var(--muted); }
@media(min-width:700px) { .filter-count { margin-left:auto; } }

/* Empty state */
.empty-state { text-align:center; padding:36px 16px; }
@media(min-width:700px) { .empty-state { padding:60px 24px; } }
.empty-icon { font-size:2.8rem; margin-bottom:12px; }
.empty-state h3 { font-size:1.2rem; margin-bottom:8px; }
.empty-state p { color:var(--muted); }

/* FOOTER */
.footer { margin-top:14px; margin-bottom:10px; background:linear-gradient(160deg,var(--nav),#0a1620); border-radius:var(--r-xl); color:rgba(255,255,255,.75); box-shadow:var(--shadow-lg); }
@media(min-width:700px) { .footer { margin-top:20px; margin-bottom:16px; } }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:11px 14px; flex-wrap:wrap; }
@media(min-width:700px) { .footer-inner { padding:14px 24px; gap:16px; } }
.footer-left  { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.footer-right { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
@media(min-width:700px) { .footer-right { gap:16px; } }
.footer-logo { max-height:24px; width:auto; opacity:.9; }
.footer-name { font-weight:700; font-size:.85rem; color:rgba(255,255,255,.9); }
.footer-sep  { color:rgba(255,255,255,.25); font-size:.78rem; }
.footer-item { font-size:.82rem; color:rgba(255,255,255,.7); text-decoration:none; transition:var(--transition); white-space:nowrap; }
a.footer-item:hover { color:#fff; }
.footer-partner-link { font-size:.65rem; color:rgba(255,255,255,.15); letter-spacing:.06em; text-decoration:none; transition:var(--transition); margin-left:4px; }
.footer-partner-link:hover { color:rgba(255,255,255,.4); }

/* AUTH */
.auth-body { background:linear-gradient(135deg,#0f1f30,#1e3a58); min-height:100vh; display:flex; align-items:center; justify-content:center; padding:16px; }
.auth-page { width:100%; max-width:420px; }
.auth-card { background:#fff; border-radius:var(--r-xl); box-shadow:var(--shadow-lg); padding:22px 18px; }
@media(min-width:480px) { .auth-card { padding:30px 26px; } }
@media(min-width:700px) { .auth-card { padding:36px 32px; } }
.auth-brand { display:flex; align-items:center; gap:12px; margin-bottom:20px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.auth-logo-mark { width:44px; height:44px; border-radius:11px; background:var(--accent); display:grid; place-items:center; font-family:var(--font-head); font-weight:800; color:#fff; font-size:.88rem; flex-shrink:0; }
@media(min-width:700px) { .auth-logo-mark { width:52px; height:52px; } }
.admin-mark   { background:var(--nav); }
.partner-mark { background:#1a6040; }
.auth-brand strong { display:block; font-family:var(--font-head); font-weight:800; font-size:1rem; }
.auth-brand span   { font-size:.81rem; color:var(--muted); }
.auth-card h1 { font-size:1.35rem; margin-bottom:5px; }
@media(min-width:700px) { .auth-card h1 { font-size:1.5rem; } }
.auth-subtitle { color:var(--muted); font-size:.9rem; margin-bottom:16px; }
.auth-form { display:flex; flex-direction:column; gap:13px; }
.auth-note { text-align:center; font-size:.86rem; color:var(--muted); margin-top:16px; }
.auth-note a { color:var(--accent); }
.form-error { background:#fde8e8; border:1px solid #e0a0a0; color:#8a1818; padding:10px 14px; border-radius:var(--r-md); font-size:.88rem; margin-bottom:4px; }
.register-success { text-align:center; padding:10px 0; }
.rs-icon { font-size:2.8rem; margin-bottom:12px; }
.rs-note { font-size:.83rem; color:var(--muted); margin-top:10px; }
.field-row.two-col { display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:480px) { .field-row.two-col { grid-template-columns:1fr 1fr; gap:14px; } }

/* Scroll reveal */
.reveal-on-scroll { opacity:0; transform:translateY(18px); transition:opacity .45s ease,transform .45s ease; }
.reveal-on-scroll.revealed { opacity:1; transform:translateY(0); }
.stores-grid .reveal-on-scroll:nth-child(2) { transition-delay:.05s; }
.stores-grid .reveal-on-scroll:nth-child(3) { transition-delay:.10s; }
.stores-grid .reveal-on-scroll:nth-child(4) { transition-delay:.15s; }
.featured-grid .reveal-on-scroll:nth-child(2) { transition-delay:.08s; }
.featured-grid .reveal-on-scroll:nth-child(3) { transition-delay:.16s; }
.events-strip .reveal-on-scroll:nth-child(2) { transition-delay:.08s; }
.events-strip .reveal-on-scroll:nth-child(3) { transition-delay:.16s; }

/* Admin img preview */
.admin-img-preview { max-height:52px; max-width:200px; width:auto; object-fit:contain; border-radius:7px; margin-bottom:8px; display:block; border:1px solid #e0e8f0; padding:4px; background:#f8fafc; }

/* Partner views stats */
.views-stats-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
@media(min-width:600px) { .views-stats-grid { grid-template-columns:repeat(3,1fr); } }
.vs-item { background:var(--card); padding:14px; text-align:center; }
@media(min-width:700px) { .vs-item { padding:20px 24px; } }
.vs-total { background:#f0f6ff; grid-column:1/-1; }
@media(min-width:600px) { .vs-total { grid-column:auto; } }
.vs-num { font-family:var(--font-head); font-size:1.6rem; font-weight:800; color:var(--nav-2); line-height:1; margin-bottom:5px; }
@media(min-width:700px) { .vs-num { font-size:2rem; } }
.vs-total .vs-num { color:#1a5090; }
.vs-label { font-size:.79rem; color:var(--muted); font-weight:600; }

/* GDPR checkbox */
.gdpr-label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  font-size: .88rem;
  color: var(--muted);
  line-height: 1.5;
}
.gdpr-check {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin-top: 2px;
  accent-color: var(--accent);
  cursor: pointer;
}

/* Honeypot: hide from real users */
.hp-field {
  position: absolute;
  left: -9999px;
  top: -9999px;
  opacity: 0;
  height: 0;
  overflow: hidden;
  pointer-events: none;
}

/* ── STORE LINKS (gumbi pod opisom) ─────────────────────────────────────── */
.store-links {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding: 4px var(--pad) 16px;
}
.store-link-btn {
  display: inline-flex;
  align-items: center;
  padding: 10px 22px;
  border-radius: var(--r-md);
  color: #fff;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .92rem;
  text-decoration: none;
  transition: var(--transition);
  box-shadow: 0 3px 10px rgba(0,0,0,.15);
}
.store-link-btn:hover { opacity: .88; transform: translateY(-1px); box-shadow: 0 5px 16px rgba(0,0,0,.2); }
