/*
Theme Name: reducerecod
Theme URI: https://savko.dev/
Author: Savko
Author URI: https://savko.dev/
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: reducerecod
*/

/* ---------- 404 page: centered narrow box ---------- */
.not-found-box {
    max-width: 640px;
    margin: 32px auto;
    text-align: center;
    padding: 40px 32px !important;
}
.not-found-box .not-found-page-title {
    margin: 0 0 16px;
    text-align: center;
}
.not-found-box .page-content {
    text-align: center;
}
.not-found-box .page-content p {
    margin: 0;
}

/* ---------- Search results page ---------- */
.search-summary {
    margin: 0 0 18px;
    color: #555;
}
.search-section {
    margin-bottom: 28px;
}
.search-section .section-heading {
    font-size: 18px;
    margin: 0 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
}
.search-results-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.search-results-list > li {
    list-style: none !important;
    margin: 0 !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #f3f3f3 !important;
    display: grid !important;
    grid-template-columns: 110px 1fr;
    gap: 14px;
    align-items: center;
}
.search-results-list > li:last-child { border-bottom: 0 !important; }
.search-results-list .result-thumb {
    width: 110px;
    height: 60px;
    overflow: hidden;
    background: #fafafa;
    border: 1px solid #eee;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.search-results-list .result-thumb img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 60px !important;
    object-fit: contain !important;
}
.search-results-list .result-body {
    min-width: 0;
}
.search-results-list .result-title,
.search-results-list a.result-title:link,
.search-results-list a.result-title:visited {
    display: block !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    color: #222 !important;
    text-decoration: none !important;
    line-height: 1.3 !important;
}
.search-results-list a.result-title:hover { color: #ff9900 !important; }
.search-results-list .result-excerpt {
    display: block;
    color: #666;
    font-size: 13px;
    margin-top: 4px;
    line-height: 1.4;
}
.search-results-list .meta { color: #999; font-size: 13px; margin-left: 6px; }
.search-results-list .result-thumb-placeholder {
    font-weight: 800;
    font-size: 18px;
    color: #999;
    letter-spacing: 1px;
}

/* ---------- Pagination (search, blog, archives) ---------- */
.navigation.pagination,
nav.pagination {
    margin: 24px 0 8px;
    display: block;
}
.navigation.pagination .nav-links,
nav.pagination .nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    align-items: center;
}
.page-numbers {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    border: 1px solid #e2e2e2;
    border-radius: 4px;
    color: #444 !important;
    font-weight: 600;
    text-decoration: none !important;
    background: #fff;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.page-numbers:hover {
    background: #ff9900;
    color: #fff !important;
    border-color: #ff9900;
}
.page-numbers.current {
    background: #111;
    color: #fff !important;
    border-color: #111;
    cursor: default;
}
.page-numbers.dots {
    border: 0;
    background: transparent;
    color: #999 !important;
    padding: 0 4px;
    min-width: auto;
}
.page-numbers.prev,
.page-numbers.next {
    padding: 0 14px;
}

/* ---------- Coupon cards: small left accent for term-direct coupons ---------- */
.coupon-listing-item.c-cat {
    border-left: 4px solid #ff9900;
}

/* Sale type badge: white text */
.coupon-listing-item .c-type .c-sale {
    color: #fff;
}

/* Code-button styling is fully handled by CouponHub's original style.css
   (orange "GET CODE" pill on the left with triangle cut, yellow code on the
   right). We only nudge the placeholder code-text away when the coupon has
   no real code value (term-direct coupons stored without `data-code`). */
.coupon-button-type a.coupon-button.coupon-code .code-text:empty {
    display: none;
}

/* ---------- Sidebar (#secondary) card styling ---------- */
#secondary.widget-area {
    background: #ffffff;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    padding: 20px 24px;
}
#secondary.widget-area .widget,
#secondary.widget-area aside {
    margin-bottom: 24px;
}
#secondary.widget-area .widget:last-child,
#secondary.widget-area aside:last-child {
    margin-bottom: 0;
}
#secondary.widget-area .wp-block-heading,
#secondary.widget-area .widget-title {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
    color: #222;
}
#secondary.widget-area ul.wp-block-categories,
#secondary.widget-area ul.wp-block-categories-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
#secondary.widget-area ul.wp-block-categories li,
#secondary.widget-area ul.wp-block-categories-list li {
    padding: 7px 0;
    border-bottom: 1px solid #f3f3f3;
}
#secondary.widget-area ul.wp-block-categories li:last-child,
#secondary.widget-area ul.wp-block-categories-list li:last-child {
    border-bottom: 0;
}
#secondary.widget-area ul.wp-block-categories li a,
#secondary.widget-area ul.wp-block-categories-list li a {
    color: #333;
    text-decoration: none;
    display: block;
    transition: color 0.15s, padding-left 0.15s;
}
#secondary.widget-area ul.wp-block-categories li a:hover,
#secondary.widget-area ul.wp-block-categories-list li a:hover {
    color: #ff9900;
    padding-left: 4px;
}
#secondary.widget-area .cat-item-none {
    color: #999;
    font-style: italic;
}

/* Two-column layout for static pages only (about-us / contact / etc).
   Scoped to .container-page so it doesn't break taxonomy/single-store
   templates that share the .right-sidebar class but render the Popular
   Stores widget as a sibling block. */
#content-wrap.container-page.right-sidebar {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}
#content-wrap.container-page.right-sidebar #primary {
    flex: 1 1 auto;
    min-width: 0;
}
#content-wrap.container-page.right-sidebar #secondary {
    flex: 0 0 280px;
}
@media (max-width: 900px) {
    #content-wrap.container-page.right-sidebar { flex-direction: column; }
    #content-wrap.container-page.right-sidebar #secondary { flex-basis: auto; width: 100%; }
}

/* ---------- Breadcrumbs: orange link color ---------- */
.ui.breadcrumb.breadcrumbs a,
.ui.breadcrumb.breadcrumbs a:link,
.ui.breadcrumb.breadcrumbs a:visited {
    color: #ff9900 !important;
}
.ui.breadcrumb.breadcrumbs a:hover,
.ui.breadcrumb.breadcrumbs a:focus {
    color: #e58800 !important;
}

/* ---------- Coupon modal: 950px wide, centered, black accent buttons ---------- */
/* Horizontal centering only — Semantic UI sets vertical position itself
   (inline `margin-top: -<half_h>` or absolute `top: <px>` for .scrolling). */
.ui.modal.coupon-modal {
    width: 950px !important;
    max-width: calc(100vw - 32px) !important;
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ---------- Mobile (<= 600px) ---------- */
@media (max-width: 600px) {
    .ui.modal.coupon-modal {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        max-height: calc(100vh - 32px) !important;
        overflow-y: auto !important;
    }
    .ui.modal.coupon-modal .coupon-header {
        padding: 12px !important;
    }
    .ui.modal.coupon-modal .coupon-header .coupon-store-thumb {
        max-width: 80px;
        margin-bottom: 8px;
    }
    .ui.modal.coupon-modal .coupon-header .coupon-title {
        font-size: 16px !important;
        line-height: 1.3 !important;
    }
    .ui.modal.coupon-modal .coupon-content {
        padding: 12px !important;
    }
    /* Stack the code box + Copy button vertically on narrow screens */
    .ui.modal.coupon-modal .modal-code .ui.fluid.action.input {
        display: block !important;
    }
    .ui.modal.coupon-modal .modal-code .ui.fluid.action.input > input,
    .ui.modal.coupon-modal .modal-code .ui.fluid.action.input > .code-text {
        width: 100% !important;
        display: block !important;
        text-align: center;
        padding: 14px 12px !important;
        font-size: 18px !important;
    }
    .ui.modal.coupon-modal .modal-code .ui.fluid.action.input > .ui.button,
    .ui.modal.coupon-modal .modal-code .ui.fluid.action.input > .btn {
        width: 100% !important;
        margin-top: 8px !important;
        border-radius: 4px !important;
        justify-content: center;
    }
    /* Vote/save row + Go-to-store stack vertically */
    .ui.modal.coupon-modal .clearfix > .user-ratting,
    .ui.modal.coupon-modal .clearfix > .go-store {
        float: none !important;
        display: block !important;
        margin: 8px 0 !important;
        width: 100% !important;
        text-align: center;
    }
    .ui.modal.coupon-modal a.go-store {
        width: 100% !important;
        text-align: center;
    }
    .ui.modal.coupon-modal .coupon-footer ul {
        flex-direction: column;
    }
    .ui.modal.coupon-modal .coupon-footer ul li {
        float: none !important;
        margin: 4px 0 !important;
    }
}

/* "Copie" / "Go To Store" buttons inside the modal — black */
.ui.modal.coupon-modal .modal-code .ui.button,
.ui.modal.coupon-modal .modal-code .btn,
.ui.modal.coupon-modal .modal-code .btn_secondary,
.ui.modal.coupon-modal a.go-store,
.ui.modal.coupon-modal a.go-store.ui.button,
.ui.modal.coupon-modal .ui.button.btn_secondary {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #000 !important;
}
.ui.modal.coupon-modal .modal-code .ui.button:hover,
.ui.modal.coupon-modal .modal-code .btn:hover,
.ui.modal.coupon-modal .modal-code .btn_secondary:hover,
.ui.modal.coupon-modal a.go-store:hover,
.ui.modal.coupon-modal .ui.button.btn_secondary:hover {
    background-color: #1a1a1a !important;
    color: #fff !important;
    border-color: #1a1a1a !important;
}
