/*
Theme Name: StoragePress Bootstrap Theme
Theme URI: https://example.com/storagepress-bootstrap
Author: Your Company
Description: A Bootstrap 5 WordPress theme starter for self-storage facilities. Frontend-focused and designed to pair with a future storage management plugin (units, availability, leases, online payments, autopay, tenant portal).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: storagepress-bs
Tags: bootstrap, storage, business, responsive
*/

/* -------------------------------------------------------
   Global polish
------------------------------------------------------- */
:root{
  --spbs-ink: #0f172a;
  --spbs-muted: #64748b;
  --spbs-soft: #f1f5f9;
  --spbs-card: #ffffff;

  --spbs-accent: #2563eb;   /* can be overridden by customizer inline CSS */
  --spbs-accent2: #10b981;  /* can be overridden by customizer inline CSS */

  --spbs-warn: #f59e0b;
  --spbs-danger: #ef4444;
}

body{
  color: var(--spbs-ink);
  background: #fff;
}

a{ text-decoration: none; }
a:hover{ text-decoration: underline; }

.spbs-hero{
  background: radial-gradient(1200px 600px at 20% 10%, rgba(37,99,235,.18), transparent 60%),
              radial-gradient(900px 500px at 80% 30%, rgba(16,185,129,.14), transparent 55%),
              linear-gradient(180deg, #ffffff, #f8fafc);
  border-bottom: 1px solid rgba(15,23,42,.08);
}

.spbs-pill{
  display: inline-flex;
  gap: .5rem;
  align-items: center;
  padding: .35rem .75rem;
  border-radius: 999px;
  background: rgba(37,99,235,.08);
  color: var(--spbs-ink);
  font-weight: 600;
  font-size: .9rem;
}

.spbs-card{
  background: var(--spbs-card);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 1rem;
  box-shadow: 0 10px 20px rgba(15,23,42,.05);
}

.spbs-card .card-header{
  background: transparent;
  border-bottom: 1px solid rgba(15,23,42,.08);
}

.spbs-section{
  padding: 3.5rem 0;
}

.spbs-muted{ color: var(--spbs-muted); }

.navbar-brand{
  font-weight: 800;
  letter-spacing: .2px;
}

/* Buttons – keep Bootstrap defaults, but allow a subtle accent vibe */
.btn-primary{
  background: var(--spbs-accent);
  border-color: var(--spbs-accent);
}
.btn-outline-primary{
  color: var(--spbs-accent);
  border-color: var(--spbs-accent);
}
.btn-outline-primary:hover{
  background: var(--spbs-accent);
  border-color: var(--spbs-accent);
}

/* -------------------------------------------------------
   Unit map styling (frontend-only; plugin can drive it later)
------------------------------------------------------- */
.spbs-map-wrap{
  overflow-x: auto;
  padding: 1rem;
  background: #fff;
  border-radius: 1rem;
  border: 1px dashed rgba(15,23,42,.18);
}

.spbs-map{
  position: relative;
  min-width: 820px;
  max-width: 1100px;
  margin: 0 auto;
}

.spbs-drive{
  position: relative;
  background: repeating-linear-gradient(
      90deg,
      rgba(15,23,42,.05),
      rgba(15,23,42,.05) 18px,
      rgba(15,23,42,.03) 18px,
      rgba(15,23,42,.03) 36px
  );
  border: 1px solid rgba(15,23,42,.10);
  border-radius: .75rem;
}

.spbs-toprow{
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: .5rem;
  margin-bottom: .65rem;
}

.spbs-mid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
}

.spbs-bottom{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .65rem;
  margin-top: .65rem;
}

.spbs-unit{
  position: relative;
  display: block;
  padding: .65rem .6rem;
  border-radius: .75rem;
  border: 1px solid rgba(15,23,42,.15);
  background: #fff;
  text-decoration: none;
  color: var(--spbs-ink);
  transition: transform .08s ease, box-shadow .08s ease, border-color .08s ease;
  cursor: pointer;
}
.spbs-unit:hover{
  transform: translateY(-1px);
  border-color: rgba(37,99,235,.35);
  box-shadow: 0 12px 22px rgba(15,23,42,.08);
  text-decoration: none;
}

.spbs-unit small{
  color: var(--spbs-muted);
  display: block;
  line-height: 1.2;
}

.spbs-badge{
  position: absolute;
  top: .5rem;
  right: .5rem;
  font-size: .75rem;
}

.spbs-status-available{
  background: rgba(16,185,129,.12) !important;
  border-color: rgba(16,185,129,.30) !important;
}
.spbs-status-occupied{
  background: rgba(239,68,68,.08) !important;
  border-color: rgba(239,68,68,.22) !important;
}
.spbs-status-reserved{
  background: rgba(245,158,11,.10) !important;
  border-color: rgba(245,158,11,.28) !important;
}

.spbs-highlight{
  outline: 3px solid rgba(245,158,11,.55);
  outline-offset: 2px;
}

/* Footer */
.site-footer{
  border-top: 1px solid rgba(15,23,42,.08);
  background: #fff;
  padding: 2rem 0;
}