/* Limivex brand theme for the flipbook viewer + embed.
   Additive overrides loaded AFTER viewer.css, so these win on conflict.
   Tokens sourced verbatim from C:\dev\limivex-marketing
   (DESIGN.md and app/globals.css): azure #032a47, yellow #fdc004,
   fonts Albert Sans (display) + Satoshi (body/UI). */

@import url('https://fonts.googleapis.com/css2?family=Albert+Sans:wght@400;500;700&display=swap');

@font-face { font-family:'Satoshi'; src:url('/static/fonts/Satoshi-Light.woff2')   format('woff2'); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:'Satoshi'; src:url('/static/fonts/Satoshi-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Satoshi'; src:url('/static/fonts/Satoshi-Medium.woff2')  format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Satoshi'; src:url('/static/fonts/Satoshi-Bold.woff2')    format('woff2'); font-weight:700; font-style:normal; font-display:swap; }

:root {
  --lmvx-azure: #032a47;
  --lmvx-azure-lit: #0b3a5c;
  --lmvx-yellow: #fdc004;
  --lmvx-yellow-deep: #e4a000;
  --lmvx-sans: 'Satoshi', system-ui, -apple-system, sans-serif;
  --lmvx-display: 'Albert Sans', system-ui, sans-serif;
}

/* Surround + base UI font: brand azure with a subtle spotlight, Satoshi text */
body {
  background: radial-gradient(circle at 50% 38%, var(--lmvx-azure-lit), var(--lmvx-azure) 72%);
  font-family: var(--lmvx-sans);
}
#grid-overlay { background: var(--lmvx-azure); }

/* Lift the white pages cleanly off the azure surround */
.stf__block { box-shadow: 0 6px 30px rgba(0, 0, 0, 0.45); }

/* Dialog / section headings use the display face (Albert Sans) */
.modal-content h3,
#grid-header h3 {
  font-family: var(--lmvx-display);
  font-weight: 700;
  letter-spacing: -0.02em;
}

/* Surfaces (share modal, search bar) -> azure-lit */
.modal-content { background: var(--lmvx-azure-lit); }
#search-bar-inner { background: rgba(11, 58, 92, 0.95); }

/* Accent: the stock indigo (#6366f1) becomes Limivex yellow */
#page-slider::-webkit-slider-thumb { background: var(--lmvx-yellow); }
#page-slider::-moz-range-thumb     { background: var(--lmvx-yellow); }
.grid-page.active                  { border-color: var(--lmvx-yellow); }
.checkbox-label input[type="checkbox"] { accent-color: var(--lmvx-yellow); }
#landscape-hint {
  background: rgba(253, 192, 4, 0.14) !important;
  border-bottom: 1px solid rgba(253, 192, 4, 0.35) !important;
  color: rgba(255, 255, 255, 0.75) !important;
}

/* Subtle yellow lift on control hover/focus */
#controls button:hover:not(:disabled),
#grid-header button:hover {
  border-color: var(--lmvx-yellow);
  background: rgba(253, 192, 4, 0.12);
}

/* Safety net: keep the upstream "Created with Flipbook" credit hidden even if a
   future template re-adds it (it is also removed from the templates themselves). */
#attribution { display: none !important; }
