:root{
  --color-primary:#0033A0;
  --color-primary-600:#00226A;
  --color-secondary:#E50914;
  --color-accent:#FFD700;
  --color-background:#F3F4F6;
  --radius:14px;
  --shadow:0 12px 28px rgba(17,24,39,0.08);
  --muted:#6B7280;
  --surface:#ffffff;
}
html{box-sizing:border-box}
*,*:before,*:after{box-sizing:inherit}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--color-secondary);background:linear-gradient(180deg,#ffffff 0%, var(--color-background) 100%)}
.container{max-width:1200px;margin:0 auto;padding:1rem}
.nav{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(10px);box-shadow:var(--shadow);z-index:10}
.nav-inner{display:flex;gap:1rem;align-items:center;min-height:56px}
.nav .brand{font-weight:800;color:var(--color-secondary);letter-spacing:.2px;font-size:1.05rem}
.nav a{color:var(--color-secondary);padding:.5rem .75rem;border-radius:12px;text-decoration:none;font-weight:500}
.nav a:hover{background:var(--color-primary);color:#fff !important;}
.nav a.highlight{background-color:var(--color-primary);color:#fff;}
.nav a.highlight:hover{background-color:#fff;color:var(--color-primary);border:1px solid var(--color-primary);}
.spacer{flex:1}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1rem;border-radius:12px;border:1px solid #e5e7eb;cursor:pointer;background:#fff;transition:transform .05s ease, box-shadow .2s,color .2s, background .2s}
.btn:hover{box-shadow:0 8px 20px rgba(0,0,0,.06)}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--color-primary);color:#fff;border-color:transparent}
.btn-primary:hover{background:var(--color-primary-600)}
.btn-light{background:#ffffff;color:var(--color-secondary);border-color:transparent}
.btn-ghost{background:transparent;border-color:transparent;color:var(--color-accent)}
.btn-outline{background:transparent;border-color:#e5e7eb}
/* Danger and small button utilities */
.btn-danger{background:#dc3545;color:#fff;border-color:transparent}
.btn-danger:hover{background:#b02a37}
.btn-sm{padding:.35rem .6rem;border-radius:8px;font-size:.875rem}
.btn-outline-secondary-grey{background:transparent;border-color:#d1d5db;color:var(--muted)}

/* Specific remove-image button to ensure visibility in galleries */
.remove-image-btn{background:#dc3545;color:#fff;border:1px solid rgba(0,0,0,0.05);padding:.45rem .6rem;border-radius:8px}
.remove-image-btn:hover{background:#b02a37}
.card{background:var(--surface);border-radius:16px;box-shadow:var(--shadow);padding:1.1rem;border:1px solid #eef2f7}
.card:hover{box-shadow:0 16px 36px rgba(17,24,39,.10)}
.card .actions{display:flex;gap:.5rem;flex-wrap:wrap}
.card h3{margin-top:0}
.grid{display:grid;gap:1rem}
@media (min-width:768px){.grid-2{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}
form .field{margin:.75rem 0}
label{display:block;margin-bottom:.25rem;font-weight:600}
input,select,textarea{width:100%;padding:.7rem .8rem;border:1px solid #e5e7eb;border-radius:12px;background:#fff;transition:border-color .15s, box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:#c7d2fe;box-shadow:0 0 0 4px rgba(37,99,235,.12)}
.flash{background:#fff3cd;color:#664d03;border:1px solid #ffecb5;padding:.75rem;border-radius:8px;margin:1rem 0}
.footer{padding:2.75rem 0;color:var(--muted)}
.footer .links{display:flex;gap:1rem;flex-wrap:wrap;margin:.5rem 0}
.footer .links a{color:var(--muted);text-decoration:none;padding:.25rem .5rem;border-radius:8px}
.footer .links a:hover{background:#f3f4f6;color:var(--color-secondary)}

/* Utility */
.hero{padding:2rem 0}
.hero .title{font-size:1.75rem;margin:.25rem 0}
.hero .subtitle{color:var(--muted)}
.hero-landing{position:relative;min-height:40vh;border-radius:16px;overflow:hidden;margin:1rem 0}
.hero-landing::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.55)), url('/assets/images/hero.jpg') center/cover no-repeat;filter:saturate(115%)}
.hero-landing .hero-inner{position:relative;color:#fff;padding:3rem 2rem}
.hero-landing .title{color:#fff;font-size:2.15rem}
.hero-landing .subtitle{color:#e5e7eb}
.section{padding:1rem 0}
.muted{color:var(--muted)}
.list{list-style:none;padding:0;margin:0}
.list li{padding:.4rem 0;border-bottom:1px solid #f1f5f9}
.empty{padding:2rem;text-align:center;color:var(--muted)}

/* Global link styles */
a{color:var(--color-accent);text-underline-offset:3px;text-decoration:none;position:relative}

a:hover{color:var(--color-primary)}

/* Force white text on blue background sections */
[style*="background-color:#0033A0"], [style*="background-color: #0033A0"] { color:#fff !important; }
[style*="background-color:#0033A0"] h1,
[style*="background-color:#0033A0"] h2,
[style*="background-color:#0033A0"] h3,
[style*="background-color:#0033A0"] h4,
[style*="background-color:#0033A0"] h5,
[style*="background-color:#0033A0"] h6,
[style*="background-color:#0033A0"] p,
[style*="background-color:#0033A0"] a,
[style*="background-color:#0033A0"] .btn { color:#fff !important; }

.welcome-header,
.welcome-header h1,
.welcome-header p,
.hero,
.hero .title,
.hero .subtitle,
.hero-landing,
.hero-landing .title,
.hero-landing .subtitle,
.bg-primary { color:#fff !important; }

/* Mobile-first responsive tweaks for forms and buttons */
@media (max-width: 767px) {
  .container { padding: 0.75rem; }
  .nav-inner { min-height:48px; gap:.5rem; padding:.25rem .5rem; }
  .card { padding: .75rem; border-radius:12px; }
  form .field { margin: .5rem 0; }
  input, select, textarea { padding: .6rem .7rem; border-radius:10px; }
  .grid { gap: .75rem; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr !important; }
  .btn { display:block; width:100%; justify-content:center; padding:.6rem .75rem; border-radius:10px; }
  .btn + .btn { margin-top: .5rem; }
  .card .actions, .property-actions { display:flex; flex-direction:column; gap:.5rem; }
  .image-gallery-edit { gap:.5rem; }
  .image-card { width:48%; }
  .image-thumbnail { height:80px; object-fit:cover; }
  /* Make small form controls and selects easier to tap */
  input[type="number"]::-webkit-outer-spin-button,
  input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
  /* Reduce hero paddings on small screens */
  .hero-landing .hero-inner { padding: 1.25rem; }
}


