/* 1. Spaltenverhältnis der Tabelle anpassen */
.hikashop_product_options_table .hikashop_option_name_td {
    width: 30% !important;
    vertical-align: top;
    padding-right: 20px; /* Abstand zwischen Label und Radio-Buttons */
}

.hikashop_product_options_table .hikashop_option_selector_td {
    width: 70% !important;
}

/* 2. Radio-Buttons untereinander erzwingen */
.hikashop_product_options_table .form-check {
    display: block !important;
    margin-bottom: 5px !important; /* Abstand zwischen den Tutorial-Zeilen */
}

/* 3. Sicherstellen, dass das Label neben dem Radio-Button korrekt umbricht */
.hikashop_product_options_table .form-check-label {
    display: inline !important;
    vertical-align: top;
}
/* Erhöht den Abstand zwischen den beiden Tutorial-Blöcken */
.hikashop_product_options_table tr {
    display: block; /* Erlaubt vertikale Abstände auf Tabellenzeilen */
    margin-bottom: 40px !important; /* Hier kannst du den Wert (40px) nach Belieben anpassen */
}
/* Erzeugt eine Überschrift vor dem Tutorial-Block */
.hikashop_product_options::before {
    content: "Auswahl der Tutorials bzw. Teilnahme am BPC";
    display: block;
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 20px;
    color: #333;
}

/* 1. HAUPTCONTAINER (Zentriert die Elemente und stapelt sie untereinander) */
.hikashop_products_listing .hikashop_product_div_listing,
.hikashop_products_listing div[id^="hikashop_product_"] {
    display: flex !important;
    flex-direction: column !important; 
    align-items: center !important;     
    text-align: center !important;      
    gap: 15px !important;               
    width: 100% !important;
    float: none !important;
    height: auto !important; 
    margin-bottom: 40px !important; /* Abstand am Ende des gesamten Blocks */
}

/* 2. BILD-CONTAINER & RAHMEN */
.hikashop_product_image,
.hikashop_product_image_subdiv {
    display: flex !important;
    justify-content: center !important; 
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    clear: both !important;
    margin: 0 auto 20px auto !important; /* 20px Abstand nach unten verhindert das Rutschen des Preises */
    position: relative !important;
}

/* Der graue Rahmen direkt um das Bild-Link-Element */
.hikashop_product_image a {
    display: block !important;
    border: 1px solid #e0e0e0 !important; /* Dünner, grauer Rahmen */
    border-radius: 6px !important;        /* Leicht abgerundete Ecken */
    padding: 8px !important;              /* Abstand zwischen Bild und Rahmen */
    background-color: #ffffff !important; /* Weißer Hintergrund */
    box-shadow: 0 2px 4px rgba(0,0,0,0.03) !important; /* Minimaler Schatten */
    transition: border-color 0.2s ease !important;
    float: none !important;
    margin: 0 auto !important;
}

/* Hover-Effekt für den Bildrahmen */
.hikashop_product_image a:hover {
    border-color: #a0a0a0 !important;
}

.hikashop_product_listing_image {
    display: block !important;
    margin: 0 auto !important;
}

/* 3. PREIS (Zentriert, fett und mit Abstand nach unten) */
.hikashop_product_price_full {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    float: none !important;
    font-weight: bold !important;      
    margin-top: 0 !important;
    margin-bottom: 5px !important; /* Abstand nach unten zum Titel */
}

.hikashop_product_price_full span {
    display: inline-block !important;  
    font-weight: bold !important;      
    margin: 0 5px !important;          
    float: none !important;
}

/* 4. TITEL / PRODUKTNAME (Größer und gut lesbar) */
.hikashop_product_name {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    float: none !important;
}

.hikashop_product_name a {
    display: inline-block !important;
    font-size: 1.35rem !important;  /* Schriftgröße erhöht */
    font-weight: bold !important;   /* Titel in fett */
    line-height: 1.3 !important;    /* Zeilenabstand */
    color: #333333 !important;      /* Dunkle Textfarbe */
    text-decoration: none !important;
}
/* 4. Titel (Zentriert, fett und mit Abstand nach unten) */
.hikashop_product_name {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    float: none !important;
    font-weight: bold !important;      
    margin-top: 0 !important;
    margin-bottom: 45px !important; /* Abstand nach unten zum Titel */
}
.hikashop_product_name a:hover {
    text-decoration: underline !important; /* Unterstreichen beim Drüberfahren */
}