/*
    Theme Name: LGWAN-ASP Theme
    Description: Theme for LGWAN-ASP portal site based on Astra theme
    Author: SHIFTASIA
    Author URI: https://www.shiftasia.com/
    Template: astra
    Version: 1.0.0
    Text Domain: astra-child
*/

/* Add your custom styles here */

/* メインメニューのドロップダウン矢印を非表示にする */
.main-header-menu .menu-item-has-children .icon-arrow {
  display: none;
}

/* メガメニューの文字サイズ調整 */
.main-header-menu .sub-menu a {
  font-size: 0.9em;
}

/* メガメニュー内の項目間隔を調整 */
.main-header-menu .sub-menu .menu-item a {
  padding-left: 1em;
  padding-right: 1em;
}

/* 検索ブロックの縦位置を中央揃えにする */
.wp-block-search__inside-wrapper {
  align-items: center;
}

/* 検索窓の長さを広げる */
input#wp-block-search__input-1 {
    width: 400px;
    max-width: 25vw;
}

/* 検索ボタンの高さを小さくする */
button.wp-block-search__button.has-text-color.has-background.has-icon.wp-element-button {
    font-size: 14px;
    padding-top: 10px;
    padding-bottom: 10px;
}

/* Prevent Bulma button hover/focus color from being overridden by Astra */
.button:hover,
.button:focus {
  background-color: hsl(
    var(--bulma-button-h),
    var(--bulma-button-s),
    calc(
      var(--bulma-button-background-l) + var(--bulma-button-background-l-delta)
    )
  );
}

/* Fix Bulma form control height to match Astra */
.button,
.file-cta,
.file-name,
.input,
.pagination-ellipsis,
.pagination-link,
.pagination-next,
.pagination-previous,
.select select {
  height: var(--bulma-control-height) !important;
}

/* Bulma utility classes */
.is-size-6p5 {
  font-size: 0.875rem !important;
}

.is-unstyled {
  list-style: none;
}

.is-bulleted {
  list-style: disc;
  margin-inline-start: 1rem;
}

.is-no-border {
  border: none !important;
}

/* Prevent textarea from being resizable */
.textarea {
  resize: none;
}

/* JLIS custom width utilities */
:root {
  --jlis-width-xs: 10rem;
  --jlis-width-sm: 12rem;
  --jlis-width-md: 16rem;
  --jlis-width-lg: 24rem;
  --jlis-width-xl: 32rem;
  --jlis-width-2xl: 48rem;
  --jlis-width-3xl: 64rem;
}

.has-min-width {
  min-width: var(--jlis-min-width);
}
.has-min-width.is-0 {
  --jlis-min-width: 0;
}
.has-min-width.is-one-third {
  --jlis-min-width: 33.3333%;
}
.has-min-width.is-25 {
  --jlis-min-width: 25%;
}
.has-min-width.is-50 {
  --jlis-min-width: 50%;
}
.has-min-width.is-two-thirds {
  --jlis-min-width: 66.6667%;
}
.has-min-width.is-75 {
  --jlis-min-width: 75%;
}
.has-min-width.is-100 {
  --jlis-min-width: 100%;
}
.has-min-width.is-auto {
  --jlis-min-width: auto;
}
.has-min-width.is-fit {
  --jlis-min-width: fit-content;
}
.has-min-width.is-min {
  --jlis-min-width: min-content;
}
.has-min-width.is-max {
  --jlis-min-width: max-content;
}
.has-min-width.is-xs {
  --jlis-min-width: var(--jlis-width-xs);
}
.has-min-width.is-sm {
  --jlis-min-width: var(--jlis-width-sm);
}
.has-min-width.is-md {
  --jlis-min-width: var(--jlis-width-md);
}
.has-min-width.is-lg {
  --jlis-min-width: var(--jlis-width-lg);
}
.has-min-width.is-xl {
  --jlis-min-width: var(--jlis-width-xl);
}
.has-min-width.is-2xl {
  --jlis-min-width: var(--jlis-width-2xl);
}
.has-min-width.is-3xl {
  --jlis-min-width: var(--jlis-width-3xl);
}

.has-max-width {
  max-width: var(--jlis-max-width);
}
.has-max-width.is-0 {
  --jlis-max-width: 0;
}
.has-max-width.is-one-third {
  --jlis-max-width: 33.3333%;
}
.has-max-width.is-25 {
  --jlis-max-width: 25%;
}
.has-max-width.is-50 {
  --jlis-max-width: 50%;
}
.has-max-width.is-two-thirds {
  --jlis-max-width: 66.6667%;
}
.has-max-width.is-75 {
  --jlis-max-width: 75%;
}
.has-max-width.is-100 {
  --jlis-max-width: 100%;
}
.has-max-width.is-auto {
  --jlis-max-width: auto;
}
.has-max-width.is-fit {
  --jlis-max-width: fit-content;
}
.has-max-width.is-min {
  --jlis-max-width: min-content;
}
.has-max-width.is-max {
  --jlis-max-width: max-content;
}
.has-max-width.is-xs {
  --jlis-max-width: var(--jlis-width-xs);
}
.has-max-width.is-sm {
  --jlis-max-width: var(--jlis-width-sm);
}
.has-max-width.is-md {
  --jlis-max-width: var(--jlis-width-md);
}
.has-max-width.is-lg {
  --jlis-max-width: var(--jlis-width-lg);
}
.has-max-width.is-xl {
  --jlis-max-width: var(--jlis-width-xl);
}
.has-max-width.is-2xl {
  --jlis-max-width: var(--jlis-width-2xl);
}
.has-max-width.is-3xl {
  --jlis-max-width: var(--jlis-width-3xl);
}

.has-width {
  width: var(--jlis-width);
}
.has-width.is-0 {
  --jlis-width: 0;
}
.has-width.is-one-third {
  --jlis-width: 33.3333%;
}
.has-width.is-25 {
  --jlis-width: 25%;
}
.has-width.is-50 {
  --jlis-width: 50%;
}
.has-width.is-two-thirds {
  --jlis-width: 66.6667%;
}
.has-width.is-75 {
  --jlis-width: 75%;
}
.has-width.is-100 {
  --jlis-width: 100%;
}
.has-width.is-auto {
  --jlis-width: auto;
}
.has-width.is-fit {
  --jlis-width: fit-content;
}
.has-width.is-min {
  --jlis-width: min-content;
}
.has-width.is-max {
  --jlis-width: max-content;
}
.has-width.is-xs {
  --jlis-width: var(--jlis-width-xs);
}
.has-width.is-sm {
  --jlis-width: var(--jlis-width-sm);
}
.has-width.is-md {
  --jlis-width: var(--jlis-width-md);
}
.has-width.is-lg {
  --jlis-width: var(--jlis-width-lg);
}
.has-width.is-xl {
  --jlis-width: var(--jlis-width-xl);
}
.has-width.is-2xl {
  --jlis-width: var(--jlis-width-2xl);
}
.has-width.is-3xl {
  --jlis-width: var(--jlis-width-3xl);
}