/* Technische Gerätespecs (mobileapi.dev) — randlose Accordion-Liste
   (Mockup-Stil): volle Breite, keine Kästen/Rahmen/Rundung, nur feine
   horizontale Trennlinien. Auf .device-specs gescopet. */
.device-specs { margin: 3.5rem 0 0; }
.device-specs__heading { font-size: 1.5rem; font-weight: 400; margin-bottom: 1rem; }

/* randlose Items, nur durch dünne Linie getrennt */
.device-specs .accordion { --bs-accordion-border-color: transparent; }
.device-specs .accordion-item {
    --bs-accordion-bg: transparent;
    background-color: transparent;
    border: 0;
    border-top: 1px solid #e6e6e6;
    border-radius: 0 !important;
    margin: 0;
}
.device-specs .accordion-item:last-child { border-bottom: 1px solid #e6e6e6; }
.device-specs .accordion-button {
    --bs-accordion-btn-color: #1a1a1a;
    --bs-accordion-active-bg: transparent;
    --bs-accordion-active-color: #1a1a1a;
    color: #1a1a1a;
    font-weight: 500;
    font-size: 1.05rem;
    padding: 1rem .25rem;
    background-color: transparent;
    box-shadow: none;
    /* dezenter, feiner grauer Chevron */
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23888' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23888' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
.device-specs .accordion-button:focus { box-shadow: none; }
/* Focus-Ring auch am offenen, NICHT fokussierten Button unterdrücken:
   main.min.css setzt .accordion-button:not(.collapsed) auf den blauen
   Bootstrap-Ring (Variablen-Override in _variables.scss liegt in einem
   Kommentarblock und greift nie) — betrifft das initial geöffnete Item
   beim Seitenload sowie offene Items nach Fokusverlust (Blur). */
.device-specs .accordion-button:not(.collapsed) { box-shadow: none; }
.device-specs .accordion-collapse { background-color: transparent; }

/* Zwei-Spalten-Tabelle: Betonung auf der Label-Spalte, Wert regulär.
   Inhalt eingerückt (padding-left), damit die Zeilen sich von der
   Kategorie-Überschrift abheben. */
.device-specs .accordion-body { padding: 0 .25rem .5rem 1.5rem; }
.device-specs__table { width: 100%; border-collapse: collapse; font-size: .95rem; margin: 0; }
.device-specs__table tr { border-top: 1px solid #f2f2f2; }
.device-specs__table th,
.device-specs__table td {
    text-align: left;
    padding: .7rem 0;
    vertical-align: top;
}
/* Label-Spalte ~15% breit, Wert-Spalte bekommt den Rest */
.device-specs__table th { font-weight: 500; color: #333; width: 15%; padding-right: 1.5rem; }
.device-specs__table td { font-weight: 400; color: #555; }

.device-specs__source { margin-top: 1rem; font-size: .75rem; color: #adadad; }

@media (max-width: 575.98px) {
    .device-specs__table th,
    .device-specs__table td { display: block; width: 100%; padding: .25rem 0; }
    .device-specs__table th { padding-top: .6rem; }
    .device-specs__table td { padding-bottom: .6rem; }
}

/* "Produktdetails"-Link unter dem Speicherplatz-Selektor — Optik identisch zum Tarifdetails-Link (shop.scss: .product-infos-wrapper .btn.details) */
.product-detail .product-variants .btn.details.jkr-product-details-link {
    --bs-btn-color: inherit;
    margin-top: 1rem;
}
.product-detail .product-variants .btn.details.jkr-product-details-link:hover {
    --bs-btn-hover-color: inherit;
    text-decoration: none;
}

/* Auswahl-Zusammenfassung oben im Produktdetails-Offcanvas (Verkaufs-Kontext):
   Titel / Farbe (mit Farbkreis) / Speicher als Zeilen, darunter der Preis
   ZWISCHEN den beiden Trennlinien (border-bottom der Auswahl + border-top
   des ersten Accordion-Items). */
.device-specs-offcanvas__selection {
    padding-bottom: .85rem;
    border-bottom: 1px solid #e6e6e6;
}
.device-specs-offcanvas__selection-row { margin: 0 0 .4rem; font-size: .95rem; color: #333; }
.device-specs-offcanvas__selection-row:last-child { margin-bottom: 0; }
.device-specs-offcanvas__selection-product { color: #1a1a1a; }
.oc-color-dot {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, .15);
    vertical-align: -3px;
    margin: 0 .1rem;
}
.device-specs-offcanvas__selection-price {
    margin: 0 0 1.25rem;
    padding: .85rem .1rem;
    display: flex;
    align-items: baseline;
    gap: .5rem;
}
.device-specs-offcanvas__selection-price .price { font-size: .95rem; font-weight: 700; color: #1a1a1a; }
.device-specs-offcanvas__selection-price small { color: #888; font-size: .75rem; }

/* Specs im schmalen Offcanvas: Label/Wert gestapelt statt zweispaltig */
.device-specs-offcanvas { width: 420px; max-width: 90vw; }
.device-specs-offcanvas .offcanvas-header { padding: 2rem 1rem 1rem; }
.device-specs-offcanvas .offcanvas-title { font-size: 1.4rem; font-weight: 500; margin: 0; }
.device-specs--offcanvas { margin: 0; }
.device-specs--offcanvas .accordion-body { padding: 0 .25rem .5rem 1rem; }
.device-specs--offcanvas .device-specs__table th,
.device-specs--offcanvas .device-specs__table td {
    display: block;
    width: 100%;
    padding: .15rem 0;
}
.device-specs--offcanvas .device-specs__table th { padding-top: .55rem; }
.device-specs--offcanvas .device-specs__table td { padding-bottom: .35rem; }
.device-specs--offcanvas .device-specs__source { margin-top: .75rem; }