/*!
Theme Name: sic
Theme URI: https://sic-ultimate-g.com/
Author: 合同会社シック(SIC)
Author URI: https://sic-ultimate-g.com/
Description: 合同会社シック(SIC)コーポレートサイト用テーマ。Underscores(_s)ベース。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: sic
Tags: custom-menu, featured-images, translation-ready

sic is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/
@charset "utf-8";

/*
 * サイトの見た目は assets/css/ 側（reset → color-palette → common → base → ページ別）で組んでいる。
 * このファイルは「WordPress が出力する要素」だけを受け止める最小の上書き置き場。
 */

/**** WordPress 標準クラス ****/
.alignleft {
    float: left;
    margin-right: 1.5em;
    margin-bottom: 1em;
}

.alignright {
    float: right;
    margin-left: 1.5em;
    margin-bottom: 1em;
}

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    max-width: 100%;
}

.wp-caption-text {
    font-size: 13px;
    text-align: center;
}

/**** アクセシビリティ（_s 由来）****/
.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    z-index: 100000;
    top: 5px;
    left: 5px;
    width: auto;
    height: auto;
    clip: auto;
    padding: 15px 23px 14px;
    background-color: #f1f1f1;
    color: #21759b;
    font-size: 14px;
    line-height: normal;
    text-decoration: none;
}

/********************************************
Contact Form 7 ―― 静的デザイン(.ct-)へのブリッジ
CF7 は input を span.wpcf7-form-control-wrap で包み、
ラジオを span.wpcf7-list-item で出力する。
contact.css の .ct- 系がそのまま効くように橋渡しする。
********************************************/
.ct-field .wpcf7-form-control-wrap {
    display: block;
}

/*
 * 必須マーク
 * 静的HTMLは <span class="ct-req">*</span> だが、確認画面プラグインが
 * 項目名をテキストとして拾うため「お名前*」と出てしまう。
 * 擬似要素なら textContent に含まれないので、確認画面には出ない。
 */
.ct-row__label--req::after {
    content: "*";
    margin-left: 5px;
    color: var(--color-accent);
}

/* ラジオ：静的HTMLの .ct-radios / .ct-radio と同じ並びにする */
.ct-radios .wpcf7-radio {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 26px;
}

.ct-radios .wpcf7-list-item {
    margin: 0;
}

.ct-radios .wpcf7-list-item label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.ct-radios .wpcf7-list-item input {
    width: 16px;
    height: 16px;
    accent-color: var(--color-primary);
}

/*
 * 送信ボタンの矢印
 * Confirm Plus がボタンのラベルを textContent で上書きするため
 * <span class="arrow"> を置けない。common.css の .arrow と同じ形を擬似要素で描く。
 */
.ct-submit::after {
    content: "";
    position: absolute;
    right: 20px;
    width: 6px;
    height: 6px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
}

/* 確認画面の内容表示（プラグインが table で出力する） */
.wpcf7 table {
    width: 100%;
    max-width: 1040px;
    margin: 0 auto;
    border-collapse: collapse;
}

.wpcf7 table th,
.wpcf7 table td {
    padding: 18px 16px;
    border-bottom: 1px solid #d9d9d9;
    text-align: left;
    vertical-align: top;
}

.wpcf7 table th {
    width: 240px;
    font-size: 16px;
    font-weight: 700;
    color: var(--color-text);
}

.wpcf7 table td {
    font-size: 15px;
    color: var(--color-text-sub);
}

/* 確認画面のボタン（修正／送信）も同じ見た目にそろえる */
.wpcf7cp-btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    margin-top: 34px;
}

.wpcf7cp-btns button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 260px;
    height: 56px;
    padding: 0 40px 0 24px;
    border: none;
    color: #fff;
    background: var(--color-primary);
    font-family: inherit;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

/* .wpcf7cp-btns button より詳細度を上げないと上書きできない */
.wpcf7cp-btns .wpcf7cp-cfm-edit-btn {
    padding: 0 24px 0 40px;
    color: var(--color-primary);
    background: #fff;
    border: 1px solid var(--color-primary);
}

.wpcf7cp-btns button::after {
    content: "";
    position: absolute;
    right: 20px;
    width: 6px;
    height: 6px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
}

/* 「入力内容を修正」は戻る操作なので矢印を左向きにする */
.wpcf7cp-btns .wpcf7cp-cfm-edit-btn::after {
    right: auto;
    left: 20px;
    transform: rotate(-135deg);
}

@media (max-width: 768px) {
    .wpcf7 table th,
    .wpcf7 table td {
        display: block;
        width: auto;
        padding: 3vw 0;
    }

    .wpcf7 table th {
        border-bottom: none;
        padding-bottom: 0;
    }

    .wpcf7cp-btns button {
        width: 100%;
        min-width: 0;
    }
}

/* バリデーションメッセージ */
.wpcf7-not-valid-tip {
    margin-top: 6px;
    color: var(--color-accent);
    font-size: 13px;
}

.wpcf7-response-output {
    margin: 24px 0 0;
    padding: 14px 16px;
    border: 1px solid var(--color-primary);
    font-size: 15px;
}

.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.unaccepted .wpcf7-response-output {
    border-color: var(--color-accent);
}

/* 送信中インジケーター */
.wpcf7-spinner {
    margin: 0 0 0 12px;
}

/**** 管理バー表示時のヘッダー位置調整 ****/
body.admin-bar #head {
    top: 32px;
}

@media (max-width: 782px) {
    body.admin-bar #head {
        top: 46px;
    }
}
