/**
 * Tebim GPSR — front-office styling for the "GPSR" product-page tab
 * (views/templates/hook/product_extra_content.html.twig).
 *
 * NOTE for tebim-module-dev: register via registerStylesheet() in the
 * front controller's setMedia hook, scoped to the product page only, e.g.
 *
 *   $this->context->controller->registerStylesheet(
 *       'tebim_gpsr-product-tab',
 *       'modules/' . $this->name . '/views/css/front/gpsr-product-tab.css',
 *       ['media' => 'all', 'priority' => 200]
 *   );
 *
 * Never addCSS(). Kept deliberately close to classic-theme conventions
 * (Bootstrap 4 tab-pane, same spacing rhythm as the description tab) so it
 * blends in without a theme-specific override.
 */

.tebim-gpsr-tab {
  font-size: 14px;
  line-height: 1.6;
  color: #232323;
}

.tebim-gpsr-tab__section + .tebim-gpsr-tab__section {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid #f1f1f1;
}

.tebim-gpsr-tab__heading {
  font-weight: 600;
  font-size: 1rem;
  margin: 0 0 8px;
}

.tebim-gpsr-tab__body :last-child {
  margin-bottom: 0;
}

.tebim-gpsr-tab__warnings-title {
  font-weight: 600;
  font-size: 1rem;
  margin: 24px 0 12px;
}

.tebim-gpsr-tab__warnings {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
}

.tebim-gpsr-tab__warning {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.tebim-gpsr-tab__warning-image {
  width: 56px;
  height: 56px;
  object-fit: contain;
  flex-shrink: 0;
  border: 1px solid #f1f1f1;
  border-radius: 4px;
  background: #fff;
}

.tebim-gpsr-tab__warning-title {
  font-weight: 600;
  margin: 0 0 4px;
  font-size: 0.9375rem;
}

.tebim-gpsr-tab__warning-description {
  margin: 0;
  color: #4f5b60;
}

/* Tap targets stay comfortably above 44px even though this tab has no
   interactive controls beyond the surrounding theme tab-nav. */
@media (max-width: 576px) {
  .tebim-gpsr-tab__warning {
    flex-direction: column;
  }

  .tebim-gpsr-tab__warning-image {
    width: 48px;
    height: 48px;
  }
}