/*
Theme Name: Bonnisoft
Author: applchu
Description: Custom WooCommerce theme matching the main site
Version: 1.0.0
Tested up to: 6.9.7
Text Domain: bonnisoft
*/

/* --- Inline Styles from Main Site --- */


/* --- site.css from Main Site --- */
/* 2009-era public site theme */

/* Content overflow safeguards */
.box-content,
.news-post,
.blog-post,
.md-content {
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
    max-width: 100%;
}

.md-content pre,
.md-content code {
    white-space: pre-wrap;
    word-wrap: break-word;
    overflow-x: auto;
    max-width: 100%;
}

.md-content img {
    max-width: 100%;
    height: auto;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    padding: 0;
    background-color: #eef5e6;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0IiBoZWlnaHQ9IjQiPgo8cmVjdCB3aWR0aD0iNCIgaGVpZ2h0PSI0IiBmaWxsPSIjZWVmNWU2Ii8+CjxyZWN0IHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9IiNkZmVjZDQiLz4KPC9zdmc+');
    font-family: Verdana, Tahoma, Arial, sans-serif;
    font-size: 11px;
    color: #333;
    transition: background 0.3s, color 0.3s;
}

a { color: #2b7c05; text-decoration: none; }
a:hover { text-decoration: underline; }

.page-wrapper {
    width: 1150px;
    margin: 0 auto;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    border-left: 1px solid #dcdcdc;
    border-right: 1px solid #dcdcdc;
    transition: background 0.3s, border 0.3s;
}

.header {
    height: 110px;
    background: linear-gradient(to bottom, #f9fcf7 0%, #e6f2d9 100%);
    border-bottom: 1px solid #bcd8a5;
    padding: 15px 20px;
}

.logo-container { float: left; width: 300px; }
.logo-container img { max-height: 80px; width: auto; }

.top-tools { float: right; text-align: right; margin-top: 10px; }

.settings-panel { margin-bottom: 10px; color: #666; font-size: 10px; }
.settings-panel a { cursor: pointer; color: #666; margin-left: 10px; }
.settings-panel a.active { font-weight: bold; color: #2b7c05; text-decoration: underline; }

.search-box { display: inline-block; background: #fff; border: 1px solid #aebc9e; padding: 3px; border-radius: 3px; }
.search-input { border: none; font-size: 11px; width: 150px; outline: none; background: transparent; }
.search-btn,
.action-btn {
    background: #7cbd00;
    border: 1px solid #6aa300;
    color: white;
    font-size: 11px;
    font-weight: bold;
    cursor: pointer;
    padding: 2px 8px;
    border-radius: 2px;
}

.styled-input {
    width: 100%;
    border: 1px solid #ccc;
    padding: 2px;
    background: #fff;
    color: #333;
    font-size: 11px;
    outline: none;
    border-radius: 2px;
}

.nav-bar {
    height: 38px;
    background: linear-gradient(to bottom, #8fd600 0%, #7cbd00 50%, #6aa300 51%, #7cbd00 100%);
    border-top: 1px solid #aaff44;
    border-bottom: 1px solid #558800;
    padding: 0 10px;
}

.nav-list { list-style: none; margin: 0; padding: 0; height: 38px; }
.nav-list li { float: left; height: 38px; border-right: 1px solid #6aa300; border-left: 1px solid #9ce010; }
.nav-list li:first-child { border-left: none; }
.nav-list li a {
    display: block;
    height: 38px;
    line-height: 38px;
    padding: 0 20px;
    color: #fff;
    font-weight: bold;
    font-size: 12px;
    text-shadow: 0 1px 1px rgba(0,0,0,0.3);
}
.nav-list li a:hover { background: linear-gradient(to bottom, #9ce010 0%, #8fd600 50%, #7cbd00 51%, #8fd600 100%); }

.main-container { display: table; width: 100%; table-layout: fixed; border-collapse: collapse; }
.sidebar-left { display: table-cell; width: 180px; vertical-align: top; padding: 10px; background: #f4fcf0; border-right: 1px solid #e0e0e0; transition: background 0.3s; }
.content-center { display: table-cell; vertical-align: top; padding: 15px; }
.sidebar-right { display: table-cell; width: 220px; vertical-align: top; padding: 10px; background: #f9f9f9; border-left: 1px solid #e0e0e0; transition: background 0.3s; }

.box { margin-bottom: 15px; border: 1px solid #ccc; background: #fff; border-radius: 4px; }
.box .woo-main-box { border: none; }
.box-header {
    background: linear-gradient(to bottom, #f2f2f2 0%, #e0e0e0 100%);
    border-bottom: 1px solid #ccc;
    padding: 6px 10px;
    font-weight: bold;
    color: #444;
    font-size: 11px;
    text-transform: uppercase;
}
.box-header.green-theme {
    background: linear-gradient(to bottom, #e6f5d0 0%, #cce5a6 100%);
    border-bottom: 1px solid #aebc9e;
    color: #3b5e1a;
}
.box-content { padding: 10px; }

/* Glossy video player controls */
.custom-player-wrapper {
    position: relative;
    border-radius: 4px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5);
    overflow: hidden;
    border: 1px solid #333;
}

.custom-player-wrapper:fullscreen,
.custom-player-wrapper:-webkit-full-screen {
    border-radius: 0;
    border: none;
    background: #000;
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.custom-player-wrapper:fullscreen video,
.custom-player-wrapper:-webkit-full-screen video { max-height: none !important; height: calc(100vh - 35px); object-fit: contain; }

.glossy-bar {
    display: flex;
    align-items: center;
    background: linear-gradient(to bottom, #777 0%, #444 50%, #222 51%, #111 100%);
    border-top: 1px solid #888;
    padding: 5px;
    gap: 8px;
}

.player-btn {
    background: linear-gradient(to bottom, #f9f9f9 0%, #d4d4d4 50%, #c4c4c4 51%, #e6e6e6 100%);
    border: 1px solid #666;
    border-radius: 3px;
    color: #333;
    cursor: pointer;
    padding: 4px 10px;
    font-size: 11px;
    text-shadow: 0 1px 0 #fff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8), 0 1px 2px rgba(0,0,0,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
}
.player-btn:hover { background: linear-gradient(to bottom, #fff 0%, #e6e6e6 50%, #d4d4d4 51%, #f9f9f9 100%); }
.player-btn:active { background: linear-gradient(to bottom, #c4c4c4 0%, #a4a4a4 100%); box-shadow: inset 0 1px 3px rgba(0,0,0,0.5); }

.player-slider {
    flex: 1;
    -webkit-appearance: none;
    background: linear-gradient(to bottom, #111 0%, #333 100%);
    height: 10px;
    border-radius: 5px;
    border: 1px solid #555;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.8);
    cursor: pointer;
    margin: 0;
    padding: 0;
}
.player-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    background: linear-gradient(to bottom, #f9f9f9 0%, #c4c4c4 100%);
    border: 1px solid #666;
    border-radius: 50%;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8), 0 1px 2px rgba(0,0,0,0.5);
}

/* Product page */
.product-container { display: flex; gap: 15px; }
.product-art-wrapper { width: 200px; flex-shrink: 0; }
.product-art-img { width: 100%; height: auto; border: 1px solid #ccc; border-radius: 4px; }
.product-art-placeholder { width: 100%; height: 280px; border: 1px solid #ccc; display: flex; align-items: center; justify-content: center; color: #555; }
.product-info-wrapper { flex: 1; min-width: 0; }
.product-title { margin-top: 0; color: #d66a00; font-size: 16px; border-bottom: 1px dotted #ccc; padding-bottom: 5px; }
.product-meta { margin-bottom: 15px; }
.product-meta-item { font-size: 11px; margin-bottom: 5px; }
.product-meta-item.product-status .status-value { color: green; font-weight: bold; }
.product-description { font-size: 13px; line-height: 1.6; margin-bottom: 15px; }

.hero-banner { width: 100%; height: 200px; background: #000; margin-bottom: 20px; border: 1px solid #333; position: relative; overflow: hidden; border-radius: 4px; }
.hero-text { position: absolute; bottom: 0; left: 0; width: 100%; background: rgba(0,0,0,0.7); color: #fff; padding: 10px; }

.news-item { border-bottom: 1px dotted #ccc; padding: 8px 0; }
.news-item:last-child { border-bottom: none; }
.news-date { color: #7cbd00; font-weight: bold; margin-right: 5px; font-size: 10px; }
.new-badge { background: #ff3300; color: white; font-size: 9px; padding: 1px 3px; border-radius: 2px; margin-left: 5px; }

.game-spotlight { background: #fffde8; border: 1px solid #e6dbb5; padding: 10px; margin-bottom: 20px; }
.game-title { font-size: 14px; font-weight: bold; color: #d66a00; margin-bottom: 5px; border-bottom: 1px solid #e6dbb5; padding-bottom: 3px; }
.game-grid-item { float: left; width: 30%; margin-right: 2%; margin-bottom: 15px; border: 1px solid #ddd; padding: 5px; background: #fff; }
.game-grid-item:nth-child(3n) { margin-right: 0; }
.game-grid-img { width: 100%; height: 100%; object-fit: cover; object-position: top; }

.blog-post { margin-bottom: 20px; border-bottom: 1px solid #eee; padding-bottom: 20px; }
.ad-placeholder { width: 100%; height: 120px; background: #eee; color: #aaa; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; margin-bottom: 10px; font-size: 10px; }

.product-actions-panel { background: #f9f9f9; padding: 10px; border: 1px solid #eee; display: flex; flex-direction: column; gap: 10px; }
.cart-btn { width: 100%; box-sizing: border-box; background: #ff9900; border: 1px solid #cc7a00; color: white; cursor: pointer; font-size: 14px; font-weight: bold; padding: 8px 15px; border-radius: 3px; text-align: center; }
.cart-btn:hover { background: #e68a00; }
.steam-btn { width: 100%; box-sizing: border-box; display: block; text-align: center; background: #2a475e; border: 1px solid #1b2838; color: white; cursor: pointer; font-size: 14px; font-weight: bold; padding: 8px 15px; border-radius: 3px; text-decoration: none; }
.steam-btn:hover { background: #1b2838; }

.footer { background: #eef5e6; border-top: 1px solid #dcdcdc; padding: 15px; text-align: center; color: #777; font-size: 10px; transition: background 0.3s; }
.footer a { color: #555; margin: 0 5px; }

.side-menu ul { list-style: none; padding: 0; margin: 0; }
.side-menu li { border-bottom: 1px solid #e8e8e8; }
.side-menu li a { display: block; padding: 6px 5px; color: #555; background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1IiBoZWlnaHQ9IjEwIj48cGF0aCBkPSJNMCAwIEw1IDUgTDAgMTAiIGZpbGw9IiM3Y2JkMDAiLz48L3N2Zz4=') no-repeat 95% center; }
.side-menu li a:hover { background-color: #fff; color: #7cbd00; }

/* Dark mode */
body.dark-mode { background-color: #1a1a1a; background-image: none; color: #ccc; }
body.dark-mode .page-wrapper { background-color: #222; border-color: #333; box-shadow: 0 0 15px rgba(0,0,0,0.5); }
body.dark-mode .header { background: linear-gradient(to bottom, #2a3326 0%, #1a2216 100%); border-bottom: 1px solid #333; }
body.dark-mode .settings-panel,
body.dark-mode .settings-panel a { color: #888; }
body.dark-mode .settings-panel a.active { color: #9ce010; }
body.dark-mode .nav-bar { background: linear-gradient(to bottom, #4a6600 0%, #3d5500 50%, #304400 51%, #3d5500 100%); border-top: 1px solid #5a7710; border-bottom: 1px solid #222; }
body.dark-mode .nav-list li { border-right: 1px solid #304400; border-left: 1px solid #5a7710; }
body.dark-mode .sidebar-left,
body.dark-mode .sidebar-right { background: #252525; border-color: #333; }
body.dark-mode .box { background: #2a2a2a; border-color: #444; }
body.dark-mode .box-header { background: linear-gradient(to bottom, #333 0%, #222 100%); border-bottom: 1px solid #444; color: #aaa; }
body.dark-mode .box-header.green-theme { background: linear-gradient(to bottom, #2c3a20 0%, #1f2b15 100%); border-bottom: 1px solid #445533; color: #8fa070; }
body.dark-mode .side-menu li { border-bottom: 1px solid #333; }
body.dark-mode .side-menu li a { color: #aaa; }
body.dark-mode .side-menu li a:hover { background-color: #333; color: #9ce010; }
body.dark-mode .search-box { background: #333; border-color: #555; }
body.dark-mode .search-input { color: #fff; }
body.dark-mode .game-spotlight { background: #2d2a20; border-color: #443a20; color: #ccc; }
body.dark-mode .game-title { color: #ffaa55; border-bottom-color: #443a20; }
body.dark-mode .news-item { border-bottom: 1px dotted #444; }
body.dark-mode .ad-placeholder { background: #333; border-color: #444; color: #666; }
body.dark-mode .footer { background: #1a1a1a; border-top: 1px solid #333; color: #555; }
body.dark-mode a { color: #7cbd00; }
body.dark-mode .nav-list li a:hover { background: linear-gradient(to bottom, #5a7710 0%, #4a6600 50%, #3d5500 51%, #4a6600 100%); color: #f0f0f0; }
body.dark-mode .game-grid-item { background: #2a2a2a; border-color: #444; }
body.dark-mode .action-btn { background: #4a6600; border-color: #304400; color: #e0e0e0; }
body.dark-mode .styled-input { background: #333; border-color: #555; color: #fff; }
body.dark-mode .product-actions-panel { background: #2a2a2a; border-color: #444; }

.clearfix::after { content: ""; clear: both; display: table; }

/* Shared page components */
.section-title { font-size: 14px; color: #d66a00; border-bottom: 1px dotted #ccc; padding-bottom: 5px; }
.body-copy { line-height: 1.5; }
.body-copy-spaced { margin-bottom: 10px; }
.history-list { line-height: 1.6; padding-left: 20px; }
.page-intro { margin-bottom: 15px; }

.game-card-art { height: 120px; margin-bottom: 5px; display: flex; align-items: center; justify-content: center; color: #555; overflow: hidden; }
.game-card-link { display: block; width: 100%; height: 100%; }
.game-card-placeholder-link { display: flex; align-items: center; justify-content: center; color: inherit; text-decoration: none; }
.game-card-placeholder-title { font-size: 16px; font-weight: bold; margin-bottom: 5px; }
.game-card-placeholder-copy { font-size: 10px; }
.game-card-genre { font-size: 10px; color: #777; }
.game-card-status { font-size: 10px; color: green; font-weight: bold; }

.hero-gradient { width: 100%; height: 100%; background: linear-gradient(45deg, #1a2a6c, #b21f1f, #fdbb2d); }
.spotlight-layout { display: flex; gap: 10px; margin-top: 10px; }
.spotlight-art { width: 140px; text-align: center; }
.spotlight-art-image { width: 100%; height: auto; border: 1px solid #999; border-radius: 3px; }
.spotlight-copy { flex: 1; }
.spotlight-meta { margin-top: 0; }
.spotlight-description { font-size: 11px; line-height: 1.4; }
.more-info-button { background: #ff9900; border: 1px solid #cc7a00; color: white; cursor: pointer; font-size: 10px; padding: 3px 8px; display: inline-block; text-decoration: none; }
.news-footer-link { text-align: right; margin-top: 5px; font-size: 10px; }

.blog-post-single,
.news-post-single { border-bottom: none; }
.post-title { margin: 0 0 5px; font-size: 14px; }
.post-title-blog { color: #d66a00; }
.post-title-news { color: #3b5e1a; }
.post-list-title { margin: 0 0 5px; font-size: 12px; }
.blog-title-link { color: #d66a00; text-decoration: none; }
.post-date { font-size: 10px; color: #7cbd00; display: block; margin-bottom: 5px; }
.post-date-single { margin-bottom: 15px; }
.post-content { font-size: 12px; line-height: 1.6; }
.post-excerpt { margin: 0; font-size: 11px; line-height: 1.5; }
.read-more-link { font-size: 10px; display: inline-block; margin-top: 5px; }
.back-link-row { margin-top: 20px; }
.back-link { font-size: 11px; }
.news-list-item { padding: 10px 0; }
.news-list-heading { margin-bottom: 5px; }
.news-title-link { font-size: 12px; font-weight: bold; }

.success-notice { background: #dff0d8; border: 1px solid #d6e9c6; color: #3c763d; padding: 10px; margin-bottom: 10px; }
.form-field { margin-bottom: 10px; }
.form-label { display: block; font-weight: bold; margin-bottom: 3px; }
.form-control { width: 100%; padding: 4px; border: 1px solid #ccc; }
.form-textarea { font-family: sans-serif; }
.submit-button { background: #7cbd00; color: white; border: 1px solid #6aa300; padding: 5px 15px; cursor: pointer; font-weight: bold; }

.partner-links { text-align: center; }
.partner-ad { margin-bottom: 5px; }
.partner-image { max-width: 100%; height: auto; border: 1px solid #ddd; }
.newsletter-description { margin: 0 0 5px; font-size: 10px; }
.newsletter-button { margin-top: 5px; width: 100%; }
.social-link-row { margin-bottom: 5px; }
.social-icon { width: 16px; text-align: center; }
.social-icon-twitter { color: #1da1f2; }
.social-icon-web { color: #0285ff; }
.discord-header { background: linear-gradient(to bottom, #7289da 0%, #5b6eae 100%); color: white; border-bottom: 1px solid #4e5d94; text-shadow: 0 1px 1px rgba(0,0,0,0.3); }
.discord-content { text-align: center; }
.discord-description { margin: 0 0 10px; font-size: 10px; }
.discord-button { display: inline-block; background: #7289da; color: white; border: 1px solid #4e5d94; padding: 5px 15px; text-decoration: none; font-weight: bold; border-radius: 3px; font-size: 11px; }
.discord-icon { margin-right: 5px; }
.footer-copyright { font-size: 9px; color: #aaa; }

.product-gallery { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
.product-gallery-image { width: 100%; height: auto; object-fit: cover; cursor: pointer; border: 1px solid #ccc; border-radius: 4px; }
.product-trailer { margin-bottom: 15px; }
.product-trailer-frame { border: 1px solid #ccc; border-radius: 4px; }
.product-trailer-video { aspect-ratio: 16 / 9; background: #000; display: block; }
.product-cart-form { margin: 0; }
.lightbox { display: none; position: fixed; inset: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 9999; align-items: center; justify-content: center; cursor: pointer; }
.lightbox.is-open { display: flex; }
.lightbox-image { max-width: 90%; max-height: 90%; border: 5px solid #fff; border-radius: 4px; box-shadow: 0 0 20px rgba(0,0,0,0.5); }
.embedded-video { max-width: 100%; height: auto; display: block; margin: 10px 0; border-radius: 4px; }
/* --- WooCommerce Customizations --- */

.woocommerce-store-notice, 
.woocommerce-products-header,
.woocommerce-products-header__title,
.page-title,
.wp-block-woocommerce-product-new {
    display: none !important;
}

.woocommerce-account .woocommerce {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.woocommerce-MyAccount-navigation {
    flex: 0 0 200px;
    margin-bottom: 15px; 
    border: 1px solid #ccc; 
    background: #fff; 
    border-radius: 4px; 
    overflow: hidden;
}

.woocommerce-MyAccount-navigation::before {
    content: 'My Account';
    display: block;
    background: linear-gradient(to bottom, #e6f5d0 0%, #cce5a6 100%);
    border-bottom: 1px solid #aebc9e;
    color: #3b5e1a;
    padding: 6px 10px;
    font-weight: bold;
    font-size: 11px;
    text-transform: uppercase;
}

.woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid #e8e8e8;
}

.woocommerce-MyAccount-navigation li:last-child {
    border-bottom: none;
}

.woocommerce-MyAccount-navigation li a {
    display: block; 
    padding: 8px 10px; 
    color: #555; 
    font-size: 12px;
    text-decoration: none;
    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1IiBoZWlnaHQ9IjEwIj48cGF0aCBkPSJNMCAwIEw1IDUgTDAgMTAiIGZpbGw9IiM3Y2JkMDAiLz48L3N2Zz4=') no-repeat 95% center;
}

.woocommerce-MyAccount-navigation li a:hover,
.woocommerce-MyAccount-navigation li.is-active a {
    background-color: #f9f9f9; 
    color: #7cbd00; 
}

.woocommerce-MyAccount-content {
    flex: 1;
    min-width: 0;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 4px;
    padding: 20px;
    font-size: 14px;
}
.woocommerce-MyAccount-content p {
    margin-top: 0;
}

body.dark-mode .woocommerce-MyAccount-navigation,
body.dark-mode .woocommerce-MyAccount-content {
    background: #2a2a2a; 
    border-color: #444;
}
body.dark-mode .woocommerce-MyAccount-navigation::before {
    background: linear-gradient(to bottom, #2c3a20 0%, #1f2b15 100%); 
    border-bottom: 1px solid #445533; 
    color: #8fa070;
}
body.dark-mode .woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid #333;
}
body.dark-mode .woocommerce-MyAccount-navigation li a {
    color: #aaa;
}
body.dark-mode .woocommerce-MyAccount-navigation li a:hover,
body.dark-mode .woocommerce-MyAccount-navigation li.is-active a {
    background-color: #333; 
    color: #9ce010;
}

.woocommerce button.button, 
.woocommerce input.button {
    background: #7cbd00;
    border: 1px solid #6aa300;
    color: white;
    font-size: 17px;
    font-weight: bold;
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 3px;
}
.woocommerce button.button:hover, 
.woocommerce input.button:hover {
    background: #6aa300;
}

/* --- Layout fixes --- */
.woo-main-box {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
	padding: 15px;
}
.woo-main-box > .box-content {
    padding: 0 !important;
}

/* Fix broken banner */
.coming-soon-footer-banner {
    display: none !important;
}

.woocommerce form .form-row .input-text, .woocommerce form .form-row select {
max-width: 100%;
}

/* --- WooCommerce Notices (Glossy) --- */
.woocommerce-message, 
.woocommerce-info, 
.woocommerce-error, 
.woocommerce-noreviews, 
p.no-comments {
    padding: 10px 15px !important;
    margin-bottom: 20px !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 0 rgba(255,255,255,0.7) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1), inset 0 1px 0 rgba(255,255,255,0.8) !important;
    list-style: none !important;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
    display: none !important; /* Hide default icon */
}

/* Success Message (Glossy Green) */
.woocommerce-message {
    background: linear-gradient(to bottom, #e6f5d0 0%, #cce5a6 100%) !important;
    border: 1px solid #aebc9e !important;
    color: #3b5e1a !important;
    border-top: 1px solid #aebc9e !important; /* Override Woo top border */
}

/* Info Message (Glossy Steam Blue) */
.woocommerce-info, .woocommerce-noreviews, p.no-comments {
    background: linear-gradient(to bottom, #e0f0fa 0%, #cce0f0 100%) !important;
    border: 1px solid #a0c0e0 !important;
    color: #2a475e !important;
    border-top: 1px solid #a0c0e0 !important;
}

/* Error Message (Glossy Red) */
.woocommerce-error {
    background: linear-gradient(to bottom, #fce4e4 0%, #fccacb 100%) !important;
    border: 1px solid #e59999 !important;
    color: #cc0000 !important;
    border-top: 1px solid #e59999 !important;
}

.woocommerce-error li {
    margin: 0 !important;
    padding: 0 !important;
}

/* Button inside notices (e.g. "View Cart") */
.woocommerce-message .button, 
.woocommerce-info .button,
.woocommerce-error .button {
    float: right;
    margin-top: -4px;
    background: #fff !important;
    border: 1px solid #ccc !important;
    color: #555 !important;
    text-shadow: none !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
}
.woocommerce-message .button:hover, 
.woocommerce-info .button:hover,
.woocommerce-error .button:hover {
    background: #f0f0f0 !important;
    color: #333 !important;
}

/* Dark mode overrides for notices */
body.dark-mode .woocommerce-message, 
body.dark-mode .woocommerce-info, 
body.dark-mode .woocommerce-error {
    text-shadow: 0 1px 0 rgba(0,0,0,0.5) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1) !important;
}
body.dark-mode .woocommerce-message {
    background: linear-gradient(to bottom, #2c3a20 0%, #1f2b15 100%) !important;
    border-color: #445533 !important;
    color: #8fa070 !important;
}
body.dark-mode .woocommerce-info {
    background: linear-gradient(to bottom, #1b2838 0%, #111a26 100%) !important;
    border-color: #2a475e !important;
    color: #66c0f4 !important;
}
body.dark-mode .woocommerce-error {
    background: linear-gradient(to bottom, #4a1111 0%, #300a0a 100%) !important;
    border-color: #662222 !important;
    color: #e59999 !important;
}
body.dark-mode .woocommerce-message .button, 
body.dark-mode .woocommerce-info .button,
body.dark-mode .woocommerce-error .button {
    background: #333 !important;
    border-color: #555 !important;
    color: #aaa !important;
}
body.dark-mode .woocommerce-message .button:hover, 
body.dark-mode .woocommerce-info .button:hover,
body.dark-mode .woocommerce-error .button:hover {
    background: #444 !important;
    color: #fff !important;
}

/* --- WooCommerce Single Product Layout --- */
.woocommerce div.product {
    display: flex !important;
    gap: 15px !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important;
}
.woocommerce div.product::before,
.woocommerce div.product::after {
    display: none !important; /* Remove clearfix that breaks flex */
}

/* Product Art (Left column) */
.woocommerce div.product div.images,
.woocommerce-page div.product div.images {
    width: 200px !important;
    float: none !important;
    margin-bottom: 0 !important;
}
.woocommerce div.product div.images img {
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 100%;
    height: auto;
}
body.dark-mode .woocommerce div.product div.images img {
    border-color: #444;
}

/* Product Info (Right column) */
.woocommerce div.product div.summary,
.woocommerce-page div.product div.summary {
    flex: 1 !important;
    width: auto !important;
    float: none !important;
    margin-bottom: 0 !important;
    clear: none !important;
}

/* Product Title */
.woocommerce div.product .product_title {
    margin-top: 0 !important; 
    color: #d66a00 !important; 
    font-size: 16px !important; 
    border-bottom: 1px dotted #ccc !important; 
    padding-bottom: 5px !important;
    line-height: 1.2 !important;
}
body.dark-mode .woocommerce div.product .product_title {
    color: #ffaa55 !important; 
    border-bottom-color: #443a20 !important;
}

/* Price */
.woocommerce div.product p.price {
    font-weight: bold;
    color: #333;
    font-size: 17px;
}
body.dark-mode .woocommerce div.product p.price {
    color: #ccc;
}

/* Custom Description (Bottom row) */
.product-description.md-content {
    width: 100%;
    margin-top: 20px;
}

/* --- WooCommerce Cart Blocks Styling --- */

/* Cart Main Container (Left side) */
.wc-block-components-main {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 20px;
}

/* Cart Items Table */
.wc-block-cart-items {
    border-collapse: collapse;
    width: 100%;
}
.wc-block-cart-items__header {
    background: linear-gradient(to bottom, #f2f2f2 0%, #e0e0e0 100%);
    border-bottom: 1px solid #ccc;
}
.wc-block-cart-items th {
    padding: 10px;
    text-transform: uppercase;
    font-size: 11px;
    color: #444;
    font-weight: bold;
    text-align: left;
}
.wc-block-cart-items td {
    padding: 15px 10px;
    border-bottom: 1px solid #e8e8e8;
}

/* Remove button icon */
.wc-block-cart-item__remove-link svg {
    fill: #cc0000;
}
.wc-block-cart-item__remove-link:hover svg {
    fill: #990000;
}

/* Cart Sidebar (Right side - Totals) */
.wc-block-components-sidebar {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    overflow: hidden;
}

/* Cart Totals Header */
h2.wc-block-cart__totals-title {
    background: linear-gradient(to bottom, #e6f5d0 0%, #cce5a6 100%);
    border-bottom: 1px solid #aebc9e;
    color: #3b5e1a;
    padding: 10px 15px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
    margin: 0;
}

/* Totals Wrapper padding */
.wc-block-components-totals-wrapper {
    padding: 15px;
}

/* Quantity inputs */
.wc-block-components-quantity-selector {
    border: 1px solid #ccc;
    border-radius: 3px;
    background: #f9f9f9;
}
.wc-block-components-quantity-selector__input {
    border: none;
    background: transparent;
}
.wc-block-components-quantity-selector__button {
    background: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
    border: none;
    color: #333;
}
.wc-block-components-quantity-selector__button:hover {
    background: #ccc;
}

.woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals {
	width: 100% !important;
}

.sk-card.coupon-wrapper {
    border: none;
	margin: 0 !important;
	padding-left: 0;
    padding-right: 0;
}

/* Coupon Apply Button (Green) */
.wc-block-components-totals-coupon__button {
    background: #7cbd00 !important;
    border: 1px solid #6aa300 !important;
    color: white !important;
    font-size: 11px !important;
    font-weight: bold !important;
    border-radius: 3px !important;
    text-shadow: 0 1px 0 rgba(0,0,0,0.2) !important;
}
.wc-block-components-totals-coupon__button:hover {
    background: #6aa300 !important;
}

/* Proceed to Checkout Button (Orange) */
.wc-block-cart__submit-button {
    background: #ff9900 !important;
    border: 1px solid #cc7a00 !important;
    color: white !important;
    font-size: 14px !important;
    font-weight: bold !important;
    border-radius: 3px !important;
    padding: 10px 20px !important;
    text-shadow: 0 1px 0 rgba(0,0,0,0.2) !important;
    display: block;
    text-align: center;
}
.wc-block-cart__submit-button:hover {
    background: #e68a00 !important;
}

/* Coupon input */
.wc-block-components-text-input input {
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
    background: #fff !important;
}

/* Dark Mode Overrides */
body.dark-mode .wc-block-components-main,
body.dark-mode .wc-block-components-sidebar {
    background: #2a2a2a;
    border-color: #444;
}
body.dark-mode .wc-block-cart-items__header {
    background: linear-gradient(to bottom, #333 0%, #222 100%);
    border-bottom: 1px solid #444;
}
body.dark-mode .wc-block-cart-items th {
    color: #aaa;
}
body.dark-mode .wc-block-cart-items td {
    border-bottom: 1px solid #333;
}
body.dark-mode h2.wc-block-cart__totals-title {
    background: linear-gradient(to bottom, #2c3a20 0%, #1f2b15 100%);
    border-bottom: 1px solid #445533;
    color: #8fa070;
}
body.dark-mode .wc-block-components-quantity-selector {
    background: #333;
    border-color: #555;
}
body.dark-mode .wc-block-components-quantity-selector__input {
    color: #ccc;
}
body.dark-mode .wc-block-components-quantity-selector__button {
    background: linear-gradient(to bottom, #444 0%, #222 100%);
    color: #ccc;
}
body.dark-mode .wc-block-components-text-input input {
    background: #333 !important;
    border-color: #555 !important;
    color: #fff !important;
}

/* --- WooCommerce Cart Blocks Styling Fixes --- */

/* Parent layout for the cart */
.wc-block-components-sidebar-layout,
.wp-block-woocommerce-filled-cart-block {
    display: flex !important;
    gap: 20px !important;
    align-items: flex-start !important;
}

/* Cart Main Container (Left side) */
.wc-block-components-main {
    flex: 1 !important;
    background: #fff !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    padding: 15px !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
}

/* Cart Sidebar (Right side - Totals) */
.wc-block-components-sidebar {
    flex: 0 0 300px !important; /* Fixed width for the totals */
    background: #fff !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* Cart Totals Header */
h2.wc-block-cart__totals-title,
.wp-block-woocommerce-cart-order-summary-heading-block {
    background: linear-gradient(to bottom, #e6f5d0 0%, #cce5a6 100%) !important;
    border-bottom: 1px solid #aebc9e !important;
    color: #3b5e1a !important;
    padding: 10px 15px !important;
    font-weight: bold !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    margin: 0 !important;
}

/* Cart Items Table Header */
.wc-block-cart-items__header {
    background: linear-gradient(to bottom, #f2f2f2 0%, #e0e0e0 100%) !important;
    border-bottom: 1px solid #ccc !important;
}
.wc-block-cart-items th {
    padding: 10px !important;
    text-transform: uppercase !important;
    font-size: 11px !important;
    color: #444 !important;
    font-weight: bold !important;
    text-align: left !important;
}

/* Fix product image sizing */
.wc-block-cart-item__image {
    width: 80px !important;
    padding-right: 15px !important;
}
.wc-block-cart-item__image img {
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
}

/* Proceed to Checkout Button */
.wc-block-cart__submit-button {
    background: #ff9900 !important;
    border: 1px solid #cc7a00 !important;
    color: white !important;
    font-size: 14px !important;
    font-weight: bold !important;
    border-radius: 3px !important;
    padding: 10px 20px !important;
    text-shadow: 0 1px 0 rgba(0,0,0,0.2) !important;
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
.wc-block-cart__submit-button:hover {
    background: #e68a00 !important;
}

/* Empty cart widget fix */
.widget_shopping_cart_content {
    font-size: 12px !important;
    color: #555 !important;
}


/* Hide verbose product descriptions inside the cart items table */
.wc-block-components-product-metadata__description {
    display: none !important;
}

/* Fix table borders */
.wc-block-cart-items {
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    overflow: hidden !important;
}
.wc-block-cart-items th,
.wc-block-cart-items td {
    border-bottom: 1px solid #e8e8e8 !important;
}

/* Ensure gap works for older grid/flex implementations */
.wc-block-components-sidebar-layout.is-large {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 20px !important;
}
.wc-block-components-sidebar-layout.is-large .wc-block-components-main {
    flex: 1 1 auto !important;
    margin-right: 0 !important;
}
.wc-block-components-sidebar-layout.is-large .wc-block-components-sidebar {
    flex: 0 0 300px !important;
    margin-left: 0 !important;
}

/* --- Custom Override Templates Styling (Saikey Layout -> Bonnisoft Style) --- */

:root {
    --sk-text-muted: #777;
    --sk-glass-border: #ccc;
    --sk-sidebar-bg: transparent;
}
body.dark-mode {
    --sk-text-muted: #aaa;
    --sk-glass-border: #444;
}

.saikey-checkout-wrapper {
    margin-top: 15px;
}

/* Layout */
.saikey-checkout-wrapper .two-column-layout {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}
.saikey-checkout-wrapper .col-left {
    flex: 1;
    min-width: 0;
}
.saikey-checkout-wrapper .col-right {
    flex: 0 0 300px;
    min-width: 0;
}

@media (max-width: 768px) {
    .saikey-checkout-wrapper .two-column-layout {
        flex-direction: column;
    }
    .saikey-checkout-wrapper .col-right {
        flex: 1;
        width: 100%;
    }
}

/* Boxes */
.sk-card {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 20px;
}

/* Cart Table Header */
.cart-table-header {
    background: linear-gradient(to bottom, #f2f2f2 0%, #e0e0e0 100%);
    border-bottom: 1px solid #ccc;
    padding: 10px 15px;
    font-weight: bold;
    color: #444;
    font-size: 9px;
    text-transform: uppercase;
    margin: -15px -15px 15px -15px;
    display: flex;
}
.cart-table-header > div {
    flex: 1;
}

/* Right Sidebar Header (Cart Totals / Order Summary) */
.cart_totals h2.section-title,
#order_review_heading {
    background: linear-gradient(to bottom, #e6f5d0 0%, #cce5a6 100%) !important;
    border-bottom: 1px solid #aebc9e !important;
    color: #3b5e1a !important;
    padding: 10px 15px !important;
    font-weight: bold !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    margin: -15px -15px 15px -15px !important;
    display: block !important;
}

/* Cart Items */
.cart-items-container .cart-item {
    display: flex;
    align-items: center;
    padding: 15px 0;
}
.cart-item-product.product-thumbnail {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 15px;
}
.cart-item-product.product-thumbnail img {
    width: 80px;
    height: auto;
    border: 1px solid #ccc;
    border-radius: 3px;
}
.product-name a {
    color: #555;
    font-weight: bold;
    text-decoration: none;
}
.product-name a:hover {
    color: #7cbd00;
}

/* Cart totals rows */
.cart-totals-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid #e8e8e8;
    font-size: 13px;
}

/* Form styling */
.saikey-checkout-wrapper input[type="text"],
.saikey-checkout-wrapper input[type="email"],
.saikey-checkout-wrapper input[type="tel"],
.saikey-checkout-wrapper select,
.saikey-checkout-wrapper textarea {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-sizing: border-box;
}

/* Buttons */
.saikey-checkout-wrapper .checkout-button,
.saikey-checkout-wrapper #place_order {
    background: #ff9900 !important;
    border: 1px solid #cc7a00 !important;
    color: white !important;
    font-size: 14px !important;
    font-weight: bold !important;
    border-radius: 3px !important;
    padding: 12px 20px !important;
    text-shadow: 0 1px 0 rgba(0,0,0,0.2) !important;
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    cursor: pointer;
}
.saikey-checkout-wrapper .checkout-button:hover,
.saikey-checkout-wrapper #place_order:hover {
    background: #e68a00 !important;
}

/* Apply button */
.saikey-checkout-wrapper .button[name="apply_coupon"] {
    background: #7cbd00 !important;
    border: 1px solid #6aa300 !important;
    color: white !important;
    font-size: 11px !important;
    font-weight: bold !important;
    border-radius: 3px !important;
    cursor: pointer;
}

/* Dark mode overrides */
body.dark-mode .sk-card {
    background: #2a2a2a;
    border-color: #444;
}
body.dark-mode .cart-table-header {
    background: linear-gradient(to bottom, #333 0%, #222 100%);
    border-bottom: 1px solid #444;
    color: #aaa;
}
body.dark-mode .cart_totals h2.section-title,
body.dark-mode #order_review_heading {
    background: linear-gradient(to bottom, #2c3a20 0%, #1f2b15 100%) !important;
    border-bottom: 1px solid #445533 !important;
    color: #8fa070 !important;
}
body.dark-mode .cart-items-container .cart-item,
body.dark-mode .cart-totals-row {
    border-bottom-color: #333;
}
body.dark-mode .cart-item-product.product-thumbnail img {
    border-color: #444;
}
body.dark-mode .saikey-checkout-wrapper input,
body.dark-mode .saikey-checkout-wrapper select,
body.dark-mode .saikey-checkout-wrapper textarea {
    background: #333;
    border-color: #555;
    color: #fff;
}

/* --- Cart Block Padding Adjustments --- */

.wc-block-components-sidebar-layout.is-large .wc-block-components-sidebar {
    padding-right: 0 !important;
}

.wc-block-components-sidebar-layout.is-large .wc-block-components-main {
    padding: 0 !important;
}

/* Ensure elements inside main have padding so they aren't hugging the borders */
.wc-block-components-sidebar-layout.is-large .wc-block-components-main > * {
    padding: 15px;
}

/* Keep the table header flush if needed, but the request says give elements inside padding */
/* But specifically if the table is inside, let's pad the table wrapper */
.wp-block-woocommerce-cart-items-block {
    padding: 15px !important;
    box-sizing: border-box !important;
}

/* For the sidebar, ensure the inner wrapper has padding */
.wc-block-components-sidebar-layout.is-large .wc-block-components-sidebar > * {
    padding: 15px;
}

/* The header in the sidebar should still look right */
.wc-block-components-sidebar-layout.is-large .wc-block-components-sidebar .wp-block-woocommerce-cart-order-summary-heading-block {
    margin: -15px -15px 15px -15px !important; /* Pull it to the edges of the padded container */
    width: calc(100% + 30px) !important;
}

/* --- Cart Grid Alignment Fixes --- */

/* Align header and row perfectly using CSS Grid */
.cart-table-header,
.cart-items-container .cart-item {
    display: grid !important;
    grid-template-columns: 3fr 1fr 1fr 30px !important;
    align-items: center !important;
    gap: 15px !important;
}

/* Reset the previous flex styles that broke the alignment */
.cart-table-header > div {
    flex: none !important;
}

.cart-item-product.product-thumbnail {
    flex: none !important;
    display: flex !important; /* Keep internal flex for image+text */
    align-items: center !important;
    gap: 15px !important;
}

/* Fix product title size */
.cart-item-product .product-name a {
    font-size: 12px !important;
    color: #444 !important;
}

/* Fix remove button */
.product-remove .cart-item-remove {
    display: inline-block;
    color: #cc0000 !important;
    font-weight: bold;
    font-size: 20px;
    text-decoration: none;
    line-height: 1;
}
.product-remove .cart-item-remove:hover {
    color: #990000 !important;
}

/* Fix right sidebar gap */
.col-right .sk-card {
    margin-bottom: 20px;
}
.product-description.md-content {
    white-space: pre-wrap;
}

/* Prevent Subtotal column from wrapping */
.shop_table th.product-total,
.shop_table td.product-total,
.cart-table-header .product-total {
    width: 25% !important;
    min-width: 90px !important;
    white-space: nowrap !important;
}

/* --- WooCommerce Mini Cart Styling (Sidebar) --- */
.woocommerce-mini-cart.cart_list.product_list_widget {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.woocommerce-mini-cart-item.mini_cart_item {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    border-bottom: 1px solid #e8e8e8 !important;
    padding: 10px 0 !important;
    position: relative !important;
}
/* Ensure the last item doesn't have a double border with the subtotal */
.woocommerce-mini-cart-item.mini_cart_item:last-child {
    border-bottom: none !important;
}

.woocommerce-mini-cart-item a.remove {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    left: 0 !important;
    color: #cc0000 !important;
    font-weight: bold !important;
    font-size: 18px !important;
    text-decoration: none !important;
    line-height: 1 !important;
    width: 20px !important;
    height: 20px !important;
    text-align: center !important;
}
.woocommerce-mini-cart-item a.remove:hover {
    color: #990000 !important;
}

.woocommerce-mini-cart-item > a:not(.remove) {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    text-decoration: none !important;
    color: #444 !important;
    font-weight: bold !important;
    font-size: 12px !important;
    padding-left: 25px !important; /* space for the remove button */
    flex: 1 !important;
    line-height: 1.2 !important;
}

.woocommerce-mini-cart-item img {
    width: 40px !important;
    height: auto !important;
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
    margin: 0 !important; /* clear woo float overrides */
    float: none !important;
}

.woocommerce-mini-cart-item .quantity {
    display: block !important;
    width: 100% !important;
    text-align: right !important;
    font-size: 13px !important;
    color: #666 !important;
    margin-top: 5px !important;
    font-weight: bold !important;
}

.woocommerce-mini-cart__total {
    border-top: 1px solid #ccc !important;
    padding-top: 15px !important;
    margin-top: 5px !important;
    text-align: center !important;
    font-size: 14px !important;
    color: #444 !important;
}

.woocommerce-mini-cart__buttons {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin-top: 15px !important;
    padding: 0 !important;
}

.woocommerce-mini-cart__buttons .button {
    display: block !important;
    text-align: center !important;
    padding: 10px 12px !important;
    border-radius: 3px !important;
    font-weight: bold !important;
    font-size: 12px !important;
    text-decoration: none !important;
    margin: 0 !important;
}

.woocommerce-mini-cart__buttons .button:not(.checkout) {
    background: #f2f2f2 !important;
    border: 1px solid #ccc !important;
    color: #444 !important;
}
.woocommerce-mini-cart__buttons .button:not(.checkout):hover {
    background: #e6e6e6 !important;
}

.woocommerce-mini-cart__buttons .button.checkout {
    background: #ff9900 !important;
    border: 1px solid #cc7a00 !important;
    color: white !important;
    text-shadow: 0 1px 0 rgba(0,0,0,0.2) !important;
}
.woocommerce-mini-cart__buttons .button.checkout:hover {
    background: #e68a00 !important;
}

.woocommerce-mini-cart__empty-message {
    text-align: center !important;
    padding: 15px 0 !important;
    color: #777 !important;
    font-style: italic !important;
    margin: 0 !important;
}