/* ===== Validare – Clean Theme ===== */

/* Global text colours */
body, p, li, h1, h2, h3, h4, h5, h6 { color: #fff; }
.card p, .card li, .card h2, .card h3, .card h4 { color: #222; }

:root { --brand:#0b1320; --accent:#009688; }

* { box-sizing:border-box }
html, body { width:100%; min-height:100vh; display:flex; flex-direction:column; }
body {
  margin:0;
  font-family: Arial, Helvetica, sans-serif;
  line-height:1.6;
  overflow-x:hidden;                     /* stop sideways scroll on phones */
  background: linear-gradient(rgba(11,19,32,.55), rgba(11,19,32,.55)),
              url('/files/bg-hands.png') center/cover no-repeat fixed;
}
a { color:#fff; }
img { max-width:100%; height:auto; display:block; }   /* ensure images (logo) render */

/* ===== Header / Nav ===== */
header, footer { background:var(--brand); color:#fff; }
header { position:relative; z-index:20; }             /* keep menu clickable */
header.open .primary { display:flex; }

.container {
  max-width:1100px;
  margin:auto;
  padding:1rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
}

.logo { display:flex; align-items:center; gap:.5rem; text-decoration:none }
.logo img { height:58px; width:auto; background:transparent }   /* mobile-default logo (fixes 'disappeared') */

/* Larger logo on desktop */
@media (min-width: 901px) {
  .logo img { height: 90px; }
}

nav.primary { display:flex; align-items:center; gap:.6rem; }
nav.primary a { color:#fff; padding:.4rem .6rem; border-radius:.5rem; text-decoration:none; font-weight:700; }
nav.primary a:hover, nav.primary a:focus { background:rgba(255,255,255,.1); outline:none }

/* Mobile menu button */
.menu-btn {
  display:none;
  background:transparent;
  border:1px solid rgba(255,255,255,.35);
  color:#fff;
  padding:.45rem .7rem;
  border-radius:.6rem;
  font-weight:700;
}
.menu-btn:focus { outline:2px solid #fff; outline-offset:2px }

/* Mobile nav layout */
@media (max-width: 900px) {
  .menu-btn { display:inline-block }
  nav.primary { display:none }
  header.open nav.primary {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:.25rem;
    width:100%;
    margin-top:.75rem;
  }
  header.open .container { flex-direction:column; align-items:stretch }
  nav.primary a {
    width:100%;
    padding:.6rem .7rem;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.12);
  }
  .logo img { height:58px }      /* keep logo visible on phones */
  .hero { padding:3rem 1rem }
  .hero p { font-size:1rem }
  .container { padding:.8rem 1rem }
}

/* ===== Page / Cards / Forms ===== */
.hero { padding:4rem 1rem; text-align:center; background:transparent; color:#eaf6ff; }
.hero h1 { font-size:clamp(1.6rem, 2.5vw + 1rem, 2.4rem); margin:0 0 .6rem; line-height:1.2 }
.hero p { max-width:720px; margin:0 auto 1rem; color:#d7e9ff; font-size:1.05rem; }
.page { max-width:1100px; margin:0 auto; padding:2rem 1rem; flex:1; }
.cols { display:grid; gap:1rem; }
@media(min-width:800px){ .cols { grid-template-columns: 1.2fr 1fr; } }

.card {
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:1rem 1.2rem;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
}
.list { margin:.5rem 0 0; padding-left:1.1rem; }
.list li { margin:.35rem 0; }
.cta { display:inline-block; background:var(--accent); color:#fff; padding:.75rem 1.2rem; border-radius:10px; text-decoration:none; font-weight:700; }
.cta:hover, .cta:focus { background:#00796b; outline:none }
.muted { color:#e6f0ff; font-size:.95rem; }

/* Forms: vertical stack */
form { max-width:400px; margin:auto; display:flex; flex-direction:column; gap:.75rem; }
form input, form textarea, form select { padding:.6rem; border:1px solid #ccc; border-radius:6px; font-size:1rem; width:100%; color:#222; }
form button { align-self:flex-start; }

/* Checkbox alignment */
form input[type="checkbox"] { width:auto; display:inline-block; height:auto; margin:0; }
.muted.consented { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.muted.consented label { display:flex; align-items:center; gap:.5rem; margin:0; }
.muted.consented input[type="checkbox"] { margin:0; }

/* Make links readable inside white cards (e.g., Cookie Policy link) */
.card a { color: var(--accent); text-decoration: underline; font-weight: 600; }
.card a:hover, .card a:focus { filter: brightness(0.9); outline: none; }

/* ===== Footer (uniform across ALL pages) ===== */
footer { margin-top:auto; }  /* stick to bottom when content short */
footer .footer-wrap {
  display:flex;
  flex-direction:row;         /* single line on desktop */
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  flex-wrap:wrap;             /* wrap only if truly needed */
}
footer .footer-links {
  display:flex;
  flex-direction:row;
  gap:12px;
  flex-wrap:wrap;
}
footer .footer-links a { color:#fff; text-decoration:none; }

/* On small phones, allow stacking neatly (prevents mess/overflow and keeps all pages consistent) */
@media (max-width: 600px) {
  footer .footer-wrap {
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:.4rem;
  }
}

/* Avoid cookie banner overlap */
body.with-cookie-banner footer { margin-bottom:84px; }
@media (max-width:700px){ body.with-cookie-banner footer { margin-bottom:112px; } }

/* ===== Tables (Cookies/Prices) ===== */
.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid #e5e7eb;border-radius:10px;background:#fff}
.cookie-table, .price-table { width:100%; border-collapse:collapse }
.cookie-table th, .cookie-table td,
.price-table th, .price-table td {
  padding:.6rem; text-align:left; border-bottom:1px solid #f0f2f5; white-space:nowrap; color:#222;
}
.price-table .ar { text-align:right }

/* Mobile stacked rows for data tables */
@media(max-width:700px){
  .table-responsive{border:none;background:transparent}
  .cookie-table, .price-table { border-collapse:separate; border-spacing:0 10px }
  .cookie-table thead, .price-table thead { display:none }
  .cookie-table tr, .price-table tr {
    display:block; background:#fff; border:1px solid #e5e7eb; border-radius:12px;
    box-shadow:0 2px 6px rgba(0,0,0,.04); overflow:hidden
  }
  .cookie-table td, .price-table td {
    display:flex; justify-content:space-between; align-items:flex-start; gap:.75rem;
    padding:.75rem .9rem; white-space:normal; border-bottom:1px solid #f3f4f6
  }
  .cookie-table td:last-child, .price-table td:last-child { border-bottom:none }
  .cookie-table td::before, .price-table td::before { content:attr(data-label); font-weight:700; color:#111 }
  .price-table .ar { text-align:left } /* in stacked mode, align left */
}
@media(max-width:420px){ .cookie-table td, .price-table td { padding:.65rem .75rem } }

/* ===== Cookie banner ===== */
:root{--cookie-bg:#0b1320;--cookie-ink:#fff;--cookie-accent:#009688}
#cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:var(--cookie-bg);color:var(--cookie-ink)}
#cookie-banner .cb-wrap{max-width:1100px;margin:0 auto;padding:calc(.85rem + env(safe-area-inset-bottom)) 1rem .95rem;display:grid;grid-template-columns:1fr auto;gap:.75rem;align-items:center}
#cookie-banner p{margin:0;font-size:.95rem;opacity:.95}
#cookie-banner .cb-actions{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}
#cookie-banner .btn{border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;padding:.6rem .9rem;border-radius:.6rem;cursor:pointer;font-weight:700}
#cookie-banner .btn.primary{background:var(--cookie-accent);border-color:var(--cookie-accent)}
#cookie-banner a{color:#cfe8ff;text-decoration:underline}

@media(max-width:720px){
  #cookie-banner .cb-wrap{grid-template-columns:1fr;gap:.6rem}
  #cookie-banner .cb-actions{display:grid;grid-template-columns:1fr;gap:.5rem;justify-content:stretch}
  #cookie-banner .btn{width:100%;text-align:center;padding:.8rem 1rem}
}

/* Cookie settings panel tweaks */
#cookie-panel{position:fixed;inset:0;display:none;z-index:10000;align-items:center;justify-content:center;background:rgba(0,0,0,.45)}
#cookie-panel.show{display:flex}
#cookie-panel .panel{width:min(560px,94vw);background:#fff;color:#111;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.25);overflow:hidden}
#cookie-panel header{padding:1rem 1.2rem;font-weight:800;background:#f5f7fa;border-bottom:1px solid #e6e8eb}
#cookie-panel .body{padding:1rem 1.2rem;display:grid;gap:.8rem}
#cookie-panel .row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
#cookie-panel .row .desc{font-size:.95rem;opacity:.9}
#cookie-panel .row .toggle{display:inline-flex;align-items:center;gap:.5rem}
#cookie-panel footer{padding:.9rem 1.2rem;display:flex;gap:.6rem;justify-content:flex-end;border-top:1px solid #e6e8eb;background:#fafbfc}
#cookie-panel button{padding:.55rem .95rem;border-radius:.6rem;border:1px solid #cfd6dd;cursor:pointer;font-weight:700}
#cookie-panel .save{background:var(--cookie-accent);color:#fff;border-color:var(--cookie-accent)}
@media(max-width:560px){ #cookie-panel footer{flex-direction:column} #cookie-panel button{width:100%} }