/**
 * Mobile dropdown tabs (opt-in Divi Tabs behavior)
 *
 * Author: Fernando Roche
 * Added: 2026-05-14 (extracted to standalone file 2026-05-18)
 *
 * Usage: add CSS class `mobile-dropdown-tabs` to a Divi Tabs module.
 */

.fy-mobile-tab-dropdown,
.fy-mobile-tab-dropdown[hidden] {
  display: none !important;
}

@media (max-width: 980px) {
  body:not(.wp-admin):not(.et-fb) .fy-mobile-dropdown-tabs > .fy-mobile-tab-dropdown:not([hidden]) {
    display: block !important;
    margin: 0 0 22px;
    max-width: 100%;
    position: relative;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-dropdown-tabs .fy-mobile-accordion {
    display: none !important;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-dropdown-tabs .et_pb_tabs_controls {
    display: none !important;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-dropdown-tabs .et_pb_all_tabs {
    display: block !important;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__trigger {
    align-items: center;
    background: #004976 !important;
    border: 1px solid #004976;
    border-radius: 8px;
    box-shadow: none;
    color: #fff;
    cursor: pointer;
    display: flex;
    font: inherit;
    font-size: 16px;
    font-weight: 600;
    justify-content: space-between;
    line-height: 1.3;
    padding: 14px 16px;
    text-align: left;
    width: 100%;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__label {
    flex: 1 1 auto;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__icon {
    background: url(/wp-content/uploads/2026/04/arrow-down.png) center / contain no-repeat;
    display: block;
    flex: 0 0 auto;
    height: 9px;
    margin-left: 12px;
    transition: transform .2s ease;
    width: 12px;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__trigger[aria-expanded="true"] .fy-mobile-tab-dropdown__icon {
    transform: rotate(180deg);
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__list {
    background: #fff;
    border: 1px solid #d6dce1;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .12);
    display: block;
    margin-top: 4px;
    overflow: hidden;
    position: static;
    width: 100%;
    z-index: 20;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__list[hidden] {
    display: none !important;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__option {
    background: #fff;
    border: 0;
    color: #004976;
    cursor: pointer;
    display: block;
    font: inherit;
    padding: 12px 16px;
    text-align: left;
    width: 100%;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__option + .fy-mobile-tab-dropdown__option {
    border-top: 1px solid #e5e9ed;
  }

  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__option:hover,
  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__option:focus,
  body:not(.wp-admin):not(.et-fb) .fy-mobile-tab-dropdown__option[aria-selected="true"] {
    background: #e8f4fb;
    outline: none;
  }
}
