/* OCP brand override — orange #ff6b00 as dominant accent */
:root {
    --ocp-primary: #ff6b00;
    --ocp-primary-dark: #e85d00;
    --ocp-primary-light: #fff5ed;
}

/* Prices */
.price,
.price-new,
.product-thumb .price,
.product-thumb .price-new,
.products-row .price,
.products-row .price-new,
.product-info .price,
.product-info .price-new,
.price_block .price-new,
.special-price,
.price-block .price-new {
    color: var(--ocp-primary) !important;
    font-weight: 800 !important;
}

/* Primary buttons */
.btn-primary,
.btn-default.btn-primary,
button[type="submit"].btn-primary,
.button.btn-primary,
.cart .btn-primary,
.product-info .btn-primary,
#button-cart,
#button-search,
.btn.btn-primary,
button.btn-primary {
    background: var(--ocp-primary) !important;
    background-color: var(--ocp-primary) !important;
    background-image: none !important;
    border-color: var(--ocp-primary) !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
#button-cart:hover,
button.btn-primary:hover {
    background: var(--ocp-primary-dark) !important;
    background-color: var(--ocp-primary-dark) !important;
    border-color: var(--ocp-primary-dark) !important;
    color: #fff !important;
}

/* Links */
a,
.nav-link,
.product-thumb h4 a:hover,
.list-group-item a:hover {
    color: var(--ocp-primary);
}
a:hover {
    color: var(--ocp-primary-dark);
}

/* Pagination */
.pagination > li > a,
.pagination > li > span {
    color: var(--ocp-primary);
}
.pagination > li.active > span,
.pagination > li.active > a,
.pagination > .active > span,
.pagination > .active > a {
    background: var(--ocp-primary) !important;
    background-color: var(--ocp-primary) !important;
    border-color: var(--ocp-primary) !important;
    color: #fff !important;
}

/* Breadcrumb */
.breadcrumb a {
    color: var(--ocp-primary);
}

/* Section titles with left accent */
.ocp-title {
    border-left: 4px solid var(--ocp-primary);
    padding-left: 12px;
}

/* Stickers */
.sticker-ns.newproduct,
.product-label.label-new {
    background: #2da44e !important;
}
.sticker-ns.hot,
.sticker-ns.sale,
.product-label.label-hot,
.product-label.label-sale {
    background: var(--ocp-primary) !important;
}

/* Header search button */
.header_box_search button[type="submit"],
.header_box_search button,
#search button,
#search .btn,
.search button.btn {
    background: var(--ocp-primary) !important;
    background-color: var(--ocp-primary) !important;
    border-color: var(--ocp-primary) !important;
    color: #fff !important;
}

/* Cart/wishlist icon hover */
.header_cart:hover,
.header_wishlist:hover {
    color: var(--ocp-primary);
}

/* Form focus rings */
.form-control:focus {
    border-color: var(--ocp-primary) !important;
    box-shadow: 0 0 0 0.15rem rgba(255, 107, 0, 0.18) !important;
}

/* Tab nav active */
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    border-bottom-color: var(--ocp-primary) !important;
    color: var(--ocp-primary) !important;
}

/* === card-cta-orange-pill override === */
.ocp-card-buy, .ocp-buy-cta { background: #ff6b00 !important; border-radius: 999px !important; color: #fff !important; border: 0 !important; }
.ocp-card-buy:hover, .ocp-buy-cta:hover { background: #e25e00 !important; color: #fff !important; }

/* === card-hover-overlay-icons === */
/* Ensure card is positioning context (home cards already have it; categories too) */
.ocp-card { position: relative; }

/* New 3-icon stack used on home.twig static cards */
.ocp-card-actions {
    position: absolute;
    top: 10px;
    right: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    opacity: 0;
    transform: translateX(8px);
    transition: opacity .18s ease, transform .18s ease;
    z-index: 6;
    pointer-events: none;
}
.ocp-card:hover .ocp-card-actions,
.ocp-card:focus-within .ocp-card-actions {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
}
.ocp-card-action {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #e3e7ed;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #1a1a2e;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
    transition: background .15s, color .15s, border-color .15s, transform .15s;
    padding: 0;
    line-height: 1;
}
.ocp-card-action:hover {
    background: #ff6b00;
    color: #fff;
    border-color: #ff6b00;
    transform: scale(1.08);
}
.ocp-card-action svg { display: block; }

/* Touch / small screens — always visible (no hover) */
@media (hover: none), (max-width: 768px) {
    .ocp-card-actions {
        opacity: 1;
        transform: none;
        pointer-events: auto;
    }
    .ocp-card-action { width: 32px; height: 32px; }
}

/* === Alias category.twig's pre-existing .ocp-tools / .ocp-tool to the new look === */
.ocp-card .ocp-tools {
    position: absolute;
    top: 10px;
    right: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    opacity: 0;
    transform: translateX(8px);
    transition: opacity .18s ease, transform .18s ease;
    z-index: 6;
    pointer-events: none;
}
.ocp-card:hover .ocp-tools,
.ocp-card:focus-within .ocp-tools {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
}
.ocp-card .ocp-tool {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #e3e7ed;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #1a1a2e;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
    transition: background .15s, color .15s, border-color .15s, transform .15s;
    padding: 0;
    line-height: 1;
}
.ocp-card .ocp-tool:hover {
    background: #ff6b00;
    color: #fff;
    border-color: #ff6b00;
    transform: scale(1.08);
}
.ocp-card .ocp-tool svg { width: 16px; height: 16px; display: block; }
@media (hover: none), (max-width: 768px) {
    .ocp-card .ocp-tools {
        opacity: 1;
        transform: none;
        pointer-events: auto;
    }
    .ocp-card .ocp-tool { width: 32px; height: 32px; }
}