@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;700&family=Shippori+Mincho+B1:wght@400;700&display=swap');

/* ===============================================
   ラッパー・全体
   =============================================== */
.oh-wrap {
    font-family: 'Noto Serif JP', serif;
    max-width: 360px;
    margin: 0 auto;
    padding: 8px 0 16px;
}
.oh-error {
    padding: 12px 16px;
    background: #fdf2f2;
    border: 1px solid #e8c0c0;
    border-radius: 4px;
    font-size: 13px;
    color: #c04040;
    max-width: 360px;
    margin: 0 auto;
}

/* ===============================================
   吊り紐
   =============================================== */
.oh-strings {
    display: flex;
    justify-content: center;
    gap: 44px;
    margin-bottom: -3px;
}
.oh-strings span {
    display: block;
    width: 1.5px;
    height: 32px;
    background: linear-gradient(to bottom, #9a7850, #6a5030);
}

/* ===============================================
   木札本体
   =============================================== */
.oh-fuda {
    background: #ffffff;
    border-radius: 3px;
    border: 1.5px solid #c8a870;
    box-shadow: 0 6px 28px rgba(120,80,30,.14), 0 2px 6px rgba(120,80,30,.08);
    overflow: hidden;
    transition: transform .4s ease;
}
.oh-wrap:hover .oh-fuda {
    transform: rotate(-0.5deg) translateY(-2px);
}

/* 定休日バージョン */
.oh-fuda.oh-teikyu {
    background: #ffffff;
    border-color: #c8b898;
}
.oh-fuda.oh-teikyu .oh-topbar {
    background: #8a7060;
}
.oh-fuda.oh-teikyu .oh-bottombar {
    background: linear-gradient(90deg, transparent, #b8a880, #c8b890, #b8a880, transparent);
}
.oh-fuda.oh-teikyu .oh-name { color: #6a5840; }
.oh-fuda.oh-teikyu .oh-header { border-bottom-color: #d8c8a8; }

/* 上部朱ライン */
.oh-topbar {
    height: 5px;
    background: #c8281e;
}
/* 下部金ライン */
.oh-bottombar {
    height: 3px;
    background: linear-gradient(90deg, transparent, #c8a870, #d4a830, #c8a870, transparent);
}

/* ===============================================
   木札内コンテンツ
   =============================================== */
.oh-body {
    padding: 20px 22px 18px;
}

/* 店名ヘッダ */
.oh-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e0c898;
}
.oh-logo {
    width: 48px;
    height: 48px;
    object-fit: contain;
    flex-shrink: 0;
    mix-blend-mode: multiply;
}
.oh-header-txt {}
.oh-sub {
    font-size: .62rem;
    color: #9a7850;
    letter-spacing: .32em;
    margin-bottom: 3px;
}
.oh-name {
    font-family: 'Shippori Mincho B1', serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: #2a1e14;
    letter-spacing: .28em;
}

/* ===============================================
   セッション一覧
   =============================================== */
.oh-sessions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 14px;
}

/* セッション行（基本） */
.oh-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 13px;
    border-radius: 3px;
    border: 1px solid #e0c898;
    background: #fefcf8;
    opacity: .6;
}

/* 営業中 */
.oh-row.oh-active {
    background: #fffdf8;
    border-color: #c8281e;
    border-left: 3px solid #c8281e;
    opacity: 1;
}
/* 準備中 */
.oh-row.oh-prep {
    background: #fffdf8;
    border-color: #d4a830;
    border-left: 3px solid #d4a830;
    opacity: 1;
}
/* 終了 */
.oh-row.oh-done {
    opacity: .45;
}

.oh-row-body { flex: 1; }
.oh-row-label {
    font-family: 'Shippori Mincho B1', serif;
    font-size: .63rem;
    color: #9a7850;
    letter-spacing: .2em;
    margin-bottom: 2px;
}
.oh-row-status {
    font-family: 'Shippori Mincho B1', serif;
    font-size: .98rem;
    font-weight: 700;
    color: #2a1e14;
    letter-spacing: .08em;
    line-height: 1.2;
}
.oh-row.oh-done .oh-row-status { color: #b0a090; }
.oh-row.oh-prep .oh-row-status { color: #a07020; }
.oh-row-hours {
    font-size: .67rem;
    color: #9a8070;
    letter-spacing: .04em;
    margin-top: 2px;
}

/* ピル（バッジ） */
.oh-pill {
    flex-shrink: 0;
    font-family: 'Noto Serif JP', serif;
    font-size: 9px;
    font-weight: 700;
    padding: 4px 9px;
    border-radius: 2px;
    letter-spacing: .04em;
    text-align: center;
    line-height: 1.4;
    animation: oh-blink 2s ease-in-out infinite;
}
.oh-pill-open {
    background: #c8281e;
    color: white;
}
.oh-pill-gold {
    background: #c8a030;
    color: #2a1e14;
}
.oh-pill-prep {
    background: #f5e8c0;
    color: #9a7020;
    border: 1px solid #d4a830;
}
@keyframes oh-blink { 0%,100%{opacity:1} 50%{opacity:.65} }

/* ===============================================
   定休日内部
   =============================================== */
.oh-teikyu-inner {
    padding: 20px 14px;
    text-align: center;
}
.oh-teikyu-txt {
    font-family: 'Shippori Mincho B1', serif;
    font-size: 1.05rem;
    font-weight: 700;
    color: #6a5840;
    letter-spacing: .15em;
    margin-bottom: 6px;
}
.oh-teikyu-sub {
    font-size: .68rem;
    color: #9a8070;
    letter-spacing: .1em;
}

/* ===============================================
   フッター（日付）
   =============================================== */
.oh-footer {
    padding-top: 12px;
    border-top: 1px solid #e0c898;
}
.oh-date {
    font-size: .67rem;
    color: #9a8070;
    letter-spacing: .1em;
    text-align: right;
}
.oh-fuda.oh-teikyu .oh-footer { border-top-color: #d8c8a8; }

/* ===============================================
   レスポンシブ
   =============================================== */
@media (max-width: 400px) {
    .oh-wrap { max-width: 100%; padding: 8px 12px 16px; }
    .oh-body { padding: 16px 16px 14px; }
    .oh-name { font-size: 1.1rem; }
}
