/**
 * Template: snow-monkey
 * Theme Name: zushi hanabi 2026
 * Description: Zushi Hanabi Thene
 * Version: 2026.2.19
 */

/* wave */


body {
    background-color: #fff6dc !important;
}

/* ブログカードは透明で背景色とかぶっちゃうので白に */
.wp-oembed-blog-card {
    background-color: #fff;
}

.woocommerce-form {
    background-color: #fff;
}

.woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-content {
    background-color: #fff;
    padding: 10px;
}


.wp-block-table {
    background-color: #fff !important;
}

table.shop_table {
    background-color: #fff;
}

.waves {
    position: relative;
    width: 100%;
    height: 15vh;
    margin-bottom: -7px;
    /*Fix for safari gap*/
    min-height: 100px;
    max-height: 150px;
}



.l-footer .c-copyright {
    background-color: #046997;
}

/* Animation */

.parallax>use {
    animation: move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite;
}

.parallax>use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
}

.parallax>use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
}

.parallax>use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
}

.parallax>use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
}

@keyframes move-forever {
    0% {
        transform: translate3d(-90px, 0, 0);
    }

    100% {
        transform: translate3d(85px, 0, 0);
    }
}

/*Shrinking for mobile*/
@media (max-width: 768px) {
    .waves {
        height: 40px;
        min-height: 40px;
    }

    .content {
        height: 30vh;
    }

    h1 {
        font-size: 24px;
    }
}


li.menu-item {
    white-space: nowrap;
}

/* woocommerce */

form.woocommerce-form-register .form-row-last {
    float: left !important;
}

form.woocommerce-form-register .form-row-first {
    float: right !important;
}

form.cart div.quantity {
    display: inline !important;
}


form.edit-account .form-row-first {
    float: right;
}

form.edit-account .form-row-last {
    float: left;
}



ul.hanabi-products form.cart div.quantity {
    margin-top: 1em !important;
}

ul.hanabi-products div.product p.in-stock {
    display: none;
}

ul.hanabi-products .woocommerce-Price-amount.amount {
    font-size: 1.4em;
}



.woocommerce ul.products li.product a img {
    width: auto;
    max-height: 200px;
    margin: auto;
    margin-bottom: 1em;
}

.sale-badge {
    background-color: red;
    color: white;
    padding: 5px;
    font-size: 14px;
    font-weight: bold;
    position: absolute;
    top: 10px;
    right: 10px;
}

li.product .woocommerce p.price del,
li.product .woocommerce p.price del bdi {
    color: red !important;

}

li.product .woocommerce p.price ins {
    font-size: 1.5em;
    font-weight: bold;
}

/* readonly */
form.woocommerce-checkout input.input-text:read-only {
    background-color: #ddd;
}

.woocommerce span.onsale,
li.product span.onsale {
    background-color: red !important;
}

/* cross-sell */
div.cross-sells ul.products li.product {
    background-color: #fff;
    padding: 10px;
}


.woocommerce-customer-details address {
    background-color: #fff;
}



@media only screen and (max-width: 767px) {
    .woocommerce ul.products li.product {
        width: 100% !important;
    }
}



/* */
.width50 {
    background-color: rgb(0, 47, 81, 0.8) !important;
    width: 65%;
    color: #fff;
    padding: 18px;
    font-family: "Hiragino Mincho ProN";
}

@media only screen and (max-width: 800px) {
    .width50 {
        width: 100%;
    }

    .width50 .c-container {
        padding: 0 15px;
    }
}

.width50 .wp-block-table {
    background-color: inherit !important;
    margin-top: 0px;
    margin-bottom: 0px;
}

.c-section.p-section-front-page-content {
    padding-top: 0px;
}

header.l-header,
.p-drop-nav {
    background-color: #002f51 !important;
}


.woocommerce span.onsale {
    background-color: red;
    left: inherit;
}

del bdi {
    color: red;
}

.product_description {
    height: 200px;

}

/* Responsive table styles */
@media only screen and (max-width: 767px) {

    /* Table becomes a block element */
    .width50 table {
        display: block;
        width: 100%;
        overflow-x: hidden;
    }

    /* Table headers and cells become inline-block elements */
    .width50 th,
    .width50 td {
        display: inline-block;
        box-sizing: border-box;
    }

    /* Define the width for table headers and cells */
    .width50 th,
    .width50 td {
        width: 100%;
        /* Adjust the width as needed, e.g. 33% for 3 columns */
    }

    /* Optional: Add some padding and borders for readability */
    .width50 th,
    .width50 td {
        padding: 10px;
        border-bottom: 1px solid #ccc;
    }
}

.width50 table td img {
    display: inline-block;
}


.nopadding {
    padding: 20px 0px
}

.nopadding .wp-block-table table[style*=border-width] td,
.nopadding .wp-block-table table[style*=border-width] th,
.nopadding .wp-block-table table[style*=border-width] tr {
    padding: 0px;
}

.wpcf7-response-output {
    background-color: #fff;
}

.smb-faq__item {
    background-color: #fff;
    margin-bottom: 30px;
    padding: 20px;
}

.smb-faq__item__question__label {
    color: blue;
}

.smb-faq__item__answer__label {
    color: red;
}


/* slick slider */
.slick-slide {
    margin: 0 0px;
}
.slick-slide img {
    width: 100%;
}


button.slick-next {
    right: 0;
}
button.slick-prev {
    left: 0;
    z-index:100;
}
.slick-arrow.slick-prev:before {
    color: red;
    /* font-size:2em; */
}
.slick-arrow.slick-next:before {
    color: red;
    /* font-size:2em; */
}

table.table td.vacant {
    background-color:#fff;
}
table.table td.occupied {
    background-color: #333;
    text-align:center;
}
table.table td.onhold {
    background-color: #ffff00;
    text-align:center;
}

td.hanabi_sheet, td.hanabi_chair {
    cursor: pointer; 
}

.c-responsive-table table.table-slide {
    margin:auto;
    background-color:#fff;
    text-align:center;
}
.c-responsive-table table.table-slide  td, .c-responsive-table table.table-slide  th {
    padding:5px;
    text-align:center;
}





/* reservation */

.res_onhold {
    background-color: yellow;
    border: 1px solid #000;
    padding: 10px;
    display: inline-block;
    font-weight: bold;
}
.table.table-chairs th {
    color:#000;
    background-color:#ccc;
}
/* 海の部分 */
.sea {
    background: linear-gradient(to bottom, #1e90ff, #87ceeb); /* 海のグラデーション */
    flex: 1; /* 上部を画面の半分程度に */
    position: relative;
}

/* 固定された波にグラデーション */
.wave {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 20px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.7), rgba(135, 206, 235, 0.5)); /* 波のグラデーション */
    border-radius: 50%;
}

/* 砂浜の部分 */
.sand {
    background: linear-gradient(to bottom, #f4e1a5, #d8c38e); /* 砂浜のグラデーション */
    flex: 1; /* 下部を画面の半分程度に */

}

.woocommerce-EditAccountForm h2, .woocommerce-EditAccountForm legend {
    font-size: 1.5em;
    font-weight: bold;
    color: #002f51;
    background-color:#87ceeb;
    padding: 10px;
}