/* top-common.css - SP v2 月極/時間貸トップ 共通CSS */
/* Extracted from monthly-top.css and time-top.css (I026/I027 第2段階 / 2026-05-05) */
/* 共通: Header / Logo / Hamburger Menu / Tab Frame / Tab Button base / Tab Icon / Tab Text */
/* 含まない: .tab-button--active (月極=赤/時間貸=緑で色違い), .footer (z-index 違い) */

.header {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 15px 12px;
  width: 100%;
  background-color: var(--fill-6r65d0, #FFFFFF);
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}

/* layout_6W9CCB: Frame 723 (Top Row)
   mode: row, justifyContent: space-between, alignItems: center, width: 345 */
.frame-723 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

/* layout_1XV0LU: Frame 12 (Logo Area)
   mode: row, alignItems: center, gap: 10px */
.frame-12 {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* layout_04907K: icn_parkspark (Logo Icon)
   width: 61.2, height: 34 */
.icn-parkspark {
  width: 61.2px;
  height: 34px;
  object-fit: cover;
}

/* layout_LYKYN5: Frame 724 (Brand Text Area)
   mode: column, justifyContent: center, gap: 5px */
.frame-724 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
}

/* style_BLP3XE: 三菱地所の駐車場検索[パークスパーク]
   fontSize: 10, lineHeight: 1.2em, color: #1E1E1E */
.text-header-tagline {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 1.2em;
  color: #1E1E1E;
}

/* layout_17FGVJ: brand_logo (Brand Logo SVG)
   width: 102, height: 14 */
.brand-logo-header {
  width: 102px;
  height: 14px;
}

/* layout_7I3P3H: Frame 1 (Menu Button Area)
   mode: column, alignItems: center, gap: 2px, width: 36 */
.frame-1-menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  width: 36px;
  cursor: pointer;
}

/* layout_719QKV: List 2 (Hamburger Icon)
   width: 32, height: 33 */
.hamburger-menu {
  width: 32px;
  height: 33px;
}

/* style_84S9AL: MENU text
   fontSize: 9, lineHeight: 1.2em, color: #1E1E1E */
.text-menu {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 9px;
  line-height: 1.2em;
  text-align: center;
  color: #1E1E1E;
}

/* layout_PWOD0V: Frame 7 (Tab Row Container)
   mode: row, justifyContent: stretch, alignSelf: stretch, padding: 0 0 1px */
.frame-7 {
  display: flex;
  align-self: stretch;
  padding: 0 0 1px;
}

/* layout_HR0SA3: Frame 717 (Tab Container)
   mode: row, padding: 5px, height: 50, borderRadius: 40px
   fills: #F2F0E8 */
.frame-717 {
  display: flex;
  flex: 1;
  padding: 5px;
  height: 50px;
  border-radius: 40px;
  background-color: var(--fill-jiva0u, #F2F0E8);
}

/* layout_X58WZA: Frame 4/6 (Tab Button)
   mode: row, justifyContent: center, alignItems: center, gap: 5px
   padding: 10px 20px, borderRadius: 40px */
.tab-button {
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
}

/* Tab Inactive (時間貸駐車場)
   fills: #F2F0E8 */
.tab-button--inactive {
  background-color: var(--fill-jiva0u, #F2F0E8);
}

/* layout_RLWVNZ: Tab Icon
   width: 16, height: 16 */
.tab-icon {
  width: 16px;
  height: 16px;
}

/* style_5DVDTU: Tab Text Active (14px bold white)
   fontWeight: 700, fontSize: 14, lineHeight: 1.2em */
.tab-text--active {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.2em;
  text-align: center;
  color: var(--fill-6r65d0, #FFFFFF);
}

/* style_S5F8Y5: Tab Text Inactive (14px regular gray)
   fontWeight: 400, fontSize: 14, lineHeight: 1.2em, color: #797979 */
.tab-text--inactive {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.2em;
  text-align: center;
  color: var(--fill-r6v3bz, #797979);
}
