/* ==========================================================================
   Expedition Manager – Front-end Styles
   Loaded once on singular 'expeditions' pages.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Shared token variables
   -------------------------------------------------------------------------- */
:root {
    --em-brand:        #072D47;
    --em-border:       #D6D6D6;
    --em-border-light: #E5E5E5;
    --em-muted:        #8A97A8;
    --em-icon-size:    18px;
    --em-font-body:    Inter, sans-serif;
    --em-font-heading: Oswald, sans-serif;
    --em-text-sm:      14px;
    --em-text-base:    16px;
    --em-text-lg:      18px;
    --em-lh-body:      1.8em;
    --em-ls-body:      0.02em;
    --em-radius:       0;           /* change to 4px for rounded style */
}

/* --------------------------------------------------------------------------
   Icon list  (included / excluded)
   -------------------------------------------------------------------------- */
.em-icon-list {
    width: 100%;
}

.em-icon-list__item {
    display:         flex;
    align-items:     center;
    gap:             14px;
    padding:         10px 0;
    border-bottom:   1px solid var(--em-border);
}

.em-icon-list__item img {
    width:        var(--em-icon-size);
    height:       var(--em-icon-size);
    object-fit:   contain;
    flex-shrink:  0;
}

.em-icon-list__item span {
    color:          var(--em-brand);
    font-family:    var(--em-font-body);
    font-size:      var(--em-text-base);
    font-weight:    400;
    line-height:    var(--em-lh-body);
    letter-spacing: var(--em-ls-body);
}

/* --------------------------------------------------------------------------
   Accordion  (itinerary)
   -------------------------------------------------------------------------- */
.em-accordion__item {
    border:        1px solid var(--em-border);
    margin-bottom: 20px;
}

.em-accordion__header {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         18px 20px;
    cursor:          pointer;
    user-select:     none;
}

.em-accordion__left {
    display:     flex;
    align-items: center;
    gap:         16px;
}

.em-accordion__number {
    width:           40px;
    height:          40px;
    min-width:       40px;
    border:          1px solid var(--em-border);
    color:           var(--em-brand);
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-family:     var(--em-font-body);
    font-size:       var(--em-text-sm);
    font-weight:     600;
}

.em-accordion__title {
    margin:         0;
    color:          var(--em-brand);
    font-family:    var(--em-font-heading);
    font-size:      var(--em-text-lg);
    font-weight:    400;
    text-transform: uppercase;
    line-height:    1.4em;
}

.em-accordion__icon {
    color:       var(--em-muted);
    font-size:   24px;
    line-height: 1;
    flex-shrink: 0;
}

.em-accordion__body {
    display:     none;
    padding:     0 20px 20px 76px; /* 40px number + 16px gap + 20px left padding */
    color:       var(--em-brand);
    font-family: var(--em-font-body);
    font-size:   var(--em-text-base);
    font-weight: 400;
    line-height: var(--em-lh-body);
    letter-spacing: var(--em-ls-body);
}

.em-accordion__body p:last-child {
    margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   Equipment grid
   -------------------------------------------------------------------------- */
.em-equipment-grid {
    display:               grid;
    grid-template-columns: repeat(2, 1fr);
    gap:                   30px;
    margin-top:            20px;
}

.em-equipment-card {
    border:     1px solid var(--em-border);
    padding:    25px;
    background: #fff;
}

.em-equipment-card__title {
    margin:         0 0 18px;
    color:          var(--em-brand);
    font-family:    var(--em-font-heading);
    font-size:      var(--em-text-lg);
    font-weight:    400;
    text-transform: uppercase;
    line-height:    1.2em;
}

.em-equipment-card__item {
    display:       flex;
    align-items:   flex-start;
    gap:           12px;
    padding:       12px 0;
    border-bottom: 1px solid var(--em-border-light);
}

.em-equipment-card__item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.em-equipment-card__item img {
    width:       var(--em-icon-size);
    height:      var(--em-icon-size);
    object-fit:  contain;
    margin-top:  4px;
    flex-shrink: 0;
}

.em-equipment-card__item span {
    color:       var(--em-brand);
    font-family: var(--em-font-body);
    font-size:   var(--em-text-base);
    font-weight: 400;
    line-height: var(--em-lh-body);
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

    .em-accordion__header {
        padding: 16px;
    }

    .em-accordion__body {
        padding: 0 16px 18px;
    }

    .em-accordion__title {
        font-size: 15px;
    }

    .em-equipment-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .em-equipment-card {
        padding: 20px;
    }

    .em-equipment-card__title {
        font-size: 20px;
    }

    .em-equipment-card__item span {
        font-size: var(--em-text-sm);
    }
}