/* =====================================================================
   HikaShop – CL:AIRE styling (product page + category listing)
   Matches the site: Source Sans Pro, CL:AIRE lime green, clean cards.
   Paste into Gantry 5 > Styles/Custom CSS (custom.scss) or into
   HikaShop > Configuration > Display > "Frontend CSS" (custom file).
   ===================================================================== */

.hikashop_product_page {
    --claire-green:      #bbc415;
    --claire-green-dark: #858d00;
    --claire-ink:        #09171e;
    --claire-muted:      #6b7276;
    --claire-line:       #e3e6d6;
    --claire-pale:       #f6f8e8;
    font-family: sourcesanspro, Helvetica, Arial, sans-serif;
}

/* ---------- Title ---------- */
.hikashop_product_page h1 {
    font-size: 28px;
    font-weight: 700;
    color: var(--claire-ink);
    margin: 0 0 24px;
    padding-bottom: 14px;
    border-bottom: 3px solid var(--claire-green);
}

/* ---------- Image card (left) ---------- */
.hikashop_product_page .hikashop_product_left_part .hikashop_global_image_div {
    background: var(--claire-pale);
    border-radius: 10px;
    padding: 24px;
}
.hikashop_product_page #hikashop_main_image {
    width: 100%;
    max-width: 260px;
    height: auto;
    border-radius: 6px;
}

/* ---------- Purchase card (right) ---------- */
.hikashop_product_page .hikashop_product_right_part {
    background: #fff;
    border: 1px solid var(--claire-line);
    border-radius: 10px;
    padding: 24px 28px;
    box-shadow: 0 2px 10px rgba(9, 23, 30, 0.06);
}

/* ---------- Price ---------- */
.hikashop_product_page .hikashop_product_price_main,
.hikashop_product_page .hikashop_product_price_full,
.hikashop_product_page .hikashop_product_price_main span {
    font-family: sourcesanspro, Helvetica, Arial, sans-serif !important;
    font-style: normal !important;
}
.hikashop_product_page .hikashop_product_price_main {
    display: block;
    margin-bottom: 20px;
    color: var(--claire-muted);
    font-size: 15px;
}
.hikashop_product_page .hikashop_product_price_main .hikashop_product_price {
    display: block;
    font-size: 32px;
    line-height: 1.1;
    font-weight: 700;
    color: var(--claire-ink) !important;
    margin-bottom: 4px;
}
.hikashop_product_page .hikashop_product_price_main .hikashop_product_price_per_unit {
    font-size: 14px;
    color: var(--claire-muted);
}

/* ---------- Characteristic dropdown (e.g. Small / Medium / Large) ---------- */
.hikashop_product_page .hikashop_product_characteristics table,
.hikashop_product_page .hikashop_product_characteristics_table {
    width: 100%;
    border: 0 !important;
    border-collapse: collapse;
    margin: 0 0 20px;
}
.hikashop_product_page .hikashop_product_characteristics table td,
.hikashop_product_page .hikashop_product_characteristics_table td {
    display: block;
    border: 0 !important;
    padding: 0 !important;
}
.hikashop_product_page .hikashop_product_characteristics table td:first-child,
.hikashop_product_page .hikashop_product_characteristics_table td:first-child {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--claire-muted);
    margin-bottom: 6px;
}
.hikashop_product_page .hikashop_product_right_part select {
    width: 100%;
    max-width: 100%;
    height: 46px;
    padding: 0 40px 0 14px;
    font-family: inherit;
    font-size: 16px;
    color: var(--claire-ink);
    background-color: #fff;
    border: 1px solid #cfd4c0;
    border-radius: 6px;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23858d00' stroke-width='2'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.hikashop_product_page .hikashop_product_right_part select:hover {
    border-color: var(--claire-green-dark);
}
.hikashop_product_page .hikashop_product_right_part select:focus {
    outline: none;
    border-color: var(--claire-green-dark);
    box-shadow: 0 0 0 3px rgba(187, 196, 21, 0.3);
}

/* ---------- Add to cart button ---------- */
.hikashop_product_page .hikashop_product_quantity_main {
    margin-top: 8px;
}
.hikashop_product_page .hikabtn.hikacart {
    display: block;
    width: 100%;
    padding: 14px 24px;
    font-family: inherit;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.3px;
    color: #fff !important;
    background: var(--claire-green) !important;
    border: 0 !important;
    border-radius: 6px;
    box-shadow: none;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
}
.hikashop_product_page .hikabtn.hikacart:hover,
.hikashop_product_page .hikabtn.hikacart:focus {
    background: var(--claire-green-dark) !important;
}
.hikashop_product_page .hikabtn.hikacart:active {
    transform: translateY(1px);
}

/* ---------- Description below ---------- */
.hikashop_product_page .hikashop_product_description_main {
    margin-top: 32px;
    color: #444;
    font-size: 16px;
    line-height: 1.6;
}

/* ---------- Mobile: stack the columns with a gap ---------- */
@media (max-width: 767px) {
    .hikashop_product_page .hikashop_product_left_part {
        margin-bottom: 20px;
    }
    .hikashop_product_page .hikashop_product_right_part {
        padding: 20px;
    }
}


/* =====================================================================
   CATEGORY LISTING (the grid of category tiles)
   ===================================================================== */

.hikashop_categories_listing_main,
.hikashop_category_information {
    --claire-green:      #bbc415;
    --claire-green-dark: #858d00;
    --claire-ink:        #09171e;
    --claire-line:       #e3e6d6;
    font-family: sourcesanspro, Helvetica, Arial, sans-serif;
}

/* Page heading ("product category") */
.hikashop_categories_listing_main h1,
.hikashop_category_information h1,
.com_hikashop.view-category h1 {
    font-size: 28px;
    font-weight: 700;
    color: var(--claire-ink, #09171e);
    text-transform: capitalize;
    margin: 0 0 24px;
    padding-bottom: 14px;
    border-bottom: 3px solid #bbc415;
}

/* Grid: even columns with a proper gap (replaces HikaShop's narrow
   padded columns that squashed the tiles) */
.hikashop_categories_listing_main .hikashop_subcategories > .hk-row-fluid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
    gap: 24px !important;
    margin: 0 !important;
}
.hikashop_categories_listing_main .hikashop_subcategories > .hk-row-fluid::before,
.hikashop_categories_listing_main .hikashop_subcategories > .hk-row-fluid::after {
    display: none !important;
}
.hikashop_categories_listing_main .hikashop_category {
    grid-column: auto !important;
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Each tile: card that fills its grid cell, equal heights per row */
.hikashop_categories_listing_main .hikashop_container,
.hikashop_category_information .hikashop_container {
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
}
.hikashop_categories_listing_main .hikashop_subcontainer,
.hikashop_category_information .hikashop_subcontainer {
    min-height: 0 !important;
    height: 100%;
    padding: 0 !important;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--claire-line) !important;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(9, 23, 30, 0.05);
    transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.hikashop_categories_listing_main .hikashop_subcontainer:hover,
.hikashop_category_information .hikashop_subcontainer:hover {
    transform: translateY(-3px);
    border-color: var(--claire-green) !important;
    box-shadow: 0 8px 20px rgba(9, 23, 30, 0.12);
}

/* Image: edge to edge across the top of the card, square */
.hikashop_categories_listing_main .hikashop_category_image,
.hikashop_category_information .hikashop_category_image,
.hikashop_categories_listing_main .hikashop_product_image,
.hikashop_category_information .hikashop_product_image {
    height: auto !important;
    margin: 0 !important;
}
.hikashop_categories_listing_main .hikashop_category_image div,
.hikashop_category_information .hikashop_category_image div,
.hikashop_categories_listing_main .hikashop_product_image_subdiv,
.hikashop_category_information .hikashop_product_image_subdiv {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}
.hikashop_categories_listing_main .hikashop_subcontainer img,
.hikashop_category_information .hikashop_subcontainer img {
    display: block;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    margin: 0 !important;
    border-bottom: 3px solid var(--claire-green);
}

/* Name + product count */
.hikashop_categories_listing_main .hikashop_category_name,
.hikashop_category_information .hikashop_category_name {
    display: block;
    padding: 12px 12px 14px;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 600;
    text-align: center;
    overflow-wrap: break-word;
    hyphens: auto;
}
.hikashop_categories_listing_main .hikashop_subcontainer a,
.hikashop_category_information .hikashop_subcontainer a {
    color: var(--claire-ink) !important;
    text-decoration: none !important;
}
.hikashop_categories_listing_main .hikashop_subcontainer:hover .hikashop_category_name a,
.hikashop_category_information .hikashop_subcontainer:hover .hikashop_category_name a {
    color: var(--claire-green-dark) !important;
}

/* Remove the stray line break HikaShop puts between image and name */
.hikashop_categories_listing_main .hikashop_subcontainer > br {
    display: none;
}


/* =====================================================================
   CHECKOUT (payment method, coupon, cart table, totals)
   ===================================================================== */

#hikashop_checkout_page {
    --claire-green:      #bbc415;
    --claire-green-dark: #858d00;
    --claire-ink:        #09171e;
    --claire-muted:      #6b7276;
    --claire-line:       #e3e6d6;
    --claire-pale:       #f6f8e8;
    font-family: sourcesanspro, Helvetica, Arial, sans-serif;
    color: var(--claire-ink);
}

/* Prices: same fix as the product page (no italic Times) */
#hikashop_checkout_page .hikashop_product_price_full,
#hikashop_checkout_page .hikashop_product_price,
#hikashop_checkout_page [class*="price"] span,
#hikashop_checkout_page [class*="_price"] {
    font-family: sourcesanspro, Helvetica, Arial, sans-serif !important;
    font-style: normal !important;
    color: var(--claire-ink) !important;
}

/* Section headings ("Payment method" etc.) */
#hikashop_checkout_page legend,
#hikashop_checkout_page h2,
#hikashop_checkout_page h3,
#hikashop_checkout_page h4 {
    font-size: 20px;
    font-weight: 700;
    color: var(--claire-ink);
    margin: 28px 0 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--claire-green);
}

/* Payment method box: soft card instead of a hard grey border */
#hikashop_checkout_page fieldset,
#hikashop_checkout_page .hikashop_checkout_payment,
#hikashop_checkout_page .hikashop_payment_methods {
    border: 1px solid var(--claire-line) !important;
    border-radius: 10px;
    padding: 16px 20px !important;
    background: #fff;
}
#hikashop_checkout_page input[type="radio"] {
    accent-color: var(--claire-green-dark);
    width: 18px;
    height: 18px;
    vertical-align: -3px;
    margin-right: 8px;
}

/* Text inputs (PO number, coupon, quantity) */
#hikashop_checkout_page input[type="text"],
#hikashop_checkout_page input[type="number"],
#hikashop_checkout_page input.form-control,
#hikashop_checkout_page textarea {
    font-family: inherit;
    font-size: 16px;
    color: var(--claire-ink);
    border: 1px solid #cfd4c0 !important;
    border-radius: 6px !important;
    padding: 10px 12px;
    box-shadow: none !important;
    transition: border-color 0.2s, box-shadow 0.2s;
}
#hikashop_checkout_page input[type="text"]:focus,
#hikashop_checkout_page input[type="number"]:focus,
#hikashop_checkout_page input.form-control:focus,
#hikashop_checkout_page textarea:focus {
    outline: none;
    border-color: var(--claire-green-dark) !important;
    box-shadow: 0 0 0 3px rgba(187, 196, 21, 0.3) !important;
}

/* Buttons (Submit, Add coupon, Next/Finish) */
#hikashop_checkout_page .hikabtn,
#hikashop_checkout_page button,
#hikashop_checkout_page input[type="submit"],
#hikashop_checkout_page input[type="button"] {
    font-family: inherit;
    font-weight: 700;
    color: #fff !important;
    background: var(--claire-green) !important;
    border: 0 !important;
    border-radius: 6px !important;
    padding: 10px 20px;
    cursor: pointer;
    transition: background 0.2s;
}
#hikashop_checkout_page .hikabtn:hover,
#hikashop_checkout_page button:hover,
#hikashop_checkout_page input[type="submit"]:hover,
#hikashop_checkout_page input[type="button"]:hover {
    background: var(--claire-green-dark) !important;
}

/* Cart table: light rows instead of a heavy grid */
#hikashop_checkout_page table {
    border-collapse: collapse !important;
    border: 1px solid var(--claire-line) !important;
    border-radius: 10px;
    overflow: hidden;
}
#hikashop_checkout_page table th {
    background: var(--claire-pale);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--claire-muted);
    border: 0 !important;
    border-bottom: 2px solid var(--claire-green) !important;
    padding: 12px !important;
}
#hikashop_checkout_page table td {
    border: 0 !important;
    border-bottom: 1px solid var(--claire-line) !important;
    padding: 12px !important;
    vertical-align: middle;
    font-size: 15px;
}
#hikashop_checkout_page table td a {
    color: var(--claire-ink);
    font-weight: 600;
    text-decoration: none;
}

/* Product thumbnail in the cart */
#hikashop_checkout_page img.hikashop_cart_product_image,
#hikashop_checkout_page td img {
    width: 64px !important;
    height: auto !important;
    border-radius: 6px;
}

/* Quantity box: compact */
#hikashop_checkout_page .hikashop_product_quantity_field,
#hikashop_checkout_page input.hikashop_product_quantity_field {
    max-width: 70px !important;
    text-align: center;
    padding: 6px !important;
}

/* Totals: make the final total stand out */
#hikashop_checkout_page tr[class*="total"] td,
#hikashop_checkout_page .hikashop_cart_total_value,
#hikashop_checkout_page .hikashop_cart_total_title {
    font-size: 15px;
}
#hikashop_checkout_page tr:last-child td {
    font-size: 18px;
    font-weight: 700;
    border-bottom: 0 !important;
}

/* Checkout next/finish button – force CL:AIRE green (beats template styles) */
#hikashop_checkout_page .hikashop_checkout_buttons .hikabtn,
#hikashop_checkout_page .hikashop_checkout_buttons button,
#hikashop_checkout_page .hikashop_checkout_buttons input[type="submit"],
#hikashop_checkout_page #hikabtn_checkout_next,
#hikashop_checkout_page .hikabtn_checkout_next {
    background: #bbc415 !important;
    background-color: #bbc415 !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 6px !important;
    padding: 12px 28px !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    min-width: 160px;
    opacity: 1 !important;
}
#hikashop_checkout_page .hikashop_checkout_buttons .hikabtn *,
#hikashop_checkout_page #hikabtn_checkout_next *,
#hikashop_checkout_page .hikabtn_checkout_next * {
    color: #ffffff !important;
}
#hikashop_checkout_page .hikashop_checkout_buttons .hikabtn:hover,
#hikashop_checkout_page .hikashop_checkout_buttons button:hover,
#hikashop_checkout_page #hikabtn_checkout_next:hover,
#hikashop_checkout_page .hikabtn_checkout_next:hover {
    background: #858d00 !important;
    background-color: #858d00 !important;
}


/* =====================================================================
   FIXES FOR THE TEMPLATE'S GLOBAL RULE
   The template's custom CSS contains  button { background-color: transparent !important; }
   which strips the background off every button on the site. These rules
   are more specific, so they win.
   ===================================================================== */

/* HikaShop buttons anywhere (checkout next/finish, coupon, PO submit) */
body .hikashop_checkout_buttons button,
body .hikashop_checkout_buttons .hikabtn,
body button.hikabtn,
body a.hikabtn.hikacart,
body #hikabtn_checkout_next,
body .hikabtn_checkout_next,
body #hikashop_checkout_next_button button {
    background: #bbc415 !important;
    background-color: #bbc415 !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 6px !important;
    font-weight: 700 !important;
    opacity: 1 !important;
}
body .hikashop_checkout_buttons button *,
body button.hikabtn *,
body #hikabtn_checkout_next *,
body .hikabtn_checkout_next * {
    color: #ffffff !important;
}
body .hikashop_checkout_buttons button:hover,
body .hikashop_checkout_buttons .hikabtn:hover,
body button.hikabtn:hover,
body a.hikabtn.hikacart:hover,
body #hikabtn_checkout_next:hover,
body .hikabtn_checkout_next:hover {
    background: #858d00 !important;
    background-color: #858d00 !important;
}


/* =====================================================================
   PRODUCT PAGE – tighter, smaller purchase card
   ===================================================================== */

/* Price: smaller and allowed to wrap so it never spills out of the card */
.hikashop_product_page .hikashop_product_price_main .hikashop_product_price {
    font-size: 24px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    margin-bottom: 2px !important;
}
.hikashop_product_page .hikashop_product_price_main {
    margin-bottom: 14px !important;
}
.hikashop_product_page .hikashop_product_price_main .hikashop_product_price_per_unit {
    font-size: 13px !important;
}

/* Card: less padding */
.hikashop_product_page .hikashop_product_right_part {
    padding: 20px 22px !important;
}

/* Remove HikaShop's stray line breaks that add empty space */
.hikashop_product_page .hikashop_product_right_part > br {
    display: none;
}

/* Characteristic (dropdown) block: no box, no extra space */
.hikashop_product_page #hikashop_product_characteristics,
.hikashop_product_page .hikashop_product_characteristics,
.hikashop_product_page #hikashop_product_characteristics table,
.hikashop_product_page #hikashop_product_characteristics tr,
.hikashop_product_page #hikashop_product_characteristics td,
.hikashop_product_page #hikashop_product_characteristics fieldset {
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    box-shadow: none !important;
}
.hikashop_product_page #hikashop_product_characteristics,
.hikashop_product_page .hikashop_product_characteristics {
    margin-bottom: 16px !important;
}
.hikashop_product_page #hikashop_product_characteristics table td:first-child,
.hikashop_product_page .hikashop_product_characteristics table td:first-child {
    padding-bottom: 6px !important;
    font-size: 12px !important;
}
.hikashop_product_page .hikashop_product_right_part select {
    height: 42px !important;
    font-size: 15px !important;
}

/* Button: slightly slimmer */
.hikashop_product_page .hikabtn.hikacart {
    padding: 11px 20px !important;
    font-size: 16px !important;
}