/* =====================================
	1. Startsidan
   ===================================== */

/* =====================================
	2. Aktiviteter
   ===================================== */

/* =====================================
	3. Gästhamn
   ===================================== */

/* --- Få pilen ovanför bryggöversikten att studsa --- */
.bouncing-arrow {
    animation: bounceSide 1.5s ease-in-out infinite;
    animation-duration: 1s !important;
}

@keyframes bounceSide {
  0%, 100% { transform: translateX(0);}
  50%      { transform: translateX(10px);}
}

/* =====================================
	4. Båtplats
   ===================================== */

/* =====================================
	5. Servering-Butik
   ===================================== */

/* =====================================
	6. Båtförmedling + Hyra båtar
   ===================================== */

/* --- Båtbilderna i grid --- */
/* a. Fast höjd och beskärning */
.grid-image-control {
    width: 100% !important;
    max-width: 100% !important;
    height: 225px !important;
    overflow: hidden !important;
    display: block !important;
}
.grid-image-control img {
    width: 100% !important;
    min-width: 100% !important; /* Tvingar bilden att fylla bredden */
    height: 225px !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    max-width: none !important;  /* fights Divi inline max-width:100% sometimes */
    transition: all 0.4s ease-in-out !important;
}
/* b. Skapar hover effect som triggas av kolumnen */
.et_pb_column:hover .grid-image-control img {
    opacity: 1 !important;
    filter: saturate(1.2) brightness(1.1) drop-shadow(0 0 12px rgba(255,255,255,0.3)) !important;
}

/* =====================================
	7. Båtens sida
   ===================================== */
/* --- Bättre kontroll för bildmodulerna högst upp --- */
.image-control {
    overflow: hidden;
}

.image-control span {
    height: 100%;
}

.image-control img {
    width: 100% !important;
    object-fit: cover;
    object-position: center center;
    display: block;
    max-width: none !important;   /* fights Divi inline max-width:100% sometimes */
    max-height: none !important;
    transition: transform 300ms ease-in-out;
}

.image-control img:hover {
    transform: scale(102%);  
}

/* --- Prylar till WS Forms --- */

/* Få låsta fält att se mer ut som vanlig text */
.wsf-field[readonly] {
    cursor: default;
}


/* --- Teknisk specifikation (etikett och data) --- */
.boat-spec-row .et_pb_text_inner p {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    width: 100% !important;
    margin-bottom: 0 !important;
    padding-bottom: 5px !important;
    border-bottom: 1px dotted #001E3D !important;
}

/* a. Etiketten (texten till vänster) */
.boat-spec-row .et_pb_text_inner p span:first-child {
    font-family: 'Nunito', sans-serif;
    font-size: 22px;
    font-weight: 500;
    text-transform: none;
    color: #001E3D;
}

/* b. Datan (texten till höger) */
.boat-spec-row .et_pb_text_inner p span:last-child {
    font-family: 'Nunito', sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: #001E3D;
}

/* c. Mobilanpassning - redigera textstorlek vid behov */
@media (max-width: 767px) {
    .boat-spec-row .et_pb_text_inner p span:first-child {
        font-size: 20px;
    }
    .boat-spec-row .et_pb_text_inner p span:last-child {
        font-size: 18px;
    }
}

/* =====================================
	8. Luxparken Login-sidan
   ===================================== */

/* Styling för den aktiva knappen på produktsidan*/
.kategori-knapp.aktiv-knapp {
    background-color: #004E70 !important;
    color: #FFFFFF !important;
    transform: translateY(-2px);
}

.kategori-rad {
    opacity: 1;
    transition: opacity 0.3s;
}