/* static/css/public/public-base.css
   Shared base for PUBLIC pages (open house, campaigns, pre-login). See specs/public-pages-css.md.
   Frozen copy of the main.css values these pages used on 2026-11-04. Uses only --pub-* variables.
   Never import main.css or themes.css here; public pages never follow the workspace theme. */

:root {
  --pub-color-primary: #031f42;
  --pub-color-primary-dark: #071b46;
  --pub-color-accent: #c8a56a;
  --pub-color-accent-dark: #a78348;
  --pub-color-cream: #f7f5f1;
  --pub-color-background: #f9f9fb;
  --pub-color-surface: #ffffff;
  --pub-color-text: #1c2228;
  --pub-color-text-strong: #071b46;
  --pub-color-text-muted: #7e7e7e;
  --pub-color-border: #ededed;
  --pub-color-border-strong: #d8d6d1;
  --pub-color-success: #166534;
  --pub-color-success-bg: #ecfdf3;
  --pub-shadow-sm: 0 8px 24px rgba(3, 31, 66, 0.06);
  --pub-shadow-md: 0 14px 36px rgba(3, 31, 66, 0.08);
  --pub-focus-ring: 0 0 0 3px rgba(200, 165, 106, 0.28);
  --pub-radius-none: 0;
  --pub-radius-sm: 2px;
  --pub-radius-md: 4px;
}

@media (max-width: 768px) {
:root {
  --pub-mobile-bottom-nav-height: 96px;
  --pub-mobile-bottom-nav-gap: 24px;
  --pub-mobile-bottom-nav-safe-area: calc(
      var(--pub-mobile-bottom-nav-height)
      + var(--pub-mobile-bottom-nav-gap)
      + env(safe-area-inset-bottom)
    );
  --pub-mobile-bottom-nav-overlay-gap: 24px;
}
}

*,
*::before,
*::after{
  box-sizing: border-box;
}
html,
body{
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-x: clip;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
body{
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--pub-color-background);
  color: var(--pub-color-text);
  overflow-x: hidden;
  overflow-x: clip;
  overflow-y: auto;
}
header{
  background: var(--pub-color-primary);
  color: #ffffff;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid rgba(200, 165, 106, 0.22);
}
[hidden]{ display: none !important; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button{
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"]{
  -moz-appearance: textfield;
}
select{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  width: 100%;
  height: 44px;
  padding: 0 44px 0 14px;

  font-size: 0.95rem;
  font-family: inherit;
  color: #111827;
  background-color: #ffffff;

  border: 1px solid #d1d5db;
  border-radius: 12px;

  cursor: pointer;

  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%236b7280' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 18px;
}
select:hover{
  border-color: #9ca3af;
}
select:focus{
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}
select:disabled{
  background-color: #f3f4f6;
  color: #9ca3af;
  cursor: not-allowed;
}
select option[value=""]{
  color: #9ca3af;
}
body:has(dialog[open]){
  overflow: hidden;
}
@media print {
  html,
  body{
    background:#fff !important;
    color:#111 !important;
  }
}
@media (max-width: 768px) {
  html,
  body{
    max-width:100%;
    overflow-x:hidden;
  }
  *,
  *::before,
  *::after{
    box-sizing:border-box;
  }
  input, select, textarea, button {
    max-width:100%;
  }
  input,
  select,
  textarea{
    width:100%;
  }
}