:root{
  --ooxoo-page-width:1050px;

  --brand:#1a3e8a;
  --brand-hover:#2563eb;

  --text:#0f172a;
  --muted:#64748b;
  --line:rgba(15,23,42,.10);
  --shadow:0 6px 20px rgba(15,23,42,.04);
}

/* Internal dashboards can keep wider layout while reusing the same header style */
body.ooxoo-internal-dashboard{ --ooxoo-page-width:1280px; }

/* Shared centered containers */
.ooxoo-dashboard-header,
.ooxoo-beta-notice,
#ooxoo-location-topbar,
.ooxoo-wrap{
  max-width:var(--ooxoo-page-width);
  margin-left:auto;
  margin-right:auto;
}

/* ===========================
   Header (parking page spec)
   =========================== */
.ooxoo-dashboard-header{
  padding:22px 10px 10px !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  position:relative !important;
}

/* Brand logo text (OOXOO) — must NOT create a pill/background */
.ooxoo-home-link,
.ooxoo-dashboard-title{
  font-size:30px !important;
  font-weight:900 !important;
  letter-spacing:-0.2px;
  color:var(--brand) !important;
  text-decoration:none !important;
  line-height:1 !important;
  display:inline-block;

  /* hard-stop any background hover effects coming from other CSS */
  background:transparent !important;
  border:none !important;
  padding:0 !important;
  margin:0 !important;
  box-shadow:none !important;
}

/* Hover: ONLY text color change (no background change) */
.ooxoo-home-link:hover{
  color:var(--brand-hover) !important;
  background:transparent !important;
}

.ooxoo-home-link:focus{
  outline:2px solid rgba(37,99,235,.25);
  outline-offset:4px;
  background:transparent !important;
}

.ooxoo-dashboard-actions{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  gap:8px;
}

/* Right-side action (ex: 지도 보기 / 레이아웃 저장) */
.ooxoo-action-link,
.ooxoo-action-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;

  padding:8px 14px;
  border-radius:12px;

  font-size:13px;
  font-weight:800;
  color:var(--brand) !important;

  border:1px solid rgba(26,62,138,.25);
  background:#fff !important;
  text-decoration:none;

  box-shadow:0 1px 0 rgba(15,23,42,.04);
}

/* Hover: ONLY text/border change (no background change) */
.ooxoo-action-link:hover,
.ooxoo-action-btn:hover{
  color:var(--brand-hover) !important;
  background:#fff !important;
  border-color:rgba(37,99,235,.35);
}

.ooxoo-action-btn{
  -webkit-appearance:none;
  appearance:none;
  cursor:pointer;
}

.ooxoo-action-btn:focus{
  outline:2px solid rgba(37,99,235,.25);
  outline-offset:3px;
}

/* ===========================
   Notice block (under header)
   =========================== */
.ooxoo-beta-notice{
  margin:6px auto 14px;
  padding:8px 14px;
  background:#f8fafc;
  border:1px dashed #c7d2fe;
  border-radius:10px;

  font-size:13px;
  font-weight:700;
  color:#1e40af;
  text-align:center;
}

.ooxoo-beta-notice .ooxoo-data-source{
  margin-top:4px;
  font-size:12px;
  font-weight:600;
  color:var(--muted);
}

/* ===========================
   Location topbar
   =========================== */
#ooxoo-location-topbar{
  margin:0 auto 18px;
  padding:10px 16px;
  background:#eaf0ff;
  border-radius:10px;

  color:var(--brand);
  font-size:14px;
  font-weight:900;

  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
}

#ooxoo-location-topbar .ooxoo-location-actions{
  display:flex;
  align-items:center;
  gap:6px;
}

#ooxoo-location-topbar .ooxoo-location-actions button{
  border:none;
  background:transparent;
  cursor:pointer;
  font-size:16px;
  color:var(--brand);
  padding:2px 6px;
  border-radius:6px;
}

#ooxoo-location-topbar .ooxoo-location-actions button:hover{
  background:rgba(30,64,175,.08);
}

/* ===========================
   Content wrap helper
   =========================== */
.ooxoo-wrap{
  padding:0 10px 40px;
}

@media (max-width:768px){
  .ooxoo-dashboard-header{ padding:18px 10px 10px !important; }
  .ooxoo-home-link,
  .ooxoo-dashboard-title{ font-size:26px !important; }

  .ooxoo-dashboard-actions{ right:10px; }

  .ooxoo-action-link,
  .ooxoo-action-btn{
    padding:7px 12px;
    font-size:12px;
  }
}
/* =========================================
   Header data source badge – mobile mini
========================================= */

@media (max-width: 768px) {
  .ooxoo-header .ooxoo-data-source,
  .ooxoo-header .data-source,
  .ooxoo-header [data-source],
  .ooxoo-header .header-data-source {
    transform: scale(0.2);          /* ⬅ 약 1/5 */
    transform-origin: right top;    /* 우측 상단 기준 축소 */
    opacity: 0.6;                   /* 존재감 최소화 */
    margin-left: auto;
    margin-right: 4px;
    padding: 0;
    line-height: 1;
  }
}