/* ==========================================================================
   Component 002: Hours Table
   ========================================================================== */

:where(.c-002-hours-table) {
  width: 100%;
  background: var(--wp--preset--color--white);
  border-radius: var(--wp--custom--border-radius--lg);
  overflow: hidden;
}

:where(.c-002-hours-table__table) {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--wp--preset--font-size--base);
}

/* Header Row */
:where(.c-002-hours-table__header) {
  background: var(--wp--preset--color--primary-lightest);
  font-size: var(--wp--preset--font-size--base);
  @media (max-width: 1200px) {
    font-size: var(--wp--preset--font-size--xs);
  }
}

/* Table Cells */
:where(.c-002-hours-table__cell) {
  padding: var(--wp--preset--spacing--sm);
  text-align: center;
  border: 1px solid var(--wp--preset--color--gray-lighter);
  vertical-align: middle;
  @media (max-width: 1200px) {
    padding: var(--wp--preset--spacing--xs);
  }
}

/* Header Cell */
:where(.c-002-hours-table__cell--header) {
  font-weight: 600;
  color: var(--wp--preset--color--gray-darker);
  background: var(--wp--preset--color--primary-lightest);
  white-space: nowrap;
}

/* Day Headers */
:where(.c-002-hours-table__cell--day) {
  font-weight: 600;
  color: var(--wp--preset--color--gray-darkest);
  background: var(--wp--preset--color--primary-lightest);
}

/* Time Cell */
:where(.c-002-hours-table__cell--time) {
  background: var(--wp--preset--color--gray-lightest);
  text-align: center;
  white-space: nowrap;
  font-weight: 500;
  color: var(--wp--preset--color--gray-darkest);
}

:where(.c-002-hours-table__time-main) {
  display: block;
  font-size: var(--wp--preset--font-size--sm);
  color: var(--wp--preset--color--gray-darkest);
}

/* Status Cells */
:where(.c-002-hours-table__cell--status) {
  position: relative;
  background: var(--wp--preset--color--white);
  color: var(--wp--preset--color--gray-dark);
}

/* Open Mark - 円形の緑色マーク */
:where(.c-002-hours-table__cell--open .c-002-hours-table__mark)::before {
  content: "";
  display: inline-block;
  width: var(--wp--preset--spacing--sm);
  height: var(--wp--preset--spacing--sm);
  border-radius: var(--wp--custom--border-radius--full);
  background: var(--wp--preset--color--primary);
  @media (max-width: 1200px) {
    width: var(--wp--preset--spacing--xs);
    height: var(--wp--preset--spacing--xs);
  }
}

/* Closed Mark - グレーのハイフン */
:where(.c-002-hours-table__cell--closed) {
  background: var(--wp--preset--color--gray-lightest);
}

:where(.c-002-hours-table__cell--closed .c-002-hours-table__mark) {
  color: var(--wp--preset--color--gray-light);
  font-size: var(--wp--preset--font-size--2-xl);
  font-weight: 300;
  line-height: 1;
}

/* Footer Section */
:where(.c-002-hours-table__footer) {
  padding: var(--wp--preset--spacing--lg);
  background: var(--wp--preset--color--gray-lightest);
  border-top: 1px solid var(--wp--preset--color--gray-lighter);
  @media (max-width: 768px) {
    padding: var(--wp--preset--spacing--sm);
  }
}

/* Holiday Info */
:where(.c-002-hours-table__holiday-info) {
  gap: var(--wp--preset--spacing--sm);
  margin-bottom: var(--wp--preset--spacing--base);
  padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--base);
  background: var(--wp--preset--color--white);
  border-radius: var(--wp--custom--border-radius--md);
  border: 1px solid var(--wp--preset--color--gray-lighter);
  font-size: var(--wp--preset--font-size--xs);
  @media (max-width: 768px) {
    flex-direction: column;
    gap: var(--wp--preset--spacing--xs);
    padding: var(--wp--preset--spacing--xs);
  }
}

:where(.c-002-hours-table__holiday-label) {
  font-weight: 600;
  color: var(--wp--preset--color--gray-darker);
  font-size: var(--wp--preset--font-size--sm);
}

:where(.c-002-hours-table__holiday-text) {
  color: var(--wp--preset--color--gray-dark);
  font-size: var(--wp--preset--font-size--sm);
}

/* Calendar Link Button */
:where(.c-002-hours-table__calendar-link) {
  width: 100%;
  display: flex;
  align-items: center;
  gap: var(--wp--preset--spacing--xs);
  padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--lg);

  color: var(--wp--preset--color--white);
  text-decoration: none;
  border-radius: var(--wp--custom--border-radius--full);
  border: 1px solid var(--wp--preset--color--gray-light);
  font-size: var(--wp--preset--font-size--sm);
  font-weight: 500;
  transition: all var(--wp--custom--transition--duration--base)
    var(--wp--custom--transition--timing--ease);
  @media (max-width: 768px) {
    padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--sm);
    font-size: var(--wp--preset--font-size--xs);
  }
}

:where(.c-002-hours-table__calendar-link:hover) {
  background: var(--wp--preset--color--gray-lighter);
}

:where(.c-002-hours-table__calendar-link .material-symbols-outlined) {
  font-size: var(--wp--preset--font-size--lg) !important;
  @media (max-width: 768px) {
    font-size: var(--wp--preset--font-size--base) !important;
  }
}
