:root {
    --acti-blue:#0056a4;
    --acti-yellow:#ffd600;
}
body{font-family:"Poppins",sans-serif;}
.topbar{font-size:.85rem;}
.navbar-nav .nav-link.active{font-weight:600;color:var(--acti-blue)!important;}
#hero h2{font-weight:700;color:var(--acti-yellow);}/* “Nouveauté” */
#hero h3{font-weight:700;color:var(--acti-blue);}/* “Sélection 2025” */
#features i{color:var(--acti-blue);}/* icônes bénéfices */

/* Couleurs personnalisées */
.bg-acti-blue {
    background-color: #0056A4;
}



.heigh-350 {
    height: 350px!important;
}
.pointer {
    cursor: pointer;
}
.added-item-border {
    border: 3px solid!important;
}

.red {
    background-color: red;
}
.flex-space-beetween {
    display: flex;
    justify-content: space-between;
}
.nav-link {
    color: #222 !important;
}
.nav-link:hover {
    text-decoration: underline;
}
.btn-primary {
    background-color: #0056A4;
    border-color: #0056A4;
}
.btn-primary:hover {
    background-color: #003f7f;
    border-color: #003f7f;
}

.title-picto{
    color: #0056A4;
}

.text-acti-blue {
    color: #0056A4!important;
}
.hover-scale {
    transition: transform 0.2s ease;
}
.hover-scale:hover {
    transform: scale(1.02);
}

/*== Carousel ==*/
.hero-carousel {
    background: linear-gradient(to right, #0056a4 0%, #f8d400 100%);
    min-height: 380px;
}
.hero-text {
    max-width: 420px;
}
.hero-text h2, .hero-text h3 {
    color: white;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    background-color: rgba(255,255,255,0.7);
    border-radius: 50%;
}

/* ===== Grille pictogrammes ===== */
.picto-grid {
    display: grid;
    gap: 1.25rem;                 /* 20 px d’espace */
    grid-template-columns: repeat(5, 1fr);   /* 5 cartes par ligne desktop */
}

/* Effet léger au survol */
.picto-card img {
    transition: transform .2s ease;
}
.picto-card:hover img {
    transform: scale(1.05);
}
/*== Contact ==*/

.text-acti-blue{color:#0056A4!important;}
.contact-hero img{max-height:300px;object-fit:cover;}
.contact-form .form-control{border-radius:0;}
.contact-form textarea{resize:vertical;}


/*== Footer ==*/
.bg-acti-blue {
    background-color: #0056A4;
}

footer h6 {
    font-size: 0.85rem;
}
footer ul li {
    margin-bottom: 0.25rem;
}
footer a:hover {
    text-decoration: underline;
}

/* – 4 cartes ≥ 1200 px */
@media (max-width: 1199.98px) {
    .picto-grid { grid-template-columns: repeat(4, 1fr); }
}
/* – 3 cartes ≥ 992 px */
@media (max-width: 991.98px) {
    .picto-grid { grid-template-columns: repeat(3, 1fr); }
}
/* – 2 cartes < 768 px */
@media (max-width: 767.98px) {
    .picto-grid { grid-template-columns: repeat(2, 1fr); }
}

.fom-signin-btn {background-color: #007bff;
    border-color: #007bff;
}

.fom-signin-btn:hover {
    background-color: #0056b3;
    border-color: #0056b3;
}

/* Container styles */
.pagination {
    list-style: none; /* Remove list bullets */
    margin: 0;
    padding: 0;
    display: flex; /* Arrange items horizontally */
    justify-content: center; /* Center the pagination block */
    gap: 5px; /* Space between links */
}

/* Individual list item styles */
.page-item {
    margin: 0 1px;
}

/* Link styles (default, visited) */
.page-link {
    display: block;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px; /* Add rounded corners */
    text-decoration: none; /* Remove underlines */
    color: #007bff; /* Link color */
    background-color: #fff;
    transition: all 0.3s ease;
}

/* Hover effect for links */
.page-link:hover {
    background-color: #e9ecef;
    border-color: #0056b3;
    color: #0056b3;
}

/* Style for the active (current) page */
.page-item.active .page-link {
    background-color: #007bff; /* Active background color */
    color: white; /* Active text color */
    border-color: #007bff;
    font-weight: bold;
    cursor: default;
}

.page-item.active .page-link:hover {
    background-color: #007bff; /* Maintain color on hover for active link */
    color: white;
}

/* Style for disabled links (e.g., on the first or last page) */
.page-item.disabled .page-link {
    color: #6c757d;
    pointer-events: none; /* Disable mouse events */
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}

/* Target the list items */
.pagination ul li {
    display: block; /* Forces each list item onto a new line */
    margin: 4px 0;   /* Optional: adds some vertical spacing */
}

/* Ensure the links within still fill their container */
.pagination ul li a {
    display: block;
    padding: 5px 10px; /* Optional: improves clickable area */
}
/*  .flex-item {
      background-color: lightblue;
      border: 1px solid steelblue;
      padding: 15px;
      margin: 10px; !* Applies margin to all sides *!
      !* Or use specific margins for top/bottom *!
      !* margin-top: 15px; *!
      !* margin-bottom: 20px; *!
      width: 100px; !* Fixed width for items to demonstrate wrapping *!
      text-align: center;
  }*/

.jobs-grid-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Creates two columns of equal width */
    gap: 10px; /* Optional: Adds spacing between grid items */
}
.cursor-pointer {
    cursor: pointer;
}

.ratio::before {
    display:block;
    padding-top:unset!important;
    content:""
}

.ratio>* {
    position: unset!important;
}

.job-grid-item {
    /* Add styling for individual grid items (e.g., borders, padding) */
    padding: 15px;
    position: relative;
    text-align: center;
    color: black;
}
.text-decoration-unset-important {
    text-decoration: unset!important;
}

.job-title {
    color: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-weight: bolder;
    font-size: large;
}
.decoration-color {
    text-decoration: underline;
    text-decoration-color: white;
}

.decoration-color-blue {
    text-decoration: underline;
    text-decoration-color: blue;
}
.pd-r-170 {
    padding-right: 170px;
}

.pd-l-170 {
    padding-left: 170px;
}

.color-white {
    color: white;
}