/*
Theme Name: Hello Elementor Child theme of hello-elementor
Theme URI: 
Description: Child theme of hello-elementor theme for the Hello Elementor theme
Author: <a href="https://elementor.com/?utm_source=wp-themes&#038;utm_campaign=author-uri&#038;utm_medium=wp-dash">Elementor Team</a>
Author URI: 
Template: hello-elementor
Version: 3.4.4
*/

/* Generated by Orbisius Child Theme Creator (https://orbisius.com/products/wordpress-plugins/orbisius-child-theme-creator/) on Tue, 23 Sep 2025 07:09:19 +0000 */ 
/* The plugin now uses the recommended approach for loading the css files.*/



/* ======================
 * CUSTOM CSS
 * ======================*/
 

body{
	font-family: "Open Sans", "sans-serif";

}

.product-box {
  cursor: pointer; 
}

.product-box:hover .elementor-button {
  background-color: #9D1014 !important;
  color: #fff !important;
  border-color: #000 !important;

  transition: all 0.3s ease;
}

.product-box:hover .elementor-image img {
  filter: brightness(0.85);
  transition: all 0.3s ease;
}

/* ==================
 * PRODUKTLISTA
 * ===================*/
.lagerlista {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 0.8em;
    line-height: 1.4;
}

/* Header */
.lagerlista thead th {
    background: #f5f5f5;
    font-weight: 600;
    padding: 10px 12px;
    border-bottom: 2px solid #dcdcdc;
    white-space: nowrap;

}

/* Data cells */
.lagerlista td {
    padding: 8px 12px;
    border-bottom: 1px solid #e6e6e6;
    vertical-align: middle;
}

.lagerlista th {
    cursor: pointer;
    position: relative;
}



/* Hover effect */
.lagerlista tbody tr:hover td {
    background: #fafafa;
}

/* Thumbnail column width controlled by colgroup */
.lagerlista col.col-thumb {
    width: 70px;
    min-width: 70px;
}

.lagerlista .product-thumb {
    text-align: center;
}

.lagerlista .product-thumb img {
    width: 50px;
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 3px;
}

/* Product name column can flex */
.lagerlista col.col-title {
    width: auto;
}

/* Let long text wrap instead of forcing rows to stretch */
.lagerlista td, .lagerlista th {
    word-wrap: break-word;
    white-space: normal;
}



/* Make headers look interactive */
.lagerlista.sortable thead th {
    cursor: pointer;
    position: relative;
    padding-right: 16px; /* make room for arrows */
}

/* Neutral arrows (always visible, subtle) */
.lagerlista.sortable thead th::after {
    content: "▾▴"; /* neutral indicator */
    font-size: 11px;
    color: #bbb;
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    transition: color 0.2s ease;
}

/* Hover: highlight arrow */
.lagerlista.sortable thead th:hover::after {
    color: #666;
}

/* Sorted ascending arrow */
.lagerlista.sortable thead th.sort-asc::after {
    content: "▲";
    color: #111;
    font-weight: 600;
}

/* Sorted descending arrow */
.lagerlista.sortable thead th.sort-desc::after {
    content: "▼";
    color: #111;
    font-weight: 600;
}
/* Remove sort caret from the thumbnail column */
.lagerlista.sortable thead th:first-child::after {
    content: "" !important;
}

/* NY */
/* === DESKTOP (unchanged) === */
.lagerlista {
    width: 100%;
    border-collapse: collapse;
}
.lagerlista th, .lagerlista td {
    padding: 8px 12px;
    border-bottom: 1px solid #e6e6e6;
}
.lagerlista th {
    background: #f5f5f5;

    font-weight: 600;
}
.lagerlista-table th {
    vertical-align: top;
    padding-top: 10px; /* justera efter smak */
	  text-align: center;
}

.lagerlista-table th .unit {
    display: block;
    margin-top: 2px;
	font-style: italic;
}

/* Centrera cellinnehåll */
.lagerlista-table td {
    text-align: center;
}
/* Desktop: centrera allt innehåll */
.lagerlista td,
.lagerlista th {
    text-align: center;
}


/* === MOBILE CARD VIEW === */
@media (max-width: 768px) {

    /* Convert table structure into block layout */
    .lagerlista,
    .lagerlista thead,
    .lagerlista tbody,
    .lagerlista tr,
    .lagerlista th {
        display: block;
        width: 100%;
    }

    /* Hide desktop header */
    .lagerlista thead {
        display: none !important;
    }

    /* Hide empty cells (ACF fields with no data) */
    .lagerlista td.is-empty {
        display: none !important;
    }

    /* Card layout for each product row */
    .lagerlista tr {
        background: #fff;
        border: 1px solid #ddd;
        border-radius: 8px;
        margin-bottom: 12px;
        padding: 12px;
        box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    }

    /* Default cell layout (label + value) */
    .lagerlista td {
        display: flex;
        flex-basis: 100%;
        align-items: baseline;
        padding: 6px 0;
        border: none;
        border-bottom: 1px dotted #eee;
        word-break: break-word;
       
    }

    .lagerlista td:last-child {
        border-bottom: none;
    }

    /* Label (left column) */
    .lagerlista td::before {
        content: attr(data-label);
        font-weight: 600;
        color: #333;
        flex-basis: 35%;
        padding-right: 8px;
       
    }

    /* Value (right column) */
    .lagerlista td {
        flex-basis: 65%;
        text-align: center;
    }


    /* ======================================
       SPECIAL HANDLING: IMAGE + TITLE ROW
       ====================================== */

    /* Remove label before thumbnail and title */
    .lagerlista td.product-thumb::before,
    .lagerlista td.title::before {
        display: none !important;
    }

    /* Image + title = inline horizontal row */
    .lagerlista td.product-thumb,
    .lagerlista td.title {
        display: inline-flex !important;
        vertical-align: middle;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Collapse empty image cell completely */
    .lagerlista td.product-thumb:empty,
    .lagerlista td.product-thumb .no-img {
        display: none !important;
    }

    /* Thumbnail style */
    .lagerlista td.product-thumb img {
        width: 70px;
        height: auto;
        border-radius: 4px;
        display: block;
        margin-right: 10px;
        margin-bottom: 8px;
    }

    /* Title styling */
    .lagerlista td.title a,
    .lagerlista td.title {
        font-weight: 600;
        font-size: 16px;
        line-height: 1.25;
        color: #000;
        text-decoration: none;
    }

    /* Add some spacing above full card */
    .lagerlista tr {
        padding-top: 14px;
    }


    /* ======================================
       SPECIAL CASE: ANTECKNING (full width)
       ====================================== */

    .lagerlista td[data-label="Anteckning"] {
        display: block !important;
        flex-basis: 100% !important;
        border-bottom: none !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        text-align: left !important;
        margin-top: 8px;
    }

    /* Remove label entirely */
    .lagerlista td[data-label="Anteckning"]::before {
        display: none !important;
    }

}



/* ==================
 * SLUT PRODUKTLISTA
 * ===================*/


/* ==================
 * PRODUKTSIDA
 * ===================*/

/* PRODUCT PAGE BASE LAYOUT */
.produkt-container {
    max-width: 750px;
    margin: 0 auto;
    padding: 20px;
    font-size: 0.95rem;
}

.produkt-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
}

.produkt-header-image img {
    width: 140px;
    height: auto;
    border-radius: 6px;
}

.produkt-title {
    font-size: 1.8rem;
    margin: 0;
}

/* SPECS LIST */
.produkt-specs {
    background: #fff;
    border: 1px solid #ddd;
    padding: 15px 20px;
    border-radius: 10px;
}

.produkt-row {
    display: flex;
    padding: 10px 0;
    border-bottom: 1px dotted #ddd;
}

.produkt-row:last-child {
    border-bottom: none;
}

.produkt-label {
    flex: 35%;
    font-weight: 600;
}

.produkt-value {
    flex: 65%;
}

/* ANTECKNING (full width) */
.produkt-row-note {
    padding: 12px 0;
}

.produkt-note {
    font-size: 0.95rem;
    line-height: 1.6;
}

/* ==================
 * SLUT PRODUKTSIDA
 * ===================*/



 /* ==================
 * LAGERLISTA SHORTCODE
 * ===================*/
/* === Lagerlista – grund === */
.lagerlista-table-wrapper {
  overflow-x: auto;
  margin: 2rem 0;
}

.lagerlista-table {
  width: 100%;
  border-collapse: collapse;
 font-size: 0.7rem;
  line-height: 1.4;
}

.produkt-lagerlista table tbody tr {
    transition: background-color 0.15s ease-in-out;
}

.produkt-lagerlista table tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.08);
}

/* Header */
.lagerlista-table thead th {
  background: #a11217; 
  color: #fff;
  text-align: center;
  padding: 10px 12px;
  font-weight: 600;
   font-size: 0.65rem;
  white-space: nowrap;
}

/* Cells */
.lagerlista-table td {
  padding: 9px 12px;
  border-bottom: 1px solid #ddd;
  white-space: nowrap;

  line-height: 1.4;
}

/* Zebra rows */
.lagerlista-table tbody tr:nth-child(even) {
  background: #f3f3f3;
}

/* Artikelnummer som länk */
.lagerlista-table a {
  color: #000;
  text-decoration: underline;
  font-weight: 500;
}

.lagerlista-table a:hover {
  text-decoration: none;
}

/* Numeric alignment */
.lagerlista-table td:nth-child(n+2) {
 text-align: center;
}
/* DESKTOP: centrera cellinnehåll korrekt */
.lagerlista-table td {
    text-align: center;
}


@media (max-width: 768px) {

  .lagerlista-table {
    font-size: 13px;
  }

  /* Sticky first column (Artikelnummer) */
  .lagerlista-table th:first-child,
  .lagerlista-table td:first-child {
    position: sticky;
    left: 0;
    background: #fff;
    z-index: 2;
  }

  .lagerlista-table thead th:first-child {
    background: #8f0f14;
    z-index: 3;
  }

  /* Slightly tighter padding */
  .lagerlista-table th,
  .lagerlista-table td {
    padding: 8px 10px;
  }
}



/* ===============================
   Lagerlista – Pagination
   =============================== */

.lagerlista-pagination {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #e2e2e2;

    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;

    font-size: 0.9rem;
        position: relative;
    z-index: 5;
}

.lagerlista-pagination a,
.lagerlista-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 36px;
    height: 36px;
    padding: 0 0.75rem;

    border: 1px solid #d0d0d0;
    background: #fff;
    color: #222;
    text-decoration: none;

    border-radius: 3px;
    transition: all 0.15s ease-in-out;
    pointer-events: auto;
    cursor: pointer;
    text-decoration: none;
}


/* ===== Lagerlista – Pagination reset ===== */

.lagerlista-pagination ul,
.lagerlista-pagination__list {
    list-style: none;
    margin: 0;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.lagerlista-pagination li {
    margin: 0;
    padding: 0;
}


/* Hover */
.lagerlista-pagination a:hover {
    background: #f5f5f5;
    border-color: #bcbcbc;
}

/* Aktiv sida */
.lagerlista-pagination .current {
    background: #222;
    color: #fff;
    border-color: #222;
    font-weight: 600;
    cursor: default;
}

/* Aktiv sida i pagination */
.lagerlista-page--current {
    background: #f3f3f3!important;
    color: #fff;
    font-weight: 600;
    border-radius: 6px;
    padding: 6px 10px;
    min-width: 32px;
    text-align: center;
    display: inline-block;
}


/* Disabled (om WP skulle outputta span) */
.lagerlista-pagination .disabled {
    opacity: 0.5;
    pointer-events: none;
}

/* Föregående / Nästa */
.lagerlista-pagination .prev,
.lagerlista-pagination .next {
    font-weight: 500;
}

/* ===============================
   Mobilanpassning
   =============================== */

@media (max-width: 640px) {

    .lagerlista-pagination {
        flex-wrap: wrap;
        gap: 0.3rem;
    }

    .lagerlista-pagination a,
    .lagerlista-pagination span {
        min-width: 32px;
        height: 32px;
        padding: 0 0.5rem;
        font-size: 0.85rem;
    }

    /* Göm sidnummer långt bort (valfritt) */
    .lagerlista-pagination a:not(.prev):not(.next):not(.current),
    .lagerlista-pagination span:not(.current) {
        display: none;
    }

    .lagerlista-pagination .prev,
    .lagerlista-pagination .next {
        display: inline-flex;
    }
}


.lagerlista-col-image {
    width: 40px;
}
.lagerlista-col-image img {
    max-width: 30px;
    height: auto;
    display: block;
}


/* Decimal alignment in table cells */
/* Centrera innehållet i numeriska celler */
.lagerlista-table td .tcf-decimal {
    display: inline-grid;
    grid-template-columns: auto auto auto;
    align-items: baseline;
    justify-content: center; /* <-- viktigt */
    margin: 0 auto;          /* <-- centrering i td */
}

/* Centrerar hela decimalpaketet i cellen */
.lagerlista-table td {
    text-align: center;
}

/* Delar i decimalen */
.tcf-decimal-int {
    text-align: right;
}

.tcf-decimal-sep {
    padding: 0 1px;
}

.tcf-decimal-dec {
    text-align: left;
}

/* Göm separator + decimal för heltal, men behåll bredd */
.tcf-decimal-sep.is-hidden,
.tcf-decimal-dec.is-hidden {
    visibility: hidden;
}


 /* ==================
 * SLUT LAGERLISTA SHORTCODE
 * ===================*/


 /* ==================
 * PRODUKTDETALJER SHORTCODE
 * ===================*/

/* Mellanrubriker i produktens datatabell */
.produkt-data-table .produkt-section-heading th {
    padding: 0;
    border-top: none;
}

.produkt-section-heading-inner {
    margin-top: 18px;        /* 👈 LUFTEN OVANFÖR */
    padding: 10px 12px;      /* plattans inre padding */
    background: #efefef;
    font-weight: 600;
    text-align: left;
    border-bottom: 2px solid #8F8F8F;
}

 /* ==================
 * SLUT PRODUKTDETALJER SHORTCODE
 * ===================*/


/* ===================
 * Mörk box på sidor
 * ===================*/

.dark-box{
	background: #232323;
	}
.dark-box a {
color:white;font-weight:bold;text-decoration:none;
}

.dark-box a:hover {
color:white;font-weight:bold;text-decoration:underline;
}

.dark-box a:visited{
color:white;font-weight:bold;text-decoration:none;
}
/* ===================
 * END Mörk box på sidor
 * ===================*/


/* SVG */
.elementor-lightbox .elementor-lightbox-image {
    max-width: 95vw !important;
    max-height: 95vh !important;
    width: auto;
    height: auto;
}




/* ========================
 * GET A NEWSLETTER - Justering av formulär
 * ========================= */
.newsletter-signup {
    display: flex;
    align-items: stretch;
    gap: 10px;
}

.newsletter-signup > div {
    display: flex;
}

.newsletter-signup > div:first-child {
    flex: 1;
}

.newsletter-signup label {
    display: none;
}

.newsletter-signup input[type="email"] {
    width: 100%;
    height: 48px;
    padding: 0 20px;
    border-radius: 999px;
    border: 1px solid #ccc;
    background: #f2f2f2;
    font-size: 16px;
    margin: 0;
    box-sizing: border-box;
}

.gan-button-container--button {
    height: 48px;
    padding: 0 30px;
    background: #9D1014;
    color: #fff;
    border: none;
    border-radius: 999px;
    cursor: pointer;

    display: flex;
    align-items: center;
    justify-content: center;

    margin: 0;
}

.news-note {
    background: #111 !important;   /* din bakgrund */
    border: 1px solid #111 !important;
    color: #fff !important;        /* din textfärg */
}

/*====*/
.newsletter-signup form {
    display: flex;
    align-items: stretch;
    gap: 10px;
}




form[action*="gansub.com"] input[type="text"] {
    flex: 1;
    height: 48px;
    padding: 0 20px;
    border-radius: 999px;
    border: 1px solid #ccc;
    background: #f2f2f2;
    font-size: 16px;
    margin: 0;
}
form[action*="gansub.com"] input[type="submit"] {
    height: 48px;
    padding: 0 30px;
    background: #b31313;
    color: #fff;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    margin: 0;
}

form[action*="gansub.com"] label {
    display: none;
}

form[action*="gansub.com"] {
    display: flex;
    align-items: stretch;
    gap: 10px;
}
/* ========================
 * END GET A NEWSLETTER - Justering av formulär
 * ========================= */