.client-login-bar {    display: none;   }
#client-login .title-main {    margin-top: 20px;   }
/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


 #start_date-block-container .zend_form dt, start_date-block-container .zend_form dt b, start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}
html, body, #content {
  background-color: #333333 !important;
}
#sb_booking_company_time .col-xs-12 {
  color: #ffffff !important;
}
#steps-nav {
  background-color: #898c85 !important;
}
div.service-addon input[type="radio"] {
  display: none;
}
.container-caption {
  color: #ffffff !important;
}
a.sb-cell.free {
  background-color: #37422c !important;  /* 通常時の背景色 */
  color: #fff !important;  /* 通常時の文字色 */
}

a.sb-cell.free:hover {
  background-color: #285e8e !important;  /* ホバー時の背景色 */
  color: #fff !important;  /* ホバー時の文字色（必要に応じて） */
}
#sb_time_slots_container .slot a {
  text-align: center !important;  /* 親は中央寄せ */
}

#sb_time_slots_container .slot a .end-time {
  display: block !important;
  margin-right: 0.7em !important;  /* 左にずらす */
}

/* ヘッダーロゴ（Altair Studio テキスト）の色 */
.company-name.company-logo-and-name a {
  color: #f0f0f0 !important;  /* 明るいグレー（お好みで調整） */
  text-decoration: none;      /* 下線が邪魔なら消す */
}

a.btn.map[title="地図に表示する"] {
  display: none !important;
}

/* ホームページのロゴとタイトルのリンクを無効化（クリックできないようにする） */
.company-name.company-logo-and-name a {
    pointer-events: none !important;  /* クリックを無効化 */
    cursor: default !important;       /* マウスカーソルも通常に */
}

.brand.company-logo-and-name {
pointer-events: none;
}

/* 「カレンダーに追加する」ボタンを非表示にする */
.btn.sb_add_to_cal {
    display: none !important;
}

/* 「サービスに戻る」の文字色を白っぽくする */
#sb_back_to_bookings a.back-to-services {
    color: #f2f2f2 !important; /* 白っぽい文字色 */
}

/* 予約キャンセルメッセージを白っぽく */
#sb_message_container .alert-success {
    color: #f2f2f2 !important;      /* 文字色を白っぽく */
    background-color: transparent !important; /* 必要に応じて背景も透明に */
}

/* サブスクライブコンポーネント全体を非表示にする */
.subscribe-component--content {
    display: none !important;
}

/* 「登録する」ボタンを非表示にする */
#subscribe-client-push-btn {
    display: none !important;
}

div#sb_footer_menu {
   display: none;
}


.text-center {
   display: none;
}

/* 「利用可能」の文字を白っぽく */
.time-legend .available {
    color: #f2f2f2 !important;
}

/* 「利用可能」の横の丸の色を変更 */
.time-legend .available .circle {
    background-color: #37422c !important;
}

/* 予約キャンセル通知や情報メッセージを白に */
#sb_invoice_notification,
#sb_invoice_notification .alert,
#sb_invoice_notification .notifications-pending {
    color: #f2f2f2 !important;
}

.promo-list-item {
  color: #ffffff !important;
}

svg.sb-inline-svg[src*="payment-pending.svg"] path {
  fill: #f2f2f2 !important;
}

tr th {
  background-color: #2b4209 !important;
  color: #ffffff !important; /* 文字を白にして見やすくする場合 */
}

.to-invoices-list {
  color: #f2f2f2 !important;
}

#sb_invoice_list_container td {
  color: #f2f2f2 !important;
}

#sb_invoice_list_container td.invoice-status.pending {
  color: #e57373 !important; /* 優しい赤 */
  font-weight: bold;
}

#sb_invoice_list_container a[href^="#invoice/view/"] {
  color: #4a7b1c !important; /* 優しいグリーン */
  font-weight: bold; /* 必要なら強調 */
}

.promo-code-input--label,
.promo-code-input--label * ,
.promo-code-input--dropdown,
.promo-code-input--dropdown * {
    color: #f2f2f2 !important;
}

.promo-code-input h3.title {
    color: #f2f2f2 !important;
}
#booking-result-tabs > div > div > div:nth-child(2) {
   display: none !important;
}

document.addEventListener("DOMContentLoaded", function() {
  // タイムアウトによるキャンセル表示を書き換え
  document.querySelectorAll('h4.booking-status.subscribe-component--title').forEach(function(el){
    if(el.textContent.trim() === "cancelled_by_timeout"){
      el.textContent = "一定時間が経過したためタイムアウトしました";
    }
  });
});

}

/* client-login-bar セクションごと強制非表示 */
div.client-login-bar,
div.client-login-bar * {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* 文字色を #f2f2f2 に */
.invoice-payment-systems-choose.label {
    color: #f2f2f2;
}

/* アイコンの背景を明るく */
.payment-system .img {
    background-color: #ffffff; /* 明るい白系に */
    border-radius: 8px;        /* 角丸で柔らかい印象 */
    padding: 8px;              /* アイコンとの余白 */
}

/* 「支払い方法」のタイトル */
.payment-system-container--txt-block .title {
    color: #f2f2f2;
}

/* 「お支払い方法をクリックして選択してください」の文章 */
.invoice-payment-systems-choose.label {
    color: #f2f2f2;
}

/* 支払いシステム名（Stripe / 後で支払う） */
.payment-system .name {
    color: #f2f2f2;
}

div.alert.alert-info.alert-dismissible[role="alert"] {
  color: #f2f2f2 !important;
}

/* 背景も気になる場合は一緒に調整できる */
div.alert.alert-info.alert-dismissible[role="alert"] {
  background-color: #444 !important;  /* 例: 濃いグレー背景 */
  border-color: #666 !important;      /* 枠線を調整 */
}