@import url(app-v1.css);
@import url(blocks-v1.css);

* {
	border-radius: 0;
}

body {
 color: #333;
 font-size: 16px;
 line-height: 1.6;
}

body.header-fixed-space {
  padding-top: 132px; /* 94 */
}
body.header-fixed-space-v2 {
	padding-top: 135px;
}

@media (max-width: 991px) {
	body.header-fixed-space,
	body.header-fixed-space-v2 {
		padding-top: 0;
	}
}

p,
li,
li a,
label {
 color: #003366;
}

a {
 color: #e74c3c;
 text-decoration: none;
}

a,
a:focus,
a:hover,
a:active,
button,
button:hover {
	outline: 0 !important;
}

a:focus {
text-decoration: none;
}
a:hover {
 color: #e74c3c;
 text-decoration: underline;
}

tr,
td{
 color: #003366;
}

td a,
td a:focus,
td a:active{
 color: #003366;
 text-decoration: none;
}

td a:hover{
 color: #e74c3c;
 text-decoration: none;
}

.wrapper {
	background: #fff;
}

.boxed-layout {
  padding: 0;
  box-shadow: 0 0 5px #ccc;
  margin-left: auto !important;
  margin-right: auto !important;
  background: #0b1d3a; /* bleu nuit profond */
}

select::-ms-expand {
  display: none;
}

.alert-info {
	padding: 8px 10px 8px 20px;
}

/* ETOILES EN FOND */
.stars-full {
  position: fixed;
  top:0; left:0;
  width:100%;
  height:100vh;
  pointer-events:none;
  overflow:hidden;
  z-index:-1;
}

.star {
  position: absolute;
  width: 12px;
  height: 12px;
  transform-origin: center;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,0.1));
  animation: twinkle 2s infinite alternate;
}

/* variantes de taille */
.star.sm { width: 7px; height:7px; }
.star.lg { width: 18px; height:18px; }
.star.xl { width: 28px; height:28px; filter: drop-shadow(0 2px 2px rgba(0,0,0,0.15)); }

/* scintillement subtil */
@keyframes twinkle {
  0% { opacity: 0.85; filter: brightness(0.95); }
  50% { opacity: 1; filter: brightness(1.05); }
  100% { opacity: 0.85; filter: brightness(0.95); }
}

body {
  background-color: #0b1d3a !important;
  min-height: 100vh;
  margin: 0;
}
#main {
  background-color: #0b1d3a !important;
}

/* =========================================
   ALERTES 2026
   ========================================= */
.alert-offre-base {
    background: #fff;
    padding: 18px 22px;
    margin-top: 30px;
    color: #0a2a43;
    position: relative;
    border-radius: 4px;
    border: 3px solid transparent;
}

/* Badge diagonal */
.alert-offre-base:before {
    content: attr(data-badge);
    position: absolute;
    top: -10px;
    right: -10px;
    padding: 4px 10px;
    font-weight: bold;
    font-size: 12px;
    transform: rotate(5deg);
    box-shadow: 0 2px 0 rgba(0,0,0,.25);
    color: #fff;
}

/* Titres */
.alert-offre-base .of-title {
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 10px;
}

/* Prix communs */
.alert-offre-base .of-price,
.alert-black .bf-price {
    padding: 2px 6px;
    font-weight: bold;
    border-radius: 3px;
    color: #fff;
}

/* =========================================
   VARIANTE OFFRE SPÉCIALE
   ========================================= */
.alert-offre {
    border-color: #ff8c00;
}

.alert-offre:before {
    background: #ff8c00;
}

.alert-offre .of-price {
    background: #ff8c00;
}

/* =========================================
   VARIANTE NOËL
   ========================================= */
.alert-noel {
    border-color: #c01818;
}

.alert-noel:before {
    background: #c01818;
}

.alert-noel .of-price {
    background: #c01818;
}

/* VERSION CLICKABLE */
.offre-clickable {
    display: block;
    text-decoration: none;
    color: inherit;
}

.offre-clickable:hover .alert {
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12); /* opacity: 0.95; */
}

.offre-clickable,
.offre-clickable:hover,
.offre-clickable:focus,
.offre-clickable:active {
    text-decoration: none;
}

/* QUESTIONS COURANTES */
/* Harmonisation de la FAQ pour coller au style du tab-panel */
#faq .panel {
  border: 1px solid rgba(35, 103, 158, 0.45); /* bleu translucide comme tab-content */
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 3px 10px rgba(0,0,0,0.07); /* même ombre que tab-content */
  margin-bottom: 10px;
}

/* Questions */
#faq .panel-heading {
  background: #fff;
  padding: 10px 15px;
}

#faq .panel-heading a {
  color: #003366;        /* questions */
  text-decoration: none;
  display: block;
  font-weight: 600;
  font-size: 15px;
}

#faq .panel-heading a:hover {
  opacity: 0.85;
}

/* Réponses */
#faq .panel-body {
  background: #fff;
  border-top: 1px solid rgba(35,103,158,0.45); /* harmonisé avec le cadre */
  line-height: 1.6;
  padding: 10px 15px;
}

#faq .panel-body,
#faq .panel-body * {
  color: #003366 !important;   /* Couleur unifiée les réponses */
}

#faq .panel-body i.fa {
  color: #28a745 !important; /* joli vert, prioritaire */
}

/* Ajouter un chevron à droite */
.faq-toggle {
  position: relative;
  display: block;
  padding-right: 25px;  /* espace pour le chevron */
}

.faq-toggle:after {
  content: "\f054"; /* Font Awesome chevron-right */
  font-family: FontAwesome;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  transition: transform 0.3s ease;
  font-size: 10px;
}

/* Faire tourner le chevron quand ouvert */
.panel-collapse.in + .panel-heading .faq-toggle:after,
.panel-heading .faq-toggle[aria-expanded="true"]:after {
  transform: translateY(-50%) rotate(90deg);
}