:root {
  --ph-blue:#1E3A8A;
  --ph-blue-2:#2563EB;
  --ph-orange:#F59E0B;
  --ph-green:#10B981;
  --ph-navy:#0F172A;
  --ph-bg:#F8FAFC;
  --ph-text:#111827;
  --ph-muted:#6B7280;
  --ph-border:#E5E7EB;
  --ph-shadow:0 18px 45px rgba(15,23,42,.10);
  --ph-radius:16px;
}
* { letter-spacing:0; }
body { font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:var(--ph-bg); color:var(--ph-text); }
a { color:var(--ph-blue); text-decoration:none; }
.btn { border-radius:12px; font-weight:700; transition:transform .2s ease, box-shadow .2s ease; }
.btn:hover { transform:translateY(-1px); box-shadow:0 10px 24px rgba(30,58,138,.18); }
.btn-primary { background:linear-gradient(135deg, var(--ph-blue), var(--ph-blue-2)); border:0; }
.btn-success { background:linear-gradient(135deg, #059669, var(--ph-green)); border:0; }
.btn-warning { background:linear-gradient(135deg, var(--ph-orange), #F97316); border:0; color:#fff; }
.form-control, .form-select { border-color:var(--ph-border); border-radius:12px; min-height:44px; transition:border-color .2s ease, box-shadow .2s ease; }
.form-control:focus, .form-select:focus { border-color:var(--ph-blue-2); box-shadow:0 0 0 .22rem rgba(37,99,235,.13); }
.panel, .metric, .business-card { background:rgba(255,255,255,.92); border:1px solid rgba(226,232,240,.9); border-radius:var(--ph-radius); box-shadow:var(--ph-shadow); padding:1.15rem; height:100%; transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease; }
.panel:hover, .metric:hover, .business-card:hover { transform:translateY(-3px); box-shadow:0 24px 55px rgba(15,23,42,.14); border-color:rgba(245,158,11,.45); }
.metric { position:relative; overflow:hidden; }
.metric:before { content:""; position:absolute; inset:auto -35px -45px auto; width:120px; height:120px; border-radius:999px; background:rgba(245,158,11,.14); }
.metric span { display:block; color:var(--ph-muted); font-size:.82rem; font-weight:700; text-transform:uppercase; }
.metric strong { display:block; font-size:2rem; color:var(--ph-blue); margin-top:.25rem; }
.admin-thumb { width:96px; height:72px; object-fit:cover; border-radius:10px; border:1px solid var(--ph-border); background:#fff; }
.brand-lockup { display:flex; align-items:center; gap:.75rem; color:#fff; }
.brand-lockup:hover { color:#fff; }
.brand-mark { display:inline-grid; place-items:center; width:42px; height:42px; border-radius:14px; background:linear-gradient(135deg, var(--ph-orange), #F97316); color:#fff; font-weight:800; box-shadow:0 12px 30px rgba(245,158,11,.32); }
.brand-logo { width:42px; height:42px; border-radius:14px; object-fit:cover; background:#fff; box-shadow:0 12px 30px rgba(15,23,42,.18); }
.brand-lockup strong, .brand-lockup small { display:block; line-height:1.1; }
.brand-lockup small { color:rgba(255,255,255,.66); font-size:.76rem; margin-top:.15rem; }

.admin-layout { min-height:100vh; display:flex; }
.admin-sidebar { position:fixed; inset:0 auto 0 0; width:280px; background:linear-gradient(180deg, var(--ph-navy), #111C37); padding:1.15rem; z-index:1040; box-shadow:18px 0 45px rgba(15,23,42,.18); }
.sidebar-menu { display:grid; gap:.4rem; margin-top:1.5rem; }
.sidebar-link { display:flex; align-items:center; gap:.8rem; color:#CBD5E1; padding:.82rem .9rem; border-radius:14px; font-weight:700; transition:background .2s ease, color .2s ease, transform .2s ease; }
.sidebar-link i { color:var(--ph-orange); font-size:1.05rem; }
.sidebar-link:hover, .sidebar-link.active { background:rgba(245,158,11,.15); color:#fff; transform:translateX(3px); }
.admin-main { margin-left:280px; width:calc(100% - 280px); min-height:100vh; }
.admin-header { position:sticky; top:0; z-index:1000; min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.5rem; background:rgba(248,250,252,.86); backdrop-filter:blur(16px); border-bottom:1px solid rgba(226,232,240,.85); box-shadow:0 8px 24px rgba(15,23,42,.05); }
.admin-header h1 { font-size:1.28rem; font-weight:800; margin:0; }
.breadcrumb-mini { color:var(--ph-muted); font-size:.78rem; font-weight:700; }
.admin-content { padding:1.5rem; }
.admin-actions { display:flex; align-items:center; gap:.7rem; }
.admin-search { display:flex; align-items:center; gap:.5rem; background:#fff; border:1px solid var(--ph-border); border-radius:999px; padding:.55rem .9rem; min-width:260px; }
.admin-search input { border:0; outline:0; width:100%; background:transparent; }
.icon-btn { width:42px; height:42px; border:1px solid var(--ph-border); border-radius:14px; background:#fff; color:var(--ph-blue); display:inline-grid; place-items:center; }
.profile-chip { display:flex; align-items:center; gap:.55rem; border:1px solid var(--ph-border); background:#fff; border-radius:999px; padding:.42rem .8rem .42rem .45rem; font-weight:800; }
.profile-chip span { width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg, var(--ph-blue), var(--ph-green)); color:#fff; }

.table { vertical-align:middle; }
.table.dataTable { overflow:hidden; border-radius:16px; }
.dt-container { background:#fff; border:1px solid var(--ph-border); border-radius:18px; padding:1rem; box-shadow:var(--ph-shadow); }
.table thead th { background:#F1F5F9; color:#334155; font-size:.78rem; text-transform:uppercase; position:sticky; top:0; z-index:2; }
.table-striped>tbody>tr:nth-of-type(odd)>* { --bs-table-bg-type:#FBFDFF; }
.badge-active, .badge-success { background:#D1FAE5; color:#047857; border-radius:999px; padding:.35rem .65rem; font-weight:800; }
.badge-inactive, .badge-danger { background:#FEE2E2; color:#B91C1C; border-radius:999px; padding:.35rem .65rem; font-weight:800; }
.badge-shared { background:#DBEAFE; color:#1E3A8A; border-radius:999px; padding:.35rem .65rem; font-weight:800; }
.badge-cancelled { background:#F3F4F6; color:#4B5563; border-radius:999px; padding:.35rem .65rem; font-weight:800; }

.public-shell { background:linear-gradient(180deg, #F8FAFC 0%, #fff 45%, #F8FAFC 100%); }
.public-nav { background:rgba(255,255,255,.88); backdrop-filter:blur(16px); border-bottom:1px solid rgba(226,232,240,.8); box-shadow:0 10px 28px rgba(15,23,42,.05); }
.public-brand { color:var(--ph-text); }
.public-brand:hover { color:var(--ph-text); }
.public-brand small { color:var(--ph-muted); }
.public-nav .nav-link { font-weight:700; color:#334155; border-radius:10px; padding:.55rem .75rem; }
.public-nav .nav-link:hover { color:var(--ph-blue); background:#EFF6FF; }
.hero-band { background:radial-gradient(circle at 20% 20%, rgba(245,158,11,.28), transparent 28%), linear-gradient(135deg, var(--ph-navy), var(--ph-blue)); color:#fff; position:relative; overflow:hidden; }
.hero-band:after { content:""; position:absolute; inset:18% -12% auto auto; width:420px; height:420px; border-radius:50%; background:rgba(16,185,129,.22); filter:blur(8px); }
.hero-band .container { position:relative; z-index:1; min-height:420px; display:flex; flex-direction:column; justify-content:center; }
.hero-band h1 { font-size:clamp(2.5rem, 6vw, 5rem); font-weight:800; max-width:780px; }
.hero-band p { max-width:680px; font-size:1.2rem; color:#DBEAFE; }
.business-detail-hero { background-size:cover; background-position:center; }
.business-detail-body { padding-top:3rem; padding-bottom:3rem; position:relative; z-index:2; }
.business-hero-logo { width:96px; height:96px; object-fit:cover; border-radius:24px; border:3px solid rgba(255,255,255,.8); box-shadow:0 18px 45px rgba(15,23,42,.28); margin-bottom:1rem; background:#fff; }
.contact-card { position:sticky; top:100px; }
.products-section { clear:both; }
.product-card { overflow:hidden; }
.product-card-img { width:100%; height:210px; object-fit:cover; border-radius:12px; margin-bottom:1rem; display:block; }
.product-rich-text { color:#475569; margin-bottom:.75rem; }
.product-rich-text p:last-child { margin-bottom:0; }
.note-editor.note-frame { border-color:var(--ph-border); border-radius:14px; overflow:hidden; box-shadow:none; }
.note-toolbar { background:#F8FAFC; border-bottom:1px solid var(--ph-border); }
.business-card { display:block; color:inherit; }
.business-card strong { display:block; font-size:1.1rem; color:var(--ph-text); }
.business-card span { display:inline-flex; color:#92400E; background:#FEF3C7; border-radius:999px; padding:.25rem .6rem; margin:.5rem 0; font-size:.78rem; font-weight:800; }
.directory-card { display:flex; flex-direction:column; }
.directory-logo { width:78px; height:78px; border-radius:18px; display:grid; place-items:center; background:linear-gradient(135deg, #EFF6FF, #F8FAFC); border:1px solid var(--ph-border); overflow:hidden; margin-bottom:1rem; box-shadow:0 12px 28px rgba(15,23,42,.08); }
.directory-logo img { width:100%; height:100%; object-fit:cover; }
.directory-logo span { width:100%; height:100%; margin:0; border-radius:0; display:grid; place-items:center; background:linear-gradient(135deg, var(--ph-blue), var(--ph-orange)); color:#fff; font-size:1.8rem; font-weight:800; }
.site-footer { background:var(--ph-navy); color:#CBD5E1; padding:3rem 0 1.5rem; }
.site-footer h3 { color:#fff; font-size:.95rem; font-weight:800; }
.site-footer a { display:block; color:#CBD5E1; margin:.45rem 0; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); margin-top:2rem; padding-top:1rem; color:#94A3B8; font-size:.85rem; }

.auth-shell { min-height:100vh; background:radial-gradient(circle at 16% 18%, rgba(245,158,11,.28), transparent 24%), linear-gradient(135deg, var(--ph-navy), var(--ph-blue)); }
.auth-wrap { min-height:100vh; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:2rem; padding:2rem; max-width:1200px; margin:0 auto; }
.auth-brand-panel { color:#fff; padding:2rem; }
.eyebrow { color:var(--ph-orange); text-transform:uppercase; font-size:.78rem; font-weight:800; }
.auth-copy { margin:6rem 0 2rem; }
.auth-copy h1 { font-weight:800; font-size:clamp(2.3rem, 5vw, 4.5rem); line-height:1; max-width:680px; }
.auth-copy p { color:#DBEAFE; font-size:1.1rem; max-width:560px; }
.auth-stats { display:flex; gap:1rem; flex-wrap:wrap; }
.auth-stats span { background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); border-radius:16px; padding:1rem 1.2rem; min-width:120px; }
.auth-stats strong { display:block; color:#fff; font-size:1.4rem; }
.glass-panel { background:rgba(255,255,255,.88); border:1px solid rgba(255,255,255,.65); backdrop-filter:blur(18px); box-shadow:0 30px 90px rgba(15,23,42,.26); }
.auth-card { width:min(100%, 460px); justify-self:center; border-radius:24px; padding:2rem; }
.auth-card h2 { font-weight:800; margin:.35rem 0 1.5rem; }
.icon-field { position:relative; }
.icon-field i { position:absolute; right:1rem; top:50%; transform:translateY(-50%); color:var(--ph-muted); z-index:3; }
.icon-field .form-control { padding-right:2.8rem; }

@media (max-width: 991.98px) {
  .admin-sidebar { transform:translateX(-102%); transition:transform .25s ease; }
  .admin-sidebar.open { transform:translateX(0); }
  .admin-main { margin-left:0; width:100%; }
  .admin-search { display:none; }
  .admin-header { padding:1rem; }
  .admin-content { padding:1rem; }
  .auth-wrap { grid-template-columns:1fr; padding:1rem; }
  .auth-brand-panel { display:none; }
  .auth-card { width:100%; }
  .contact-card { position:static; }
}
@media (max-width: 575.98px) {
  .admin-actions { gap:.35rem; }
  .profile-chip { max-width:140px; overflow:hidden; white-space:nowrap; }
  .hero-band .container { min-height:360px; }
}
