/* =========================================================
   Jimoto Common CSS
   地元サイト共通デザイン基盤
   対象：[jimoto_my_dashboard] が設置されている地元情報ページ
========================================================= */

/* ------------------------------
   共通変数
------------------------------ */
body.jimoto-dashboard-page {
    --jimoto-main: #00377F;
    --jimoto-main-light: #f0f5ff;
    --jimoto-bg: #f5f7fa;
    --jimoto-card-bg: #ffffff;
    --jimoto-border: #dbe5f2;
    --jimoto-border-light: #e5edf7;
    --jimoto-text: #222222;
    --jimoto-text-sub: #555555;
    --jimoto-text-muted: #777777;
    --jimoto-radius-lg: 16px;
    --jimoto-radius-md: 12px;
    --jimoto-radius-sm: 8px;
    --jimoto-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
}

/* ------------------------------
   地元情報ページ全体
------------------------------ */
body.jimoto-dashboard-page {
    background: var(--jimoto-bg);
}

body.jimoto-dashboard-page .site-content,
body.jimoto-dashboard-page .content-area,
body.jimoto-dashboard-page .site-main {
    box-sizing: border-box;
}

body.jimoto-dashboard-page .entry-content {
    line-height: 1.8;
}

/* ------------------------------
   地元サイト共通カード
------------------------------ */
.jimoto-card,
.jimoto-common-card {
    background: var(--jimoto-card-bg);
    border: 1px solid var(--jimoto-border);
    border-radius: var(--jimoto-radius-lg);
    box-shadow: var(--jimoto-shadow);
    box-sizing: border-box;
}

.jimoto-card-inner,
.jimoto-common-card-inner {
    padding: 16px;
    box-sizing: border-box;
}

/* ------------------------------
   共通ラベル・見出し
------------------------------ */
.jimoto-label,
.jimoto-common-label {
    display: inline-block;
    margin: 0 0 8px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
    color: #ffffff;
    background: var(--jimoto-main);
    border-radius: 999px;
    line-height: 1.5;
}

.jimoto-section-title,
.jimoto-common-title {
    margin: 0 0 12px;
    font-size: 20px;
    font-weight: 700;
    color: var(--jimoto-text);
    line-height: 1.5;
}

.jimoto-section-lead,
.jimoto-common-lead {
    margin: 0 0 14px;
    font-size: 14px;
    color: var(--jimoto-text-sub);
    line-height: 1.8;
}

/* ------------------------------
   共通ボタン
------------------------------ */
.jimoto-button,
.jimoto-common-button {
    display: inline-block;
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    background: var(--jimoto-main);
    border: none;
    border-radius: var(--jimoto-radius-sm);
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    line-height: 1.5;
    box-sizing: border-box;
}

.jimoto-button:hover,
.jimoto-common-button:hover {
    opacity: 0.9;
    color: #ffffff;
    text-decoration: none;
}

.jimoto-button-outline,
.jimoto-common-button-outline {
    display: inline-block;
    padding: 9px 15px;
    font-size: 14px;
    font-weight: 700;
    color: var(--jimoto-main);
    background: #ffffff;
    border: 1px solid var(--jimoto-main);
    border-radius: 999px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    line-height: 1.5;
    box-sizing: border-box;
}

.jimoto-button-outline:hover,
.jimoto-common-button-outline:hover {
    background: var(--jimoto-main-light);
    color: var(--jimoto-main);
    text-decoration: none;
}

/* ------------------------------
   共通注意書き
------------------------------ */
.jimoto-note,
.jimoto-common-note {
    margin: 14px 0 0;
    padding: 11px 12px;
    font-size: 12px;
    color: var(--jimoto-text-muted);
    background: #f8f8f8;
    border-radius: var(--jimoto-radius-sm);
    line-height: 1.8;
}

/* ------------------------------
   タブ周辺の軽い調整
------------------------------ */
body.jimoto-dashboard-page .tab-content,
body.jimoto-dashboard-page .tab-container,
body.jimoto-dashboard-page .tabs {
    box-sizing: border-box;
}

body.jimoto-dashboard-page .entry-content img {
    max-width: 100%;
    height: auto;
}

/* ------------------------------
   サイドバー共通調整
------------------------------ */
body.jimoto-dashboard-page .sidebar,
body.jimoto-dashboard-page #sidebar,
body.jimoto-dashboard-page .widget-area {
    box-sizing: border-box;
}

body.jimoto-dashboard-page .widget,
body.jimoto-dashboard-page .widget_text,
body.jimoto-dashboard-page .wp-block-group {
    box-sizing: border-box;
}

body.jimoto-dashboard-page .widget-title,
body.jimoto-dashboard-page .wp-block-heading,
body.jimoto-dashboard-page .widget h2,
body.jimoto-dashboard-page .widget h3 {
    margin-top: 0;
    margin-bottom: 12px;
    padding: 10px 12px;
    font-size: 16px;
    font-weight: 700;
    color: var(--jimoto-text);
    background: #f3f5f7;
    border-radius: var(--jimoto-radius-sm);
    line-height: 1.5;
}

body.jimoto-dashboard-page .widget a,
body.jimoto-dashboard-page .widget_text a {
    color: var(--jimoto-main);
    text-decoration: underline;
    text-underline-offset: 2px;
}

body.jimoto-dashboard-page .widget a:hover,
body.jimoto-dashboard-page .widget_text a:hover {
    opacity: 0.85;
}

body.jimoto-dashboard-page .widget ul,
body.jimoto-dashboard-page .widget_text ul {
    padding-left: 1.2em;
}

body.jimoto-dashboard-page .widget li,
body.jimoto-dashboard-page .widget_text li {
    margin-bottom: 8px;
    line-height: 1.7;
}

/* ------------------------------
   地元ページ内のフォーム共通
------------------------------ */
body.jimoto-dashboard-page input[type="text"],
body.jimoto-dashboard-page textarea {
    font-family: inherit;
}

body.jimoto-dashboard-page button {
    font-family: inherit;
}

/* ------------------------------
   スマホ共通調整
------------------------------ */
@media screen and (max-width: 768px) {
    body.jimoto-dashboard-page .entry-content {
        line-height: 1.75;
    }

    .jimoto-card-inner,
    .jimoto-common-card-inner {
        padding: 14px;
    }

    .jimoto-section-title,
    .jimoto-common-title {
        font-size: 18px;
    }

    .jimoto-button,
    .jimoto-common-button,
    .jimoto-button-outline,
    .jimoto-common-button-outline {
        width: 100%;
        padding: 11px 14px;
        font-size: 14px;
    }

    body.jimoto-dashboard-page .widget-title,
    body.jimoto-dashboard-page .wp-block-heading,
    body.jimoto-dashboard-page .widget h2,
    body.jimoto-dashboard-page .widget h3 {
        font-size: 15px;
        padding: 9px 11px;
    }
}

/* =========================================================
   スマホ専用：地元情報ブロック
========================================================= */

.jimoto-mobile-info-block {
    display: none;
}

@media screen and (max-width: 768px) {
    .jimoto-mobile-info-block {
        display: block;
        margin: 24px 0 0;
        padding: 0;
        box-sizing: border-box;
    }

    .jimoto-mobile-info-heading {
        margin: 0 0 14px;
        padding: 10px 12px;
        font-size: 17px;
        font-weight: 700;
        color: #222222;
        background: #f3f5f7;
        border-radius: 10px;
        line-height: 1.5;
    }

    .jimoto-mobile-info-widget {
        margin: 0 0 18px;
        padding: 0;
        box-sizing: border-box;
    }

    .jimoto-mobile-info-title {
        margin: 0 0 10px;
        padding: 10px 12px;
        font-size: 16px;
        font-weight: 700;
        color: #222222;
        background: #f3f5f7;
        border-radius: 10px;
        line-height: 1.5;
    }

    .jimoto-mobile-info-widget:last-child {
        margin-bottom: 0;
    }
}

/* =========================================================
   地元ポータル化：上部タブメニューを非表示
   内部のタブ切り替え機能は残す
========================================================= */

.jimoto-tabs {
    display: none !important;
}

.jimoto-tabs-wrapper {
    padding-top: 0;
}

.jimoto-tab-contents {
    margin-top: 0;
}

.jimoto-tab-content.active {
    animation: jimotoPortalFadeIn 0.18s ease-out;
}

@keyframes jimotoPortalFadeIn {
    from {
        opacity: 0;
        transform: translateY(4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =========================================================
   地元ポータル：詳細ページからマイ地元へ戻る
========================================================= */

.jimoto-detail-nav {
    margin: 0 0 16px;
    padding: 0;
}

.jimoto-detail-nav-bottom {
    margin: 22px 0 0;
    text-align: center;
}

.jimoto-back-home-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 700;
    color: #00377F;
    background: #f0f5ff;
    border: 1px solid #cbdcf2;
    border-radius: 999px;
    cursor: pointer;
    line-height: 1.5;
    box-sizing: border-box;
}

.jimoto-back-home-button:hover {
    color: #00377F;
    background: #e5efff;
}

@media screen and (max-width: 768px) {
    .jimoto-detail-nav {
        margin-bottom: 14px;
    }

    .jimoto-detail-nav-bottom {
        margin-top: 20px;
    }

    .jimoto-back-home-button {
        width: 100%;
        min-height: 42px;
        font-size: 14px;
    }
}

/* =========================================
   モーダル上部タイトルの非表示
   各カテゴリプラグイン側の見出しを優先する
========================================= */

.jimoto-modal-head > div {
    display: none;
}

.jimoto-modal-head {
    justify-content: flex-end;
    padding-bottom: 0;
    border-bottom: none;
}

.jimoto-modal-close {
    margin-left: auto;
}

/* =========================================================
   天気エリア：左見出し・日時表示
   ※天気本体の横並びは weather 側CSSを壊さない
========================================================= */

.jimoto-portal-weather-mini-head {
    display: block;
    margin: 0;
    padding: 0;
}

.jimoto-portal-weather-mini-head > div:first-child {
    display: block;
    margin: 0;
    padding: 0;
}

.jimoto-portal-weather-label {
    display: inline-block;
    margin: 0 0 8px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
    color: #ffffff;
    background: #00377F;
    border-radius: 999px;
    line-height: 1.5;
}

.jimoto-portal-weather-title {
    margin: 0 0 10px;
    font-size: 20px;
    font-weight: 800;
    color: #222222;
    line-height: 1.45;
    white-space: normal;
}

/* 日付・現在時刻カード */
.jimoto-portal-current-time {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    width: fit-content;
    min-width: 0;
    max-width: 230px;
    margin: 0;
    padding: 9px 12px;
    color: #00377F;
    background: #f0f5ff;
    border: 1px solid #cbdcf2;
    border-radius: 14px;
    text-align: left;
    box-sizing: border-box;
}

.jimoto-current-date {
    display: block;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
}

.jimoto-current-clock {
    display: block;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.35;
    white-space: nowrap;
}

/* =========================================================
   天気エリア：既存レイアウト保護
   3ブロック構成を崩さないため、grid指定はしない
========================================================= */

.jimoto-portal-weather-mini-body {
    box-sizing: border-box;
}

.jimoto-portal-weather-mini-body > * {
    min-width: 0;
}

/* 天気カード側が狭くなりすぎないようにする */
.jimoto-weather-box,
.jimoto-weather-widget,
.jimoto-weather-card,
.jimoto-weather-content,
.jimoto-weather-current,
.jimoto-weather-forecast {
    min-width: 0;
    box-sizing: border-box;
}

/* =========================================================
   スマホ：天気エリア調整
========================================================= */

@media screen and (max-width: 768px) {
    .jimoto-portal-weather-mini-head {
        margin-bottom: 12px;
    }

    .jimoto-portal-weather-title {
        font-size: 19px;
        line-height: 1.45;
    }

    .jimoto-portal-current-time {
        max-width: 100%;
        padding: 8px 11px;
    }

    .jimoto-current-date {
        font-size: 12px;
    }

    .jimoto-current-clock {
        font-size: 17px;
    }
}
/* =========================================================
   天気エリア：左側の日時ブロックを大きくして余白を活用
========================================================= */

/* 見出しを少し大きく */
.jimoto-portal-weather-title {
    margin: 0 0 14px;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.45;
}

/* 日時カードを大きめに */
.jimoto-portal-current-time {
    width: 100%;
    max-width: none;
    padding: 14px 16px;
    border-radius: 16px;
    background: linear-gradient(135deg, #f0f5ff 0%, #ffffff 100%);
    border: 1px solid #cbdcf2;
    box-shadow: 0 4px 14px rgba(0, 55, 127, 0.06);
}

/* 日付 */
.jimoto-current-date {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
}

/* 時刻を大きく見せる */
.jimoto-current-clock {
    margin-top: 2px;
    font-size: 28px;
    font-weight: 900;
    line-height: 1.25;
    letter-spacing: 0.02em;
}


/* スマホでは横幅固定を解除 */
@media screen and (max-width: 768px) {
    .jimoto-portal-weather-mini-head {
        width: 100%;
        min-width: 0;
        max-width: none;
        margin-bottom: 12px;
    }

    .jimoto-portal-weather-title {
        font-size: 20px;
        margin-bottom: 10px;
    }

    .jimoto-portal-current-time {
        width: 100%;
        padding: 12px 14px;
    }

    .jimoto-current-clock {
        font-size: 24px;
    }
}
/* =========================================================
   天気エリア：時刻カードは大きく、天気本体は崩さない
========================================================= */

/* 左側の見出しブロックは固定幅にしない */
.jimoto-portal-weather-mini-head {
    display: block;
    width: auto;
    min-width: 0;
    max-width: none;
    flex: 0 0 auto;
}

/* 見出し */
.jimoto-portal-weather-title {
    margin: 0 0 12px;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.45;
}

/* 時刻カードだけ大きくする */
.jimoto-portal-current-time {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    width: auto;
    min-width: 220px;
    max-width: 260px;
    padding: 13px 16px;
    color: #00377F;
    background: linear-gradient(135deg, #f0f5ff 0%, #ffffff 100%);
    border: 1px solid #cbdcf2;
    border-radius: 16px;
    box-shadow: 0 4px 14px rgba(0, 55, 127, 0.06);
    box-sizing: border-box;
}

.jimoto-current-date {
    display: block;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
}

.jimoto-current-clock {
    display: block;
    margin-top: 2px;
    font-size: 28px;
    font-weight: 900;
    line-height: 1.25;
    white-space: nowrap;
}

/* 天気本体側の横幅を守る */
.jimoto-weather-forecast,
.jimoto-weather-forecast-list,
.jimoto-weather-hourly,
.jimoto-weather-hourly-list {
    min-width: 0;
}

/* スマホでは時刻カードを自然に横幅いっぱいへ */
@media screen and (max-width: 768px) {
    .jimoto-portal-weather-mini-head {
        width: 100%;
        margin-bottom: 12px;
    }

    .jimoto-portal-current-time {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        padding: 12px 14px;
    }

    .jimoto-current-clock {
        font-size: 24px;
    }
}
/* =========================================================
   スマホ：時刻カードと天気カードの余白調整
========================================================= */

@media screen and (max-width: 768px) {
    .jimoto-portal-current-time {
        margin-bottom: 14px;
    }

    .jimoto-portal-weather-mini-head {
        margin-bottom: 14px;
    }
}