.v-toolbar .v-toolbar__content {
    height: 80px !important;
}

.v-tabs--align-tabs-title:not(.v-slide-group--has-affixes) .v-tab:first-child {
    margin-left: 0px !important;
}

.v-btn.v-tab {
    box-shadow: none !important;
}

elevenlabs-convai {
    margin-bottom: 32px;
}

.drawer-main-top.v-navigation-drawer.drawer-main.v-navigation-drawer--active.v-navigation-drawer--top {
    border-bottom: none !important;
    box-shadow: none !important;
    transform: translateY(0) !important;
}

.drawer-main-top.v-navigation-drawer.drawer-main.v-navigation-drawer--top .v-navigation-drawer__content {
    margin: auto !important;
    min-width: 320px !important;
    max-width: 320px !important;
    background: #FFF !important;
}

.drawer-main-top.v-navigation-drawer.drawer-main.v-navigation-drawer--active.v-navigation-drawer--top .v-navigation-drawer__content {
    margin: auto !important;
    min-width: 320px;
    max-width: 320px;
    background: #FFF !important;
    box-shadow: 0 8px 10px -5px var(--v-shadow-key-umbra-opacity, #0003), 0 16px 24px 2px var(--v-shadow-key-penumbra-opacity, #00000024), 0 6px 30px 5px var(--v-shadow-key-ambient-opacity, #0000001f)
}

.appbar-rubrica-search {
    max-width: 320px !important;
    margin: auto !important;
}

.appbar-rubrica-search.populated-field .v-field__clearable {
    margin-left: 0px !important;
    margin-right: 0px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.appbar-rubrica-search.empty-field input {
    text-align: center !important;
}

.appbar-rubrica-search.populated-field input {
    text-align: left !important;
}

.appbar-rubrica-search.empty-field input:focus,
.appbar-rubrica-search.populated-field input:focus {
    text-align: left !important;
    padding-left: 4px !important;
    background: #FFF !important;
    color: #000 !important;
}

.appbar-rubrica-search.populated-field .v-field__clearable i,
.appbar-rubrica-search.populated-field input {
    padding-left: 4px !important;
}

.appbar-rubrica-search .v-field__clearable {
    background: transparent !important;
}

.appbar-rubrica-search .v-field--focused .v-field__clearable {
    background: #FFF !important;
}

.appbar-rubrica-search.populated-field .v-field--focused .v-field__clearable i {
    color: #d1d1d1 !important;
}

.appbar-form-lading-page .upload-file-icon.v-btn span i {
    font-size: 20px !important;
    margin-top: -2px;
}

/* === APP BAR BUTTON COMPONENT === */
.app-bar-btn-component {
    background: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2px 4px;
    margin: 0 !important;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    line-height: 1;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    vertical-align: middle;
    box-sizing: border-box;
    height: auto;
    min-height: 0;
    min-width: 0;
}

.app-bar-btn-component:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.6);
    outline-offset: 2px;
    border-radius: 4px;
}

.app-bar-btn-component .label-wrapper span {
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.v-navigation-drawer__scrim {
    background: transparent !important;
}

.drawer-main.v-navigation-drawer.v-navigation-drawer--top {
    transform: translateY(-101%) !important;
    width: 100% !important;
    background: transparent !important;
    margin: auto !important;
}

.v-btn.v-tab-item--selected.v-tab--selected,
.v-btn.v-tab:focus,
.v-btn.v-tab::-moz-focus-inner {
    color: #232c6f;
}

.v-card-item__prepend .v-icon {
    color: #232c6f;
}

/* Button icons: inherit color so they contrast correctly on colored backgrounds */
.v-btn__content .v-icon {
    color: inherit;
}

.v-card-item .v-card-title {
    color: #232c6f;
}

.v-card-item .v-row {
    margin: 0;
}

.v-card-item .v-row .v-col-md-12,
.v-card-item .v-row .v-col-lg-12,
.v-card-item .v-row .v-col-xl-12,
.v-card-item .v-row .v-col-12,
.v-card-item .v-row .v-col-md-10,
.v-card-item .v-row .v-col-lg-10,
.v-card-item .v-row .v-col-xl-10,
.v-card-item .v-row .v-col-10,
.v-card-item .v-row .v-col-md-6,
.v-card-item .v-row .v-col-lg-6,
.v-card-item .v-row .v-col-xl-6,
.v-card-item .v-row .v-col-6,
.v-card-item .v-row .v-col-md-5,
.v-card-item .v-row .v-col-lg-5,
.v-card-item .v-row .v-col-xl-5,
.v-card-item .v-row .v-col-5,
.v-card-item .v-row .v-col-md-4,
.v-card-item .v-row .v-col-lg-4,
.v-card-item .v-row .v-col-xl-4,
.v-card-item .v-row .v-col-4,
.v-card-item .v-row .v-col-md-3,
.v-card-item .v-row .v-col-lg-3,
.v-card-item .v-row .v-col-xl-3,
.v-card-item .v-row .v-col-3,
.v-card-item .v-row .v-col-md-2,
.v-card-item .v-row .v-col-lg-2,
.v-card-item .v-row .v-col-xl-2,
.v-card-item .v-row.v-col-2,
.v-card-item .v-row .v-col-md-1,
.v-card-item .v-row .v-col-lg-1,
.v-card-item .v-row .v-col-xl-1,
.v-card-item .v-row .v-col-1 {
    padding: 3px;
}

.v-card-item .v-row .v-col {
    padding: 0px;
}

.v-label.v-field-label {
    font-size: 14px;
}

.v-field__input[type="text"],
.v-field__input input[type="text"] {
    margin-bottom: 0px;
}

.v-field__input[type="text"] {
    padding-top: 24px !important;
    padding-bottom: 4px !important;
}

.v-field__input input[type="text"] {
    box-shadow: none !important;
}

.v-field__input[type="text"]:focus,
.v-field__input input[type="text"]:focus,
.v-field__field textarea.v-field__input:focus {
    background-color: initial !important;
    border: 0 !important;
}

.v-text-field .v-input__details,
.v-input .v-input__details {
    padding-top: 0px !important;
    min-height: auto !important;
}

.v-text-field .v-input__details .v-messages {
    min-height: 14px !important;
}

.v-messages {
    line-height: 21px !important;
}

.v-messages .v-messages__message {
    line-height: 21px !important;
    padding: 2px !important;
}

.v-selection-control.v-selection-control--density-default.v-radio {
    height: 56px;
}

.v-selection-control label {
    font-weight: normal;
}

div[airports] {
    align-content: center;
    height: 56px;
}


div[airports]>.v-btn {
    align-self: center;
    margin-right: 2px;
    margin-bottom: 0;
}

.note-courier-tab .v-btn {
    letter-spacing: 0;
}

.v-picker-title {
    display: none;
}

.v-btn.btn-outline-blue {
    color: #0270fb;
}


.flight-service-list,
.pickup-service-list,
.delivery-service-list {
    overflow: visible;
}


.flight-service-list .flight-service-list-item:nth-child(odd),
.pickup-service-list .pickup-service-list-item:nth-child(odd),
.delivery-service-list .delivery-service-list-item:nth-child(odd) {
    border-top: 1px solid #e1e1e1 !important;
}

.package-list-row.package-simple-list-row {
    border: none !important;
}

.flight-service-list .flight-service-list-item:nth-child(even),
.pickup-service-list .pickup-service-list-item:nth-child(even),
.delivery-service-list .delivery-service-list-item:nth-child(odd) {
    border-top: 1px solid #e1e1e1 !important;
}

.package-list-row>div.v-col {
    padding: 0px !important;
}

.airline-sigla-avatar {
    font-size: 24px;
    height: 30px !important;
}

.airline-sigla-avatar>div>div.v-responsive__sizer {
    display: none !important;
}

.appbar-form-lading-page {
    background: rgb(48, 83, 163) !important;
}

.appbar-form-lading-page>.v-toolbar__content>.v-row>div {
    text-align: center !important;
    padding: 0px !important;
}

.appbar-form-lading-page>.v-toolbar__content>.v-row {
    text-align: center !important;
    padding: 0px !important;
    height: 100% !important;
    align-items: center !important;
}

.appbar-form-lading-page>.v-toolbar__content>.v-row>.div {
    text-align: center !important;
}

.appbar-form-lading-page button.v-btn {
    height: 30px !important;
    width: 30px !important;
    margin: 0px !important;
}

.appbar-form-lading-page button.v-btn.labeled-nav-bar-icon {
    max-width: auto !important;
    width: auto !important;
    color: #FFF !important;
}

.appbar-form-lading-page button.v-btn i {
    font-size: 24px !important;
}

.appbar-form-lading-page span.v-btn__content i {
    color: #FFF !important;
}

.toolbar-form-lading-page {
    background: #FFF;
    margin: 0px !important;
}

.toolbar-form-lading-page i {
    color: #232c6f !important;
}

.v-bottom-navigation--active {
    box-shadow: none !important;
}

.toolbar-form-lading-page .v-tab-item--selected {
    background: #FFF !important;
    color: #232c6f !important;
}

.toolbar-form-lading-page .v-tab--selected .v-tab__slider {
    background: #FFFF !important;
}

.toolbar-form-lading-page>div.v-col * {
    text-align: center !important;
}

.package-list-header .v-row div,
.package-list-header .v-row {
    margin-bottom: 0px !important;
}

.package-list-header-col {
    padding: 5px 0px 0px 0px !important;
    font-weight: bolder !important;
    height: 20px !important;
    min-height: 20px !important;
}

.package-list-header-col-selector,
.package-list-header>div.v-col,
.package-list-header>div.v-col,
.package-list-header {
    margin: 0px !important;
    padding: 0px 0px 0px 0px !important;
}

.package-list-row .v-row .v-col,
.package-list-row .v-row {
    margin-bottom: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
}

.package-list-row .v-btn {
    margin: 0px !important;
}


.note-courier-tab .v-tab {
    padding: 4px;
    text-transform: none !important;
}

.note-courier-tab .v-card-text {
    padding: 0px;
}

.note-courier-tab .note-wrapper {
    padding: 0px;
}

.services-list,
.list-flight-component-card .v-card-text {
    padding: 10px !important;
}

.list-flight-component {
    width: 100% !important;
    text-align: center !important;
}

.findair-btn,
.list-flight-component button {
    height: 50px !important;
    width: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;
    background-image: url("/wp-content/uploads/2025/03/findair-logo-dark.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px !important;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 0px;
}

.quote-request-contact-info .v-card-text {
    padding: 30px 20px 30px 20px !important;
}

.quote-request-contact-info,
.note-container,
.pickup-container,
.delivery-container,
.selected-flight,
.selected-flight .v-card-item {
    padding-left: 1px;
    padding-right: 1px;
}

.select-airline-btn {
    margin: 0px !important;
}

.control-filters button,
.order-btn {
    margin: 0px !important;
}


.btn-backward,
.btn-forward {
    margin: 0px !important;
    box-shadow: none !important;
    color: rgb(198, 0, 126) !important;
}

.btn-backward.last-step {
    margin-top: 10px !important;
}

.btn-backward,
.btn-forward {
    font-size: 20px !important;
    font-weight: bolder !important;

}

.order-btn.order-btn-asc span i {
    color: #232c6f;
}

.order-btn.order-btn-desc span i {
    color: purple;
}

.result_list div.v-list-item,
.flight-service-list-item,
.pickup-service-list-item,
.delivery-service-list-item {
    font-size: 16px;
    cursor: pointer;
}

.pickup-service-list-item .v-btn,
.delivery-service-list-item .v-btn {
    box-shadow: none;
    background-color: transparent;
}

.btn-picker-area {
    text-align: right;
}

.list-flight-component-card .v-progress-circular,
.advanced-published-list-flight-component .v-progress-circular {
    display: flex;
    margin-left: auto;
    margin-right: auto;
    margin-top: 18px;
}

button.v-btn--variant-text {
    box-shadow: none;
}

.v-container.note-container,
.v-container.pickup-container,
.v-container.delivery-container {
    padding-top: 0px;
}

.v-container.note-container .v-row,
.v-container.pickup-container .v-row,
.v-container.delivery-container .v-row {
    margin-top: 0px !important;
}

.v-container.selected-flight {
    padding-bottom: 0px;
    padding-top: 0px;
    margin: 0px !important;
}

.v-container.selected-flight .flight-details .v-img {
    margin: 0px !important;
    padding: 0px;
    min-height: 20px;
}

.v-app-bar .selected-express-details span,
.v-app-bar .selected-flight-details span,
.v-container.selected-flight .flight-details span {
    min-width: 20px;
    margin: 0px 4px 0px 4px !important;
    display: inline-flex;
    vertical-align: middle;
}

.v-app-bar .selected-express-details span,
.v-app-bar .selected-flight-details span {
    padding-top: 9px !important;
    color: #FFF !important;
    font-size: 18px !important;
}

.v-app-bar .selected-express-details span.divider {
    display: inline-block;
}

.v-app-bar>div>div.v-row {
    margin-top: 0px !important;
    padding-top: 0px !important;
}

.v-container.selected-flight .flight-details {
    padding: 0px !important;
    padding-bottom: 9px !important;
    border-bottom: 1px solid #e1e1e1 !important;
}

.v-container.selected-flight .flight-details .v-row:first-child {
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
}

.v-container.selected-flight .flight-details .v-row .v-col {
    padding: 0px 0px 9px 0px !important;
}

.v-container.selected-flight .flight-details .v-row .v-col:nth-child(3) {
    font-size: 18px !important;
    padding: 0px 0px 4px 0px !important;
    color: #c6007e !important;
}

.v-container.selected-flight .flight-details .v-row .v-col.empty-item-title:nth-child(2),
.v-container.selected-flight .flight-details .v-row .v-col.empty-item-subtitle:nth-child(3) {
    font-size: 14px !important;
    color: rgb(48, 83, 163) !important;
}

.confirmation-request-container {
    margin-top: 9px;
}

.confirmation-request-container .confirmation-shipment-icons {
    margin: 20px auto 20px auto;
    max-width: 90px;
    text-align: center !important;
    display: flex;
}

.confirmation-request-container .confirmation-shipment-icons>div.confirmation-shipment-icon-wrapper {
    max-width: 30px !important;
    max-width: 30px !important;
    min-width: 30px !important;
    margin: auto;
}

.confirmation-request-container .confirmation-shipment-icons>div.confirmation-shipment-icon-wrapper>i {
    font-size: 22px !important;
}

.confirmation-request-container>div.confirmation-image-wrapper>div.confirmation-image {
    margin: 20px auto 20px auto;
    max-width: 200px;
    text-align: center;
}

.confirmation-request-container>div.confirmation-image-wrapper>div.confirmation-image i {
    font-size: 40px !important;
    color: green;
}

.confirmation-request-container>div.confirmation-subtitle-wrapper,
.confirmation-request-container>div.confirmation-title-wrapper>div.confirmation-title {
    text-align: center;
}

.confirmation-request-container>div.confirmation-subtitle-wrapper {
    font-size: 14px !important;
}

.confirmation-request-container>div.confirmation-title-wrapper>div.confirmation-title {
    font-size: 16px !important;
}

.confirmation-request-container>div.confirmation-bottom-icons-wrapper {
    text-align: center;
}

.confirmation-request-container>div.confirmation-control-wrapper>div.confirmation-control {
    margin: auto;
    max-width: 200px !important;
    text-align: center;
}

.confirmation-request-container>div.confirmation-control-wrapper>div.confirmation-control>.v-btn span {
    text-transform: capitalize !important;
}

.confirmation-request-container>div.confirmation-bottom-icons-wrapper,
.confirmation-request-container>div.confirmation-subtitle-wrapper,
.confirmation-request-container>div.confirmation-control-wrapper {
    margin: 12px 0px 12px 0px;
}

.confirmation-request-container>div.confirmation-control-wrapper>div.confirmation-control>.v-btn {
    margin: 0px !important;
    background: #232c6f;
    color: #FFF;
}

.v-toolbar .v-toolbar__content {
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
}

.appbar-form-lading-page>.v-toolbar__content {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.v-tabs--align-tabs-title:not(.v-slide-group--has-affixes) .v-tab:first-child {
    margin-left: 0px !important;
}

.v-tabs--align-tabs-title:not(.v-slide-group--has-affixes) .v-tab {
    padding: 0px 4px 0px 4px !important;
}

.v-tabs--align-tabs-title:not(.v-slide-group--has-affixes) button {
    margin: 0px !important;
    font-size: 9pt !important;
}

.v-tabs--align-tabs-title:not(.v-slide-group--has-affixes) button .v-btn__prepend {
    margin: 0px 3px 0px 2px !important;
}

.v-tab.v-tab.v-btn {
    border-radius: 0;
    height: var(--v-tabs-height);
    min-width: 85px;
}

.v-btn.v-tab {
    box-shadow: none !important;
}

.v-btn.v-tab-item--selected.v-tab--selected,
.v-btn.v-tab:focus,
.v-btn.v-tab::-moz-focus-inner {
    color: #232c6f;
}

.v-card-item__prepend .v-icon {
    color: #232c6f;
}

/* Button icons: inherit color so they contrast correctly on colored backgrounds */
.v-btn__content .v-icon {
    color: inherit;
}

.v-card-item .v-card-title {
    color: #232c6f;
}

.v-card-item .v-row {
    margin: 0;
}

.v-card-item .v-row .v-col-md-12,
.v-card-item .v-row .v-col-lg-12,
.v-card-item .v-row .v-col-xl-12,
.v-card-item .v-row .v-col-12,
.v-card-item .v-row .v-col-md-10,
.v-card-item .v-row .v-col-lg-10,
.v-card-item .v-row .v-col-xl-10,
.v-card-item .v-row .v-col-10,
.v-card-item .v-row .v-col-md-6,
.v-card-item .v-row .v-col-lg-6,
.v-card-item .v-row .v-col-xl-6,
.v-card-item .v-row .v-col-6,
.v-card-item .v-row .v-col-md-5,
.v-card-item .v-row .v-col-lg-5,
.v-card-item .v-row .v-col-xl-5,
.v-card-item .v-row .v-col-5,
.v-card-item .v-row .v-col-md-4,
.v-card-item .v-row .v-col-lg-4,
.v-card-item .v-row .v-col-xl-4,
.v-card-item .v-row .v-col-4,
.v-card-item .v-row .v-col-md-3,
.v-card-item .v-row .v-col-lg-3,
.v-card-item .v-row .v-col-xl-3,
.v-card-item .v-row .v-col-3,
.v-card-item .v-row .v-col-md-2,
.v-card-item .v-row .v-col-lg-2,
.v-card-item .v-row .v-col-xl-2,
.v-card-item .v-row.v-col-2,
.v-card-item .v-row .v-col-md-1,
.v-card-item .v-row .v-col-lg-1,
.v-card-item .v-row .v-col-xl-1,
.v-card-item .v-row .v-col-1 {
    padding: 3px;
}

.v-card-item .v-row .v-col {
    padding: 0px;
}

.v-label.v-field-label {
    font-size: 14px;
}

.v-field__input[type="email"],
.v-field__input[type="text"],
.v-field__input input[type="text"] {
    margin-bottom: 0px;
}

.v-field__input[type="text"] {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

input.v-field__input[type="text"] {
    box-shadow: none !important;
}

.v-field__input[type="text"]:focus,
.v-field__input input[type="text"]:focus,
.v-field__field textarea.v-field__input:focus {
    background-color: initial !important;
    border: 0 !important;
}

.v-text-field .v-input__details,
.v-input .v-input__details {
    padding-top: 0px !important;
    min-height: auto !important;
}

.v-text-field .v-input__details .v-messages {
    min-height: 14px !important;
}

.v-selection-control.v-selection-control--density-default.v-radio {
    height: 56px;
}

.v-selection-control label {
    font-weight: normal;
}

div[airports]>.v-btn {
    align-self: center;
    margin-right: 2px;
    margin-bottom: 0;
}

.note-courier-tab .v-btn {
    letter-spacing: 0;
}

.v-picker-title {
    display: none;
}

.v-btn.btn-outline-blue {
    color: #c6007e;
}

.flight-service-list,
.pickup-service-list,
.delivery-service-list {
    overflow: visible;
}

.package-list-row:nth-child(odd),
.flight-service-list .flight-service-list-item:nth-child(odd),
.pickup-service-list .pickup-service-list-item:nth-child(odd),
.delivery-service-list .delivery-service-list-item:nth-child(odd) {}

.package-list-row:nth-child(even),
.flight-service-list .flight-service-list-item:nth-child(even),
.pickup-service-list .pickup-service-list-item:nth-child(even),
.delivery-service-list .delivery-service-list-item:nth-child(odd) {
    background: #FFF;
}

.airline-sigla-avatar {
    font-size: 24px;
}

.toolbar-form-lading-page .v-tab-item--selected {
    background: #FFF !important;
    color: #232c6f !important;
}

.toolbar-form-lading-page .v-tab--selected .v-tab__slider {
    background: #FFFF !important;
}

.package-list-row {
    margin-bottom: 4px !important;
}

.package-list-row .v-row {
    margin-bottom: 0px !important;
}

.contact-component .v-col input,
.address-component .v-col input,
.package-list-row .v-col input {
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.contact-component .v-col input,
.address-component .v-col input {
    min-height: 24px !important;
    max-height: 24px !important;
    height: 24px !important;
    border: none !important;
}

.contact-component,
.address-component {
    width: 320px !important;
    margin: auto !important;
}

.address-component .cap-input-solo {
    width: 205px !important;
    margin: auto;
}

.address-component .cap-field-wrapper {
    margin: auto !important;
    display: flex;
    width: 260px !important;
}

.address-component .cap-field-wrapper .cap-input-solo div {
    width: 205px !important;
}

.address-component .cap-field-wrapper .show-all-field {
    color: rgb(48, 83, 163);
    cursor: pointer;
}

.address-component .cap-field-wrapper .v-icon {
    margin-top: 4px;
}

.package-list-row .v-col .package-description-row input {
    text-align: center !important;
    height: 20px !important;
    max-height: 20px !important;
    min-height: 20px !important;
    --v-input-control-height: 20px !important;
}

.package-list-row .v-col .package-description-row div {
    padding: 0px !important;
}

.package-list-row .v-col {
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    padding-bottom: 0px !important;
    padding-top: 0px !important;
}

.package-list-row {
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    padding-bottom: 6px !important;
    padding-top: 6px !important;
}

.package-description-row input.v-field__input[type="number"] {
    margin-bottom: 0px;
}

.package-description-row input.v-field__input[type="number"] {
    box-shadow: none !important;
    border-bottom: 1px solid #e1e1e1 !important;
    margin: 0px 4px 0px 4px !important;
}

.package-description-row .v-field--variant-filled .v-field__outline::before,
.package-description-row .v-field--variant-underlined .v-field__outline::before {
    border-bottom: 0px;
}

.package-description-row input.v-field__input[type="number"]:focus {
    background-color: #ffffff !important;
}

.notes-container-row {
    width: 100%;
}

.note-courier-tab .v-tab {
    padding: 4px;
    text-transform: none !important;
}

.note-courier-tab .v-card-text {
    padding: 0px;
}

.note-courier-tab .note-wrapper {
    padding: 0px;
}

.services-list,
.list-flight-component-card .v-card-text {
    padding: 10px !important;
}

.quote-request-contact-info .v-card-text {
    padding: 30px 20px 30px 20px !important;
}

.quote-request-contact-info,
.pickup-container,
.delivery-container,
.note-container,
.selected-flight,
.selected-flight .v-card-item {
    padding-left: 1px;
    padding-right: 1px;
}

.airline-sigla-avatar {
    padding: 6px;
    background: #FFF !important;
    border-radius: 0;
}

.v-row.control-filters>div {
    padding-bottom: 0px;
    margin: 0px;
}

.btn-backward span i,
.btn-forward span i {
    color: #68a0f0 !important;
    font-size: 30px !important;
}

.btn-backward span i:focus,
.btn-forward span i:focus,
.btn-backward span i:hover,
.btn-forward span i:hover {
    color: rgb(198, 0, 126) !important;
    font-size: 30px !important;
}

.btn-backward.last-step {
    margin-top: 10px !important;
}

.order-btn.order-btn-asc span i {
    color: #232c6f;
}

.order-btn.order-btn-desc span i {
    color: purple;
}

.result_list div.v-list-item {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.result_list div.v-list-item,
.flight-service-list-item,
.pickup-service-list-item,
.delivery-service-list-item {
    font-size: 16px;
    cursor: pointer;
}

.btn-picker-area {
    text-align: right;
}

.list-flight-component-card .v-progress-circular {
    display: flex;
    margin-left: auto;
    margin-right: auto;
}

button.v-btn--variant-text {
    box-shadow: none;
}

.v-container.note-container,
.v-container.pickup-container,
.v-container.delivery-container {
    padding-top: 0px;
}

.v-container.note-container .v-btn {
    margin: 0px !important;
    height: 36px !important;
}

.v-container.note-container .note-courier-tab .v-tab {
    padding: 0px !important;
    text-align: left !important;
}

.v-container.note-container .note-courier-tab .v-tab.v-btn:first-child span.v-btn__content {
    margin-left: -10px !important;
}

.v-container.note-container .note-courier-tab .v-tab.v-btn span {
    text-align: left !important;
    padding: 0px !important;
    margin: 0px !important;
}

.v-container.selected-flight .v-card-item,
.v-container.selected-flight {
    padding-top: 0px !important;
}

.calendar-dialog .v-card-title,
.calendar-dialog .v-card-title button {
    margin: 0px !important;
    padding: 0px !important;
}

.calendar-dialog .v-date-picker-header__content {
    font-size: 28px !important;
}

.calendar-dialog .v-date-picker-header {
    height: 46px !important;
    padding-bottom: 0px;
    padding-top: 0px;
}

.calendar-dialog .v-date-picker {
    width: inherit !important;
}

.calendar-dialog .v-card-text {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.v-checkbox .v-selection-control,
.v-selection-control.v-selection-control--density-default.v-checkbox-btn,
.v-selection-control.v-selection-control--density-default.v-checkbox-btn>* {
    min-height: 40px !important;
}

.v-selection-control.v-checkbox-btn .v-label {
    margin-bottom: 0px;
}

@media only screen and (max-width: 480px) {
    .page .section_wrapper {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
}

#cookie-law-info-again {
    display: none !important;
}

.tab-selected-item.v-tab--selected {
    color: #c6007e !important;
}

.tab-selected-item.v-tab--selected>span>div {
    display: none !important;
}

input[type="date"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
select,
textarea,
.woocommerce .quantity input.qty,
.dark input[type="email"],
.dark input[type="password"],
.dark input[type="tel"],
.dark input[type="text"],
.dark select,
.dark textarea {
    color: #626262;
    background-color: #FFF !important;
    border-color: #FFF !important;
}

.selected-country-flag-wrapper:hover {
    cursor: pointer;
}

.selected-country-flag-wrapper {
    text-align: center !important;
}

.selected-country-flag-wrapper .selected-country-flag img {
    width: 28px !important;
    margin-top: 0px !important;
}

.selected-country-flag-wrapper .selected-country-flag {
    text-align: center;
    margin: 4px auto 5px auto !important;
    width: 28px !important;
    height: inherit !important;
}


.option-switch-col-related i {
    font-size: 25px !important;
    color: #c6007e !important;
}

.option-switch-label-related {
    font-size: 15px !important;
    height: 40px !important;
    color: #c6007e !important;
}


.option-switch-label-related>i {
    margin: 0px 8px 0px 0px !important;
}

.v-navigation-drawer__scrim {
    position: fixed !important;
    height: 100% !important;
    width: 100% !important;
}

.drawer-main {
    height: calc(100% - 112px) !important;
    top: 48px !important;
}

.drawer-main.v-navigation-drawer--active {
    width: 80% !important;
    top: 48px !important;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield !important;
}

.main-card-wrapper {
    padding: 0px 4px 0px 4px !important;
    max-width: 380px !important;
    margin: auto;
}

.v-row.preferred-country-row {
    margin-top: 0px;
    overflow: visible;
}

.preferred-country-col {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    display: flex;
    overflow: visible;
}

.preferreed-country-flag {
    flex-shrink: 0;
    cursor: pointer;
    margin-left: 0px;
    margin-right: 0px;
    overflow: visible !important;
    height: auto !important;
    min-height: 30px !important;
}

.preferreed-country-flag .v-img__img {
    object-fit: contain !important;
}

.preferreed-country-flag .v-responsive__content {
    overflow: visible !important;
}

.preferreed-country-flag img {
    display: block;
    padding: 0px !important;
    vertical-align: middle;
    height: auto !important;
    max-height: none !important;
}

/* Forzar overflow visible en v-img de Vuetify */
.preferreed-country-flag.v-img,
.preferreed-country-flag .v-responsive,
.preferreed-country-flag .v-responsive__sizer {
    overflow: visible !important;
}

.selected-country-flag {
    height: 43px;
}

.v-toolbar__append {
    width: 100px;
    justify-content: flex-end;
}

.active-title {
    width: 100%;
    text-align: center;
    color: #FFF;
    display: block;
}

.v-toolbar__content>.v-toolbar-title.active-title-wrapper {
    margin: 0px !important;
}

.contact-component>.v-row>div>.v-row>div,
.contact-component>.v-row>.v-col-12>.v-row>.v-col-12,
.address-component>.v-row>div>.v-row>div,
.address-component>.v-row>.v-col-12>.v-row>.v-col-12 {
    padding-top: 0px;
    padding-bottom: 0px;
}

.address-component>div.v-container {
    padding: 0px !important;
}

.address-component>div.v-container>div.v-row {
    margin: 0px !important;
}


input.v-field__input {
    height: 40px !important;
    max-height: 40px !important;
    min-height: 40px !important;
}

.v-navigation-drawer__content {
    padding: 8px !important;
}

.v-messages>div {
    min-block-size: 19px !important;
}

.selected-supplements {
    margin: 2px 0px 2px 0px !important;
    text-align: center;
    width: 100% !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

.selected-supplements .supplement-icon-wrapper {
    min-width: 30px !important;
    width: 30px !important;
    display: inline !important;
}

.selected-supplements .supplement-icon-wrapper:hover {
    cursor: pointer !important;
}

.selected-supplements .supplement-icon-wrapper i {
    color: #68a0f0 !important;
    font-size: 28px !important;
}

.selected-supplements .supplement-icon-wrapper i.active {
    color: rgb(198, 0, 126) !important;
}

.selected-supplements .supplement-icon-wrapper {
    width: 40px !important;
    margin: 0px 8px 0px 8px !important;
}

.list-flight-component-card {
    overflow: hidden !important;
}

.airline-avatar-label {
    font-size: 12px !important;
    font-weight: normal !important;
    text-align: center !important;
}

.btn-down-flight-detail-control {
    font-size: 26px !important;
    float: right !important;
    top: 0px !important;
}

.v-avatar {
    padding: 0px !important;
    width: 39px !important;
}

.published-reate-item .v-avatar img,
.realtime-flight-item .v-avatar img {
    width: 39px !important;
}

.airline-flights-group .v-col {
    padding: 4px !important;
    font-size: 14px;
}

.flight-item-group {
    padding: 4px 0px 4px 0px;
    border-top: 1px solid #e1e1e1;
}

.flight-item-group>div.v-col {
    margin: 4px !important;
}

.best-route.flight {
    font-size: 16px !important;
    padding-left: 10px !important;
}

.best-route-price.flight-price {
    padding-right: 0px !important;
    font-weight: bolder !important;
    font-size: 16px !important;
}

.promo.best {
    color: rgb(198, 0, 126) !important;
}

.promo.best span {
    padding: 0px 0px 0px 0px !important;
    text-align: right !important;
}

.promo.best i {
    font-size: 14px !important;
    padding: 0px 8px 6px 0px !important;
}

i.promo.best {
    margin-top: 4px !important;
}

.avatar-wrapper {
    text-align: center;
}

.best-route-wrapper>.v-row {
    min-height: 27px !important;
}

.flight-price-detail {
    padding-right: 12px !important;
    font-size: 14px !important;
}


.flight-item-group .flight-price i {
    margin-top: -4px;
}

.flight-item-group:last-child {
    border-bottom: 1px solid #e1e1e1 !important;
}

.shipment-date-wrapper,
div.package-list-container,
div.package-list-container .v-row {
    padding: 0px !important;
    margin: auto !important;
    margin-top: 0px !important;
    width: 100% !important;
}

div.package-list-container .v-row .v-col.package-list-wrapper {
    padding: 4px 12px 4px 12px !important;
    overflow-x: hidden;
}

div.package-list-container {
    min-width: 100% !important;
}

div.package-list-container div.v-row div.v-col {
    padding-top: 2px !important;
    padding-bottom: 0px !important;
}

div.package-simple-list-container.package-simple-list-container {}

.label-dimension {
    font-size: 14px !important;
    margin: 0px !important;
    padding-top: 8px !important;
    text-transform: uppercase;
}

.date-component-card .v-card-text {
    padding: 6px !important;
}

.date-component>button {
    margin: 0px !important;
}

.v-date-picker-month__day {
    max-width: 40px !important;
    width: 40px !important;
    height: 40px !important;
}

button.v-date-picker-month__day-btn {
    margin: 0px !important;
    padding: 0px !important;
}

.package-abstract-wrapper,
.shipment-date-wrapper {
    width: 100%;
    text-align: center;
    display: flex;
}

.package-abstract-wrapper {
    height: 38px !important;
}

.shipment-date-wrapper {
    padding: 0px !important;
}

.package-abstract {
    margin: auto !important;
    margin-bottom: 6px !important;
    border-bottom: 1px solid #e1e1e1;
    text-align: center !important;
}

.date-component {
    padding: 0px 0px 0px 0px !important;
    margin: auto !important;
}

.package-abstract .package-abstract-field label {
    display: inline !important;
    font-weight: bold !important;
}

.date-component .date-label,
.package-abstract .package-abstract-field {
    margin: 0px 6px 0px 6px !important;
    color: rgb(98, 98, 98) !important;
    text-transform: uppercase;
    font-weight: 450;
}

.date-component .date-label {
    text-transform: capitalize !important;
}

.package-abstract .package-abstract-field.vol-applied {
    color: #c6007e !important;
}

.btn-backward.date,
.btn-forward.date {
    float: left;
}

.btn-select-date {
    min-width: 100px !important;
    width: 100px !important;
    max-width: 100px !important;
    float: left;
}

.v-row.option-switch-row-related>div {
    padding-top: 0px !important;

}

.v-row.option-switch-row-related>div.v-col-8 {
    margin-top: -8px !important;
}

.v-row.option-switch-row-related>div.v-col-8>div {
    display: inline !important;
    padding-left: 0px !important;
}

.v-row.option-switch-row-related>div.v-col-8>div.v-row,
.v-row.option-switch-row-related>div.v-col-8>div.v-row .v-col {
    padding: 0px !important;
    margin: 0px !important;
}

.v-row.option-switch-row-related>div.icon-label {
    margin-top: 0px !important;
    width: 100% !important;
    text-align: center;
}

.v-input__control .v-field__append-inner i {
    max-height: 20px !important;
    height: 20px !important;
}

.v-input--density-default .v-field--variant-plain,
.v-input--density-default .v-field--variant-underlined {
    --v-input-control-height: 40px;
    --v-field-padding-top: 0px;
    --v-field-padding-bottom: 0px;
}

.preferred-package-avatar,
.preferred-address-avatar {
    height: 30px !important;
    width: 30px !important;
    margin: 0px 4px !important;
}

.preferred-package-avatar img,
.preferred-address-avatar img {
    height: 30px !important;
    width: 30px !important;
}

.preferred-package-col,
.preferred-address-col {
    max-width: 280px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 4px !important;
    padding-bottom: 12px !important;
    display: flex;
}

.preferred-package-col .v-avatar,
.preferred-address-col .v-avatar {
    margin: 0px auto 0px auto !important;
}

.appbar-rubrica-search *,
.appbar-rubrica-search input {
    background: transparent !important;
    border: none !important;
    color: #FFF !important;
}

.appbar-rubrica-search .v-field__append-inner {
    padding-bottom: 0px !important;
}

.appbar-rubrica-search input {
    padding: 0px !important;
}

.v-card.promo * {
    padding: 0px !important;
}

.v-card.promo {
    text-align: center;
    background: transparent !important;
    color: transparent !important;
    width: 100% !important;
}

.v-card.promo.promo-bottom {
    text-align: center;
    background: transparent !important;
    color: transparent !important;
    bottom: 68px !important;
    position: fixed !important;
    left: 0px !important;
    width: 100% !important;
}

.promo .v-card-subtitle {
    color: gray !important;
}

.promo .v-card-title {
    font-size: 16px !important;
    color: #3053a3 !important;
}

.airport-map-selector.v-btn .icon-image-wrapper {
    padding: 0px !important;
}

.airport-map-selector.v-btn {
    border: none !important;
    min-height: 36px !important;
    max-width: 36px !important;
    min-width: 36px !important;
    width: 36px !important;
    padding: 0px !important;
    margin: 0px !important;
    background: none !important;
    margin-left: -8px !important;
}

.airport-map-selector .v-icon {
    font-size: 22px !important;
}

.package-list-wrapper {
    min-height: 105px !important;
    height: 105px !important;
    max-height: 105px !important;
    overflow: auto !important;
}

.package-delete-btn.v-btn {
    height: 20px !important;
    width: 20px !important;
    margin: 0px !important;
}

.add-package-btn.v-btn {
    height: 30px !important;
    width: 30px !important;
    margin: 0px !important;
}

.add-package-btn.v-btn i {
    font-size: 30px !important;
}

.package-delete-btn.v-btn i {
    font-size: 20px !important;
}

.insurance-btn.v-btn i {
    font-size: 27px !important;
    color: rgb(198, 0, 126) !important;
}

.insurance-btn.v-btn i.active-btn {
    color: darkgreen !important;
}

.note-selector-btn.v-btn i,
.note-selector-btn.v-btn i.no-active-btn,
.pickup-selector-btn.v-btn i,
.pickup-selector-btn.v-btn i.no-active-btn,
.delivery-selector-btn.v-btn i,
.delivery-selector-btn.v-btn i.no-active-btn {
    font-size: 36px !important;
    color: #68a0f0 !important;
    padding-right: 6px;
}

.note-selector-btn.v-btn .v-btn__content,
.pickup-selector-btn.v-btn .v-btn__content,
.delivery-selector-btn.v-btn .v-btn__content {
    justify-content: left;
}

.note-selector-btn.v-btn i.no-active-btn,
.pickup-selector-btn.v-btn i.no-active-btn,
.delivery-selector-btn.v-btn i.no-active-btn {
    margin-right: 8px !important;
}

.note-selector-btn.v-btn i.active-btn,
.pickup-selector-btn.v-btn i.active-btn,
.delivery-selector-btn.v-btn i.active-btn {
    font-size: 36px !important;
    color: rgb(198, 0, 126) !important;
    padding-right: 6px;
}

.pkp-dst-remove-btn {
    color: #999 !important;
    opacity: 0.7;
    transition: opacity 0.2s, color 0.2s;
    margin: 0px !important;
}

.pkp-dst-remove-btn:hover {
    opacity: 1;
    color: #d32f2f !important;
}

.note-selector-btn,
.pickup-selector-btn,
.delivery-selector-btn {
    text-transform: none !important;
    font-weight: normal !important;
    font-size: 13px !important;
    margin-bottom: 0px !important;
    margin: auto !important;
}

.note-container {
    padding-bottom: 0px !important;
    height: 100% !important;
}

.pickup-container,
.delivery-container {
    padding: 0px !important;
    height: auto !important;
}

.insurance-dialog .v-card {
    max-width: 320px;
    margin: auto;
}

.insurance-container .v-btn.insurance-cancel-btn span,
.insurance-container .v-btn.insurance-cancel-btn i,
.insurance-container .v-btn.insurance-confirm-btn span,
.insurance-container .v-btn.insurance-confirm-btn i {
    margin: 0px !important;
    padding: 0px !important;
}


.insurance-container .v-btn.insurance-cancel-btn,
.insurance-container .v-btn.insurance-confirm-btn {
    font-size: 12px !important;
    padding: 0px 4px 0px 4px !important;
    margin: 2px 4px 2px 4px !important;
    text-transform: none !important;
    height: 20px !important;
}

.insurance-container .v-btn.insurance-cancel-btn {
    color: red !important;
}

.insurance-container .v-btn.insurance-confirm-btn {
    color: darkgreen !important;
}

.insurance-container .v-col {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

.insurance-container>.v-row {
    margin-top: 0px !important;
}

.insurance-container {
    padding: 0px 0px 0px 0px !important;
    margin: auto !important;
    max-width: 300px !important;
    text-align: center !important;
}

.insurance-icon {
    text-align: center !important;
}

.insurance-icon button.insurance-btn.v-btn {
    height: 32px !important;
}

.insurance-btn.v-btn {
    margin: 0px !important;
    padding: 2px 0px 2px 0px !important;
}

.package-delete-btn.v-btn i,
.add-package-btn.v-btn i {
    color: #68a0f0 !important;
}

.package-delete-btn.v-btn:hover i,
.package-delete-btn.v-btn:focus i,
.add-package-btn.v-btn:hover i,
.add-package-btn.v-btn:focus i {
    color: rgb(198, 0, 126) !important;
}

.metric-selector.v-btn,
.metric-selector.v-btn i {
    font-size: 30px !important;
    padding: 0px !important;
    margin: 0px !important;
    width: 30px !important;
    height: 30px !important;
    max-height: 30px !important;
    min-width: 30px !important;
}


/* Layout two-rows: icono + label unificados en un solo botón */
.appbar-form-lading-page .appbar-two-rows {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.appbar-form-lading-page .appbar-two-rows .appbar-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* flex-basis 0 en ambas zonas laterales: el reparto del ancho NO depende
       del contenido (1 icono a la derecha vs 2 a la izquierda), así que el
       centro queda centrado respecto a la barra completa. Antes la izquierda
       usaba flex:1.1 y crecía con su contenido, descentrando el título. */
    flex: 1 1 0;
    min-width: 0;
}

.appbar-form-lading-page .appbar-two-rows .appbar-col.appbar-col-wide {
    flex: 2 1 0;
}

/* `appbar-col-menu` host the hamburger menu next to the column's primary
   action (back arrow or file picker). Keep them on a row so the menu is
   always one tap away from anywhere in the wizard. */
.appbar-form-lading-page .appbar-two-rows .appbar-col.appbar-col-menu,
.appbar-form-lading-page .appbar-col.appbar-col-menu {
    flex-direction: row !important;
    gap: 2px;
    /* Mismo peso/base que la zona derecha para mantener la simetría: con dos
       iconos (hamburguesa + atrás) la zona ya no debe ensancharse respecto a
       la derecha, así el título central queda centrado en la barra. */
    flex: 1 1 0;
}

.appbar-form-lading-page .appbar-col-menu .main-menu-component {
    display: inline-flex;
    align-items: center;
}

/* Menu button visibility on the dark blue appbar — force white icon and
   sensible hit area. The component itself uses `color="primary"` which
   renders almost invisible against #3053a3. */
.appbar-form-lading-page .main-menu-component > .v-btn,
.appbar-form-lading-page .appbar-col-menu .main-menu-component .v-btn {
    color: #FFF !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.appbar-form-lading-page .main-menu-component .v-btn .v-icon,
.appbar-form-lading-page .appbar-col-menu .main-menu-component .v-btn i {
    color: #FFF !important;
    font-size: 24px !important;
}

/* Tighten the back button when sharing a column with the menu so they
   don't overflow the available width. */
.appbar-form-lading-page .appbar-col-menu .appbar-back-btn {
    padding: 2px 4px !important;
}

/* Botón stacked: ícono arriba, label abajo, todo clickeable */
.appbar-form-lading-page .appbar-two-rows .appbar-stacked-btn {
    height: auto !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 4px 8px !important;
    margin: 0 !important;
    color: #FFF !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 1px;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.appbar-form-lading-page .appbar-two-rows .appbar-stacked-btn .v-btn__content {
    flex-direction: column !important;
    gap: 1px;
}

.appbar-form-lading-page .appbar-two-rows .appbar-stacked-btn i {
    font-size: 22px !important;
    color: #FFF !important;
}

.appbar-form-lading-page .appbar-two-rows .appbar-col-label {
    font-size: 11px;
    color: #FFF;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    text-align: center;
}

.appbar-form-lading-page .appbar-two-rows .list-filtered-total {
    font-size: 10px;
    opacity: 0.85;
}

.metric-selector>.v-btn__content>.v-icon.metric-system-selector {
    color: #c6007e !important;
}

.metric-selector>.v-btn__content>.v-icon.is-metric.metric-system-selector {
    color: #232c6f !important;
}

.quore-request-display-btn {
    font-size: 30px !important;
}

textarea {
    margin-bottom: 0px !important;
    max-height: 66px !important;
    height: 66px !important;
}

.pickup-price,
.delivery-price {
    padding-top: 11px !important;
    font-size: 14px !important;
}

.main-navigation-tabs {
    text-align: center !important;
    left: 0px !important;
    padding-bottom: 0px !important;
    width: 100% !important;
    text-align: center;
    margin: auto !important;
    max-width: 100% !important;
    padding-top: 0px !important;
}

.main-navigation-tabs .v-row .v-col {
    padding: 0px !important;
}

.main-navigation-tabs .findair-btn-row>.v-col {
    padding: 0px !important;
    padding-bottom: 40px !important;
}

.main-navigation-tabs .v-tab.v-btn.v-tab {
    width: 40px !important;
    min-width: 40px !important;
    margin: 0px 3px 0px 3px;
}

.main-navigation-tabs .v-tab.v-btn.v-tab.disabled {
    cursor: unset !important;
}

.main-navigation-tabs .v-tab.v-btn.v-tab:first-child {
    margin-inline-start: auto;
}

.main-navigation-tabs .v-tab.v-btn.v-tab:last-child {
    margin-inline-end: auto;
}

.main-navigation-tabs .v-tab.v-btn.v-tab span i {
    font-size: 28px !important;
}

.main-navigation-tabs .v-tab.disabled {
    color: #d1d1d1 !important;
}

.main-navigation-tabs-inner .v-btn__prepend {
    margin: 0px !important;
}

.main-navigation-tabs-inner .v-btn {
    text-align: center !important;
}

.main-navigation-tabs-inner .v-btn {
    padding: 0px 10px !important;
}

.flights-list-activated {
    bottom: 56px !important;
    background-color: #FFF !important;
}

.flights-list-activated .findair-btn-row {
    display: none !important;
}

.nav-tabs-row.v-row {
    margin: 0px !important;
}

/* ============================================
   Navigation Status Indicators
   Indicadores visuales de estado de sección
   ============================================ */

/* Tab con indicador de estado */
.nav-tab-with-status {
    position: relative !important;
}

/* Indicador de estado en la esquina del tab */
.nav-status-indicator {
    position: absolute !important;
    top: 0px !important;
    right: 4px !important;
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    opacity: 0.95;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.nav-status-indicator.v-icon {
    font-size: 14px !important;
}

.nav-status-indicator .v-icon__svg,
.nav-status-indicator::before {
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
}

/* Efecto hover en indicadores incompletos */
.nav-tab-with-status:hover .nav-status-indicator {
    transform: scale(1.15);
    opacity: 1;
}

/* Colores específicos para estados */
.nav-status-indicator.text-warning {
    color: #FB8C00 !important;
}

.nav-status-indicator.text-success {
    color: #4CAF50 !important;
}

.nav-status-indicator.text-error {
    color: #FF5252 !important;
}

.nav-status-indicator.text-grey {
    color: #9E9E9E !important;
}

/* ============================================
   Error Dialog Navigation Styles
   Estilos para diálogo de errores con navegación
   ============================================ */

/* Lista de errores navegable */
.error-navigation-list {
    max-height: 250px;
    overflow-y: auto;
}

/* Item de error clickeable */
.error-item-navigable {
    cursor: pointer !important;
    transition: background-color 0.2s ease;
    border-radius: 4px;
    margin-bottom: 4px;
}

.error-item-navigable:hover {
    background-color: rgba(244, 67, 54, 0.08) !important;
}

/* Label de sección en error */
.error-section-label {
    font-weight: 500 !important;
    font-size: 0.875rem !important;
}

/* Mensaje de error */
.error-message {
    font-size: 0.75rem !important;
    color: rgba(0, 0, 0, 0.6) !important;
}

/* Icono de navegación */
.error-item-navigable .v-list-item__append .v-icon {
    color: rgba(0, 0, 0, 0.4) !important;
    transition: transform 0.2s ease;
}

.error-item-navigable:hover .v-list-item__append .v-icon {
    transform: translateX(2px);
    color: rgba(0, 0, 0, 0.6) !important;
}

.dialog-box .v-card>.v-card-actions .v-btn span {
    color: #FFF;
}

/* v-btn rendered as anchor should never have underline */
a.v-btn:hover,
a.v-btn:focus {
    text-decoration: none;
}

/* Message list dialog */
.message-list-dialog-wrapper .message-toolbar-subtitle {
    font-size: 11px;
    opacity: 0.85;
    display: flex;
    align-items: center;
    gap: 3px;
    margin-top: -2px;
}

.message-list-dialog-wrapper .crm-message-item {
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.message-list-dialog-wrapper .crm-message-item:hover {
    background-color: rgba(25, 118, 210, 0.05);
}

.message-list-dialog-wrapper .shipment-thread-view {
    max-height: 350px;
    overflow-y: auto;
    scrollbar-width: thin;
    padding: 16px;
}

.message-list-dialog-wrapper .shipment-thread-view::-webkit-scrollbar {
    width: 4px;
}

.message-list-dialog-wrapper .shipment-thread-view::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.message-list-dialog-wrapper .thread-reply-wrapper {
    padding: 12px 16px;
}

@media (max-width: 480px) {
    .message-list-dialog-wrapper .shipment-thread-view {
        max-height: 280px;
        padding: 10px;
    }
}
/*end dialog message*/

/*.shipment-list-component*/

.shipment-list-component.express-list-component .shipment-list-header-filter-wrapper {
    margin-bottom: 0px;
}

.shipment-list-component .shipment-list-wrapper div.v-infinite-scroll {
    --shipment-list-offset: 262px;
    height: calc(100vh - var(--shipment-list-offset)) !important;
    /* Reserva el espacio de la barra de scroll (igual que la lista CRM): en
       navegadores con scrollbar de ancho físico (Windows/Linux clásico) evita
       que el contenido salte o quede pegado al borde al aparecer la barra.
       Cubre las listas de expediciones cargo Y courier (mismo componente base).
       Estrategia en capas:
        - overflow-y: scroll -> fallback universal (incl. navegadores antiguos
          sin soporte de scrollbar-gutter): reserva el carril SIEMPRE.
        - scrollbar-gutter: stable -> navegadores modernos: reserva el espacio
          sin mostrar barra "muerta" cuando no hace falta scroll.
        - scrollbar-width: thin -> barra más discreta donde se soporta. */
    overflow-y: scroll;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
}

.crm-list-component .crm-list-wrapper div.v-infinite-scroll {
    --crm-list-offset: 214px;
    height: calc(100vh - var(--crm-list-offset)) !important;
    /* Mismo esquema en capas que la lista cargo/courier (ver arriba):
       overflow-y: scroll como fallback universal + scrollbar-gutter para modernos. */
    overflow-y: scroll;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper {
    display: flex;
    width: 100%;
    padding-left: 8px;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper>div {
    width: auto;
    display: flex;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper>div:last-child>div.order-by-wrapper {
    padding-left: 12px;
    width: 140px;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper>div:last-child>div.total-wrapper {
    padding-top: 9px;
    font-size: 12px;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper>div>div.v-switch {
    height: 40px;
    padding: 0px !important;
    min-width: 150px;
}

.shipment-list-component .order-desc-asc {
    margin: auto;
    font-size: 24px;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper>div>div.v-switch .v-selection-control.v-selection-control--density-default {
    min-height: 40px;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper>div>div.v-switch>div.v-input__control>div.v-selection-control>label {
    height: 28px;
    padding-top: 5px;
    font-size: 12px;
    font-weight: normal;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper>div div.order-by-wrapper>div.v-select .v-input__append,
.shipment-list-component .shipment-list-header-sup-items-wrapper>div div.order-by-wrapper>div.v-select>div.v-input__control .v-field__append-inner {
    padding: 9px 4px 4px 4px;
    margin: 0px 4px 0px 4px;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper div.order-by-wrapper>div.v-select>div.v-input__control .v-field__input input {
    margin-top: 0px;
    padding: 8px 4px 0px 4px;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper div.order-by-wrapper>div.v-select>div.v-input__control .v-field__input {
    padding: 0px !important;
    margin: 0px;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper div.order-by-wrapper>div.v-select .v-messages {
    display: none;
}

.shipment-list-component .shipment-list-header-sup-items-wrapper div.order-by-wrapper>div.v-select>div.v-input__control .v-field__input {
    height: 40px !important;
    min-height: 40px !important;
    font-size: 12px;
}


.shipment-list-component .shipment-list-header {
    display: inline-block !important;
    margin: auto !important;
    width: 100%;
}

.shipment-list-component .shipment-list-header>div.shipment-list-header-filter-wrapper {
    width: 100% !important;
    min-width: 100% !important;
}

.shipment-list-component .shipment-list-header>div.shipment-list-header-items-wrapper {
    display: flex;

}

.shipment-list-component .shipment-list-header>div.shipment-list-header-items-wrapper>div.header {
    padding: 0px !important;
    display: flex;
    cursor: pointer;
    margin: auto;
}

.shipment-list-component .shipment-list-header div.header>div.sorting-icon {
    min-width: 20px !important;
    width: 20px !important;
    height: 20px !important;
}

.shipment-list-item-btn.v-btn {
    margin: 2px 4px 2px 4px !important;
}

.shipment-list-component .v-card .v-card-text {
    color: rgba(0, 0, 0, 1);
}

/*.shipment-list-component express */

.express-list-component div.item.even {
    background-color: #ffffff;
}

.express-list-component div.item.odd {
    background-color: #f8f9fc;
}

.express-list-component div.item.is-offer {
    border-left: 3px solid #c6007e;
    padding-left: 5px;
}

.express-list-component div.item.is-offer .v-card.express-item {
    background-color: rgba(198, 0, 126, 0.03);
}

/* Express card — 3-row layout */
.express-list-component .express-item .v-card-text {
    padding: 6px 8px !important;
}

.express-list-component .express-item .item-wrapper {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.express-list-component .express-item .express-row {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 24px;
}

/* Row 1 — Primary (2 columns: ID left | carrier+AWB right) */
.express-list-component .express-row--primary {
    justify-content: space-between;
    gap: 8px;
}

.express-list-component .express-row--primary .express-shipment-id {
    font-size: 12px;
    font-weight: 700;
    color: #1565C0;
    white-space: nowrap;
    flex-shrink: 0;
    font-family: monospace;
}

.express-list-component .express-row--primary .express-primary-right {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    margin-left: auto;
}

.express-list-component .express-row--primary .express-carrier-text {
    font-size: 11px;
    font-weight: 600;
    color: rgba(48, 83, 163, 0.8);
    white-space: nowrap;
}

.express-list-component .express-row--primary .express-awb-number {
    font-size: 11px;
    font-weight: 500;
    color: rgba(48, 83, 163, 0.8);
    background: rgba(48, 83, 163, 0.08);
    border-radius: 4px;
    padding: 1px 5px;
    white-space: nowrap;
    flex-shrink: 0;
    font-family: monospace;
}

/* Row 2 — Name (flag + receiver name + price) */
.express-list-component .express-row--name {
    justify-content: space-between;
    gap: 6px;
}

.express-list-component .express-row--name .express-name-left {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.express-list-component .express-row--name .express-receiver-name {
    font-size: 14px;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.87);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 1;
}

.express-list-component .express-row--name .express-primary-price {
    display: flex;
    align-items: baseline;
    gap: 2px;
    flex-shrink: 0;
    margin-left: auto;
}

.express-list-component .express-row--name .express-price-value {
    font-size: 15px;
    font-weight: 700;
    color: #c6007e;
}

.express-list-component .express-row--name .express-price-currency {
    font-size: 11px;
    font-weight: 500;
    color: #c6007e;
    opacity: 0.8;
}

/* Row 2 — Secondary (city + meta + status badge) */
.express-list-component .express-row--secondary {
    justify-content: space-between;
    gap: 4px;
}

.express-list-component .express-row--secondary .express-secondary-left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 3px;
    flex: 1 1 auto;
    min-width: 0;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.6);
    overflow: hidden;
}

.express-list-component .express-city {
    font-size: 13px;
    font-weight: 600;
    color: rgb(48, 83, 163);
    white-space: nowrap;
}

.express-list-component .express-sep {
    color: rgba(0, 0, 0, 0.3);
    font-size: 12px;
    padding: 0 1px;
}

.express-list-component .express-date,
.express-list-component .express-weight,
.express-list-component .express-service-level {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.6);
    white-space: nowrap;
}

.express-list-component .express-service-level {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.express-list-component .express-row--secondary .express-secondary-right {
    flex-shrink: 0;
}

.express-list-component .express-status-chip {
    font-size: 10px !important;
    font-weight: 600 !important;
    height: 20px !important;
    letter-spacing: 0.02em;
}

.express-list-component .express-status-chip .v-chip__content {
    padding: 0 5px !important;
}

/* Row 3 — Actions */
.express-list-component .express-row--actions {
    justify-content: flex-start;
    gap: 2px;
    padding-top: 2px;
}

.express-list-component .express-row--actions .btn-wrapper,
.express-list-component .express-row--actions .offer-btn,
.express-list-component .express-row--actions .express-action-btn {
    min-width: 52px !important;
    max-width: 64px !important;
    height: 26px !important;
    font-size: 11px !important;
    padding: 0 6px !important;
    margin: 0 !important;
    opacity: 0.75;
    transition: opacity 0.15s ease;
}

.express-list-component .express-row--actions .btn-wrapper:hover,
.express-list-component .express-row--actions .offer-btn:hover,
.express-list-component .express-row--actions .express-action-btn:hover {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.04);
    border-radius: 4px;
}

.express-list-component .express-row--actions .btn-wrapper.v-btn--disabled {
    opacity: 0.3 !important;
    cursor: default;
}

/* Carrier logo component */
.carrier-logo-component {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.carrier-logo-img {
    display: block;
    width: auto;
    object-fit: contain;
}

.carrier-logo-fallback {
    font-size: 11px;
    font-weight: 600;
    color: rgba(48, 83, 163, 0.8);
    white-space: nowrap;
}

/*.shipment-list-component express end */

/* Mobile breakpoints for shipment list */
@media (max-width: 768px) {
    .express-list-component .express-row--primary .express-awb-number {
        display: none;
    }

    .express-list-component .express-service-level {
        display: none;
    }
}

@media (max-width: 480px) {
    .shipment-list-component .shipment-list-header-sup-items-wrapper {
        flex-wrap: wrap;
    }

    .shipment-list-component .shipment-list-header-sup-items-wrapper>div:last-child>div.order-by-wrapper {
        width: 120px;
    }

    .express-list-component .express-row--primary {
        flex-wrap: wrap;
    }

    .express-list-component .express-row--secondary .express-secondary-left {
        font-size: 11px;
    }

    .express-list-component .express-status-chip {
        font-size: 9px !important;
    }
}

/*.shipment-detail-dialog*/

.shipment-detail-dialog .v-card>.v-card-text,
.shipment-detail-dialog .v-card>.v-card-item {
    padding: 0px !important;
    margin: 0px;
}

.shipment-detail-dialog .v-card>.v-card-item {
    margin-bottom: 6px;
}

.shipment-detail-dialog .v-card>.v-card-actions {
    min-height: 44px !important;
    padding: 6px 12px !important;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
}

.shipment-detail-dialog div.v-card {
    padding: 12px 8px 12px 8px !important;
}

.shipment-detail-dialog .v-card .v-card-title {
    font-size: 11pt !important;
}

.shipment-detail-dialog .v-card.shipment-detail-card > .v-card-actions {
    background: rgb(48, 83, 163) !important;
    border-radius: 0 0 4px 4px;
    color: #FFF;
    flex: 0 0 auto;
}

.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn {
    background: rgba(255,255,255,0.15) !important;
    border-radius: 6px;
    color: #FFF !important;
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0.3px;
    font-size: 12px;
}

.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn:hover {
    background: rgba(255,255,255,0.30) !important;
}

.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn .v-icon {
    color: #FFF !important;
}

.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn-success {
    background: #4caf50 !important;
    border-radius: 6px;
    color: #FFF !important;
    text-transform: none;
    font-weight: 500;
    font-size: 12px;
}

.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn-success:hover {
    background: #43a047 !important;
}

.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn-danger {
    background: #f44336 !important;
    border-radius: 6px;
    color: #FFF !important;
    text-transform: none;
    font-weight: 500;
    font-size: 12px;
}

.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn-danger:hover {
    background: #e53935 !important;
}

.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn-success .v-icon,
.shipment-detail-dialog .v-card .v-card-actions .v-btn.detail-action-btn-danger .v-icon {
    color: #FFF !important;
}

.shipment-detail-dialog .v-card {
    width: 100%;
    max-width: 480px;
    margin: auto;
}


.shipment-detail-dialog .shipment-address-field-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 4px;
}

.shipment-detail-dialog .shipment-address-field-label>.shipment-address-component-label-wrapper {
    font-weight: bold;
    font-size: 12.5pt;
}

.shipment-detail-dialog .shipment-address-field-label>div.shipment-address-component-label-country-flag-wrapper {
    display: flex;
    align-items: center;
}

.shipment-detail-dialog .shipment-address-field-label>div.shipment-address-component-label-country-flag-wrapper>div.flag-component {
    margin-left: 4px;
}

.shipment-detail-dialog .shipment-address-field-info>div.address-item-line.prov,
.shipment-detail-dialog .shipment-address-field-info>div.address-item-line.city,
.shipment-detail-dialog .shipment-address-field-info>div.address-item-line.cap {
    display: inline-flex;
    width: auto !important;
}

.shipment-detail-dialog .shipment-address-contact-info,
.shipment-detail-dialog .shipment-address-field-info {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.shipment-detail-dialog .shipment-address-contact-info {
    margin-top: 8px;
    flex-direction: column;
    gap: 2px;
}

.shipment-detail-dialog .shipment-address-field-info>div {
    width: 100%;
}

/* Name + airport on the same flex row */
.shipment-detail-dialog .shipment-address-field-info>div.name {
    flex: 1 1 auto;
    min-width: 0;
}

.shipment-detail-dialog .shipment-address-field-info>div.airport {
    flex: 0 0 auto;
    text-align: right;
}

/* Airport pill style */
.shipment-detail-dialog .shipment-address-field-info>div.airport .address-field-display {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    background: rgba(48, 83, 163, 0.1);
    border-radius: 12px;
    padding: 1px 8px;
    font-size: 0.85em;
    font-weight: 600;
    color: rgb(48, 83, 163);
}

.shipment-detail-dialog .shipment-address-field-info>div.airport .address-field-display .address-label i {
    font-size: 16px;
    color: rgb(48, 83, 163);
}

.shipment-detail-dialog .shipment-address-field-info .address-item-line div.address-field-display>span.address-label {
    margin-right: 4px;
}

.shipment-detail-dialog .shipment-item .shipment-address-component {
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.shipment-detail-dialog .shipment-item .shipment-address-component>div.shipment-address-field-info>div.address-item-line {
    display: inline-block !important;
}

.shipment-detail-dialog .shipment-item .shipment-address-component>div.shipment-address-field-info>div.address-item-line.name {
    font-weight: bold;
}

/* Contact info: flex alignment for icon + text */
.shipment-detail-dialog .shipment-address-contact-info>div.address-item-line>div.address-field-display {
    display: flex;
    align-items: center;
    gap: 4px;
}

.shipment-detail-dialog .shipment-item .shipment-address-component>div.shipment-address-contact-info>div>div>span>i {
    margin-right: 4px;
    font-size: 16px;
    opacity: 0.7;
}

.shipment-detail-card.v-card {
    background: rgb(48, 83, 163);
    padding: 4px !important;
    max-height: 90vh;
    display: flex !important;
    flex-direction: column;
}

.shipment-detail-card.v-card>.v-card-item {
    display: inline-block;
    flex: 0 0 auto;
}

.shipment-detail-card.v-card>.v-card-item * {
    color: #FFF;
}


.shipment-detail-card.v-card>div.v-card-text {
    background: #FFF;
    padding: 12px !important;
    flex: 1 1 auto;
    overflow-y: auto;
    min-height: 0;
}

.shipment-detail-dialog .shipment-tracking-information-wrapper i,
.shipment-detail-dialog .shipment-tracking-information-wrapper {
    color: #FFF !important;
}

.shipment-detail-dialog .shipment-detail-card>.v-card-item {
    display: inline-block !important;
    padding: 0px 4px 0px 4px !important;
}

.shipment-detail-dialog .shipment-detail-card>.v-card-item .v-card-title>div:nth-child(1) {
    float: left;
}

.shipment-detail-dialog .shipment-detail-card>.v-card-item .v-card-title>div:nth-child(2) {
    float: right;
}

.shipment-detail-dialog .shipment-price-info-wrapper {
    text-align: right;
}

.shipment-detail-dialog.shipment-package-list-component .v-card.shipment-detail-card .packages-detail-list-item-wrapper.v-card {
    max-width: 100%;
    width: 100%;
    margin: 0 0 10px 0;
}

.shipment-detail-dialog.shipment-package-list-component>div.v-overlay__content>div.v-card.shipment-detail-card>div.v-card-text {
    background: #f5f7fa;
}

.shipment-detail-dialog.shipment-package-list-component .packages-detail-list-item-wrapper.v-card {
    border: 1px solid rgba(48, 83, 163, 0.12);
    border-radius: 10px !important;
    margin-bottom: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

.shipment-detail-dialog.shipment-package-list-component .v-list-item .v-list-item__prepend .v-icon {
    color: rgb(48, 83, 163) !important;
}

.shipment-detail-dialog.shipment-package-list-component .packages-detail-list-item-wrapper .v-icon {
    color: rgb(48, 83, 163) !important;
}

.shipment-detail-dialog.shipment-package-list-component .packages-detail-list-item-wrapper .v-icon.text-success {
    color: rgb(var(--v-theme-success)) !important;
}

.shipment-detail-dialog.shipment-package-list-component .packages-detail-list-item-wrapper .v-icon.text-error {
    color: rgb(var(--v-theme-error)) !important;
}

.shipment-detail-dialog.shipment-package-list-component .packages-detail-list-item-wrapper .v-list-item-title,
.shipment-detail-dialog.shipment-package-list-component .packages-detail-list-item-wrapper .v-list-item-subtitle,
.shipment-detail-dialog.shipment-package-list-component .packages-detail-list-item-wrapper .text-body-2,
.shipment-detail-dialog.shipment-package-list-component .packages-detail-list-item-wrapper .text-subtitle-1 {
    color: rgba(0,0,0,0.87) !important;
}

.metric-volume-and-weight>div.v-list-item__content {
    display: inline-flex;
    width: 100% !important;
}

.metric-volume-and-weight>div.v-list-item__content>div {
    width: 50% !important;
}

.shipment-detail-dialog .inner-body-content {
    max-height: none;
    overflow-y: visible;
}

/* Scrollbar delgada cross-browser */
.shipment-detail-dialog .v-card-text,
.shipment-detail-dialog .packages-detail-list-wrapper {
    scrollbar-width: thin;
    scrollbar-color: rgba(48, 83, 163, 0.3) transparent;
}

.shipment-detail-dialog .v-card-text::-webkit-scrollbar,
.shipment-detail-dialog .packages-detail-list-wrapper::-webkit-scrollbar {
    width: 6px;
}

.shipment-detail-dialog .v-card-text::-webkit-scrollbar-thumb,
.shipment-detail-dialog .packages-detail-list-wrapper::-webkit-scrollbar-thumb {
    background: rgba(48, 83, 163, 0.3);
    border-radius: 3px;
}

.shipment-detail-dialog .v-card-text::-webkit-scrollbar-track,
.shipment-detail-dialog .packages-detail-list-wrapper::-webkit-scrollbar-track {
    background: transparent;
}

/********.shipment-detail-dialog end*/

.shipment-list-wrapper>div.v-infinite-scroll>div.item>div.v-card>.v-card-actions>.v-btn {
    margin: 0px;
    margin: auto;
}

.shipment-list-component .shipment-list-header-filter-wrapper {
    margin-bottom: 8px;
    display: block;
}

.shipment-list-component .v-card.shipment-list-item-card .shipment-btn-control-wrapper .btn-wrapper {
    margin: 0px;
    padding: 0px;
    height: auto;
    min-width: 70px;
    max-width: 100px;
    float: right;
    margin: 0px 2px 0px 2px;
    cursor: pointer;
}

.shipment-list-component .v-card.shipment-list-item-card .shipment-btn-control-wrapper .btn-wrapper:hover {
    background-color: rgba(0, 0, 0, 0.04);
    border-radius: 4px;
}

.shipment-list-component .v-card.shipment-list-item-card .shipment-btn-control-wrapper .btn-wrapper.v-btn--disabled {
    opacity: 0.4;
    cursor: default;
}

/* Cargo list — even/odd row alternation */
.cargo-list-component div.item.even {
    background-color: #ffffff;
}

.cargo-list-component div.item.odd {
    background-color: #f8f9fc;
}

/* Cargo list — is-offer left border accent */
.cargo-list-component div.item.is-offer {
    border-left: 3px solid #c6007e;
    padding-left: 5px;
}

.cargo-list-component div.item.is-offer .v-card.cargo-item {
    background-color: rgba(198, 0, 126, 0.03);
}

/* Cargo card — 3-row layout */
.cargo-list-component .cargo-item .v-card-text {
    padding: 6px 8px !important;
}

.cargo-list-component .cargo-item .item-wrapper {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cargo-list-component .cargo-item .cargo-row {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 24px;
}

/* Row 1 — Primary (identity + price) */
.cargo-list-component .cargo-row--primary {
    justify-content: space-between;
    gap: 6px;
}

.cargo-list-component .cargo-row--primary .cargo-primary-identity {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.cargo-list-component .cargo-row--primary .cargo-receiver-name {
    font-size: 14px;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.87);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 1;
}

.cargo-list-component .cargo-row--primary .cargo-shipment-id {
    font-size: 12px;
    font-weight: 700;
    color: #1565C0;
    white-space: nowrap;
    flex-shrink: 0;
    font-family: monospace;
    margin-right: 4px;
}

.cargo-list-component .cargo-row--primary .cargo-awb-number {
    font-size: 11px;
    font-weight: 500;
    color: rgba(48, 83, 163, 0.8);
    background: rgba(48, 83, 163, 0.08);
    border-radius: 4px;
    padding: 1px 5px;
    white-space: nowrap;
    flex-shrink: 0;
    font-family: monospace;
}

.cargo-list-component .cargo-row--primary .cargo-primary-price {
    display: flex;
    align-items: baseline;
    gap: 2px;
    flex-shrink: 0;
    margin-left: auto;
}

.cargo-list-component .cargo-row--primary .cargo-price-value {
    font-size: 15px;
    font-weight: 700;
    color: #c6007e;
}

.cargo-list-component .cargo-row--primary .cargo-price-currency {
    font-size: 11px;
    font-weight: 500;
    color: #c6007e;
    opacity: 0.8;
}

/* Row 2 — Secondary (route + meta + status badge) */
.cargo-list-component .cargo-row--secondary {
    justify-content: space-between;
    gap: 4px;
}

.cargo-list-component .cargo-row--secondary .cargo-secondary-left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 3px;
    flex: 1 1 auto;
    min-width: 0;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.6);
    overflow: hidden;
}

.cargo-list-component .cargo-route {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 13px;
    font-weight: 600;
    color: rgb(48, 83, 163);
    white-space: nowrap;
}

.cargo-list-component .cargo-route .cargo-route-arrow {
    opacity: 0.6;
}

.cargo-list-component .cargo-sep {
    color: rgba(0, 0, 0, 0.3);
    font-size: 12px;
    padding: 0 1px;
}

.cargo-list-component .cargo-date,
.cargo-list-component .cargo-weight,
.cargo-list-component .cargo-airline {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.6);
    white-space: nowrap;
}

.cargo-list-component .cargo-airline {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cargo-list-component .cargo-row--secondary .cargo-secondary-right {
    flex-shrink: 0;
}

.cargo-list-component .cargo-status-chip {
    font-size: 10px !important;
    font-weight: 600 !important;
    height: 20px !important;
    letter-spacing: 0.02em;
}

.cargo-list-component .cargo-status-chip .v-chip__content {
    padding: 0 5px !important;
}

/* Row 3 — Actions */
.cargo-list-component .cargo-row--actions {
    justify-content: flex-start;
    gap: 2px;
    padding-top: 2px;
}

.cargo-list-component .cargo-row--actions .btn-wrapper,
.cargo-list-component .cargo-row--actions .cargo-action-btn {
    min-width: 52px !important;
    max-width: 64px !important;
    height: 26px !important;
    font-size: 11px !important;
    padding: 0 6px !important;
    margin: 0 !important;
    opacity: 0.75;
    transition: opacity 0.15s ease;
}

.cargo-list-component .cargo-row--actions .btn-wrapper:hover,
.cargo-list-component .cargo-row--actions .cargo-action-btn:hover {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.04);
    border-radius: 4px;
}

.cargo-list-component .cargo-row--actions .btn-wrapper.v-btn--disabled {
    opacity: 0.3 !important;
    cursor: default;
}

/* Realtime filter chips (shared by cargo and express) */
.shipment-list-component .realtime-filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    width: auto;
    margin: 0 auto;
    padding: 0 8px;
}

.shipment-list-component .realtime-filter-chip {
    cursor: pointer;
    transition: box-shadow 0.15s ease, transform 0.1s ease;
    user-select: none;
}

.shipment-list-component .realtime-filter-chip:hover {
    transform: translateY(-1px);
}

.shipment-list-component .realtime-filter-chip.active {
    box-shadow: 0 2px 6px rgba(198, 0, 126, 0.35) !important;
}

/* Tablet breakpoint for cargo list */
@media (max-width: 768px) {
    .cargo-list-component .cargo-row--primary .cargo-awb-number {
        display: none;
    }

    .cargo-list-component .cargo-airline {
        display: none;
    }
}

/* Mobile cargo card adjustments */
@media (max-width: 480px) {
    .cargo-list-component .cargo-row--primary {
        flex-wrap: wrap;
    }

    .cargo-list-component .cargo-row--secondary .cargo-secondary-left {
        font-size: 11px;
    }

    .cargo-list-component .cargo-status-chip {
        font-size: 9px !important;
    }
}

/*.shipment-list-component end*/

/* Tracking component dialog */
.tracking-component-wrapper .v-timeline {
    padding-top: 8px;
}

.tracking-component-wrapper .tracking-event-item {
    padding: 4px 0;
}

.tracking-component-wrapper .tracking-event-description {
    font-size: 14px;
    line-height: 1.4;
}

.tracking-component-wrapper .tracking-event-date {
    font-size: 12px;
    margin-top: 2px;
}

/* Dialog de tracking: el card se monta en un overlay (fuera del wrapper),
   por eso se targetea por clase propia. Limita la altura al viewport y deja
   que SOLO el cuerpo (timeline) haga scroll; toolbar y acciones quedan fijos.
   Sin esto, una timeline larga (envíos "Delivered" con muchos eventos) crece
   más allá de la pantalla y no se puede ver el final ni el botón Close. */
.tracking-dialog-card {
    max-height: 90vh;
}

.tracking-dialog-card .tracking-dialog-body {
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0; /* permite que el hijo flex encoja y active el scroll */
}

/*.tracking-component end*/


.v-row.flight-list-infinite-scroll-row div.v-col div.v-row,
.v-row.flight-list-infinite-scroll-row,
.v-row.flight-detail,
.v-row.control-filters,
.v-row.flight-list-infinite-scroll-row .v-col,
.v-row.flight-detail .v-col,
.v-row.control-filters .v-col {
    margin: 0px !important;
    padding: 0px !important;
}

.v-row.flight-list-infinite-scroll-row {
    margin-top: 0px !important;
}

.v-row.flight-detail .v-col {
    min-height: 90px !important;
    max-height: 90px !important;
    height: 90px !important;
}

/* Control filters compactos */
.v-row.control-filters .v-col {
    min-height: auto !important;
    max-height: none !important;
    height: auto !important;
}

.realtime-flight-item .v-row .v-col,
.realtime-flight-item .v-row {
    margin: 0px !important;
}

.realtime-flight-item .v-row .v-col {
    display: flex;
    position: relative !important;
}

.realtime-flight-item .v-row {
    margin-bottom: 2px !important;
}

.arrival-wrapper>div,
.departure-wrapper>div {
    width: 100% !important;
}

.trip-info-airplane-icon .trip-info-icon {
    rotate: 45deg;
}

.trip-info-priority,
.priority-wrapper {
    width: 39px !important;
    min-width: 39px !important;
    text-align: center !important;
}

.features .features-icon,
.trip-info-priority .trip-info-icon {
    padding-top: 3px !important;
}

.trip-info-priority .trip-info-icon {
    color: red !important;
}

.published-reate-item.item {
    padding: 2px 0px 2px 0px !important;
    border-bottom: 0.25px solid rgb(35, 44, 111, 0.2) !important;
}

.realtime-flight-item .airline-flights-group {
    padding: 12px 0px 12px 0px !important;
    border-bottom: 0.25px solid rgb(35, 44, 111, 0.2) !important;
}

.airline-flights-group {
    padding: 0px !important;
}

.transit-time {
    color: #000 !important;
}

.airline-flights-group .v-col .flight-price span,
.airline-flights-group .v-col .flight-price {
    font-size: 14px !important;
    font-weight: 450 !important;
    color: #232c6f !important;
}

.realtime-flight-item .airline-flights-group .v-row {
    margin: 0px !important;
}

.realtime-flight-list-infinite-scroll .v-list-item {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.flight-price-wrapper {
    padding-top: 2px !important;
    width: auto !important;
}

.departure-date,
.arrival-date,
.transit-time {
    color: #232c6f !important;
    font-weight: normal !important;
}

/* ---- Un solo camino: la fila abre el detalle ----
   Click en el item -> popup de detalle -> boton verde "Seleccionar". Igual en
   published, realtime y Top 3, asi el usuario nunca duda de donde pulsar y
   siempre confirma antes de avanzar. El precio es solo informacion. */
.flight-row-clickable {
    cursor: pointer;
    transition: background-color 0.12s ease;
}

.flight-row-clickable:hover {
    background-color: rgba(48, 83, 163, 0.04);
}

.flight-row-clickable:focus-visible {
    outline: 2px solid #3053a3;
    outline-offset: -2px;
}

/* Precio destacado como dato, no como control. El !important contrarresta
   `.airline-flights-group .v-col .flight-price` (14px/450) en la vista realtime. */
.published-reate-item .flight-price .flight-price-text,
.realtime-flight-item .flight-price .flight-price-text,
.airline-flights-group .v-col .flight-price .flight-price-text {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #232c6f !important;
    white-space: nowrap;
}

.advanced-published-list-flight-component .v-list-item {
    transition: transform 0.1s linear, opacity 0.1s linear;
    transform-origin: right center;
    /* Parte da destra, la piega inizia dal lato destro */
}

.confirmation-wrapper,
.flight-list-wrapper {
    max-width: 380px !important;
    margin: auto !important;
    margin-top: 0px !important;
}

.confirmation-wrapper .service-wrapper,
.confirmation-wrapper .total-wrapper {
    padding: 4px 16px 4px 16px !important;
    display: flex;
    width: 100%;
}

.confirmation-wrapper .total-wrapper {
    margin-top: 12px !important;
}

.confirmation-wrapper .service-wrapper>div,
.confirmation-wrapper .total-wrapper>div {
    width: 50%;
}

.confirmation-wrapper .service-wrapper>div.service-value-wrapper,
.confirmation-wrapper .total-wrapper>div.total-value-wrapper {
    text-align: right;
}

.confirmation-wrapper .total-wrapper>div.total-value-wrapper>span {
    font-weight: 550 !important;
}

.confirmation-wrapper .delivery-date-wrapper {
    padding: 4px 16px !important;
    display: flex;
    width: 100%;
}

.confirmation-wrapper .delivery-date-wrapper>div {
    width: 50%;
}

.confirmation-wrapper .delivery-date-wrapper>div.delivery-date-value-wrapper {
    text-align: right;
}

.confirmation-wrapper .total-pending-wrapper {
    width: 100%;
    text-align: center;
    padding: 4px 0px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.confirmation-wrapper .total-pending-wrapper .total-pending-text {
    font-size: 12px;
    color: rgb(48, 83, 163);
    font-style: italic;
}

/* Aviso de precio no definitivo cuando el usuario pidio cotizar
   primera/ultima milla (tramos to_be_quoted del ERP). */
.confirmation-wrapper .total-mile-quote-note {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 8px;
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.4;
    color: rgb(140, 90, 10);
    background: rgba(240, 180, 60, 0.12);
    border-radius: 6px;
    text-align: center;
}

/* Confirmacion de que se solicito la cotizacion de un tramo. */
.pkp-dst-quote-requested {
    font-size: 13px;
    color: rgb(31, 111, 67);
}

/* Botón "Select terminal XXX" del InfoWindow del mapa de aeropuertos
   (js_form/map.js crea un <button type="button">, antes era <a href="#">
   que hacía scroll al inicio y cambiaba el hash al pulsar).
   Vive dentro del overlay de Google Maps (.gm-style), por eso se estila
   con alta especificidad. Sin esto el link hereda un color casi invisible
   contra el fondo. En hover: negrita + azul oscuro. */
.gm-style .tmwe-select-terminal-link,
a.tmwe-select-terminal-link,
button.tmwe-select-terminal-link {
    display: inline-block;
    background: none;
    border: 0;
    font: inherit;
    font-size: 14px;
    line-height: 1.4;
    color: #0b3d91;                 /* azul oscuro legible */
    font-weight: 600;
    text-decoration: none;
    padding: 2px 4px;
    cursor: pointer;
    transition: color 0.15s ease, font-weight 0.15s ease;
}
.gm-style .tmwe-select-terminal-link:hover,
.gm-style .tmwe-select-terminal-link:focus,
a.tmwe-select-terminal-link:hover,
a.tmwe-select-terminal-link:focus,
button.tmwe-select-terminal-link:hover,
button.tmwe-select-terminal-link:focus-visible {
    color: #06255c;                 /* azul aun mas oscuro en hover */
    font-weight: 700;               /* negrita */
    text-decoration: underline;
    outline: none;
}

/* Diálogo fullscreen del mapa de aeropuertos (map_component.js). El mapa
   de Google necesita un contenedor con altura explícita: la card ocupa el
   alto del diálogo y el contenedor del mapa toma el resto tras toolbar,
   barra de progreso y leyenda. */
.airport-map-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 100vh;
}
.airport-map-card .map_container {
    flex: 1 1 auto;
    min-height: 50vh;
    padding: 0;
}
.airport-map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    padding: 8px 16px;
    font-size: 12px;
    color: #37474f;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}
.airport-map-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}
.airport-map-legend-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid transparent;
    box-sizing: border-box;
}
.airport-map-trigger {
    cursor: pointer;
}

.flight-item-middle-info,
.flight-item-middle-info>div.v-row.flight-item-info,
.flight-item-info div {
    width: 100% !important;
}

.flight-item-middle-info {
    /*! padding: 7px 0px 0px 8px !important; */
}

.flight-item-middle-info>div.flight-item-info {
    min-height: 17px !important;
}

.flight-item-middle-info>div.v-row>div.v-col {
    padding: 0px !important;
    min-height: 21px !important;
}

.flight-item-middle-info>div.v-row:first-child>div.v-col {
    min-height: 28px !important;
}

.flight-item-middle-info>div.v-row:last-child>div.v-col {
    padding-bottom: 0px !important;
}

.v-row.flight-item-info-wrapper .v-col div {
    width: 100%;
}

.v-row.flight-item-info-wrapper>div.v-col:first-child {
    padding-right: 0px !important;
}

.date-time-wrapper .icon-image img {
    height: 18px !important;
}

.day-component {
    background: #FFF !important;
    text-align: center !important;
    border-radius: 4px;
    padding: 0px;
    color: #232c6f !important;
}

.day-component .date-top-wrapper {
    background: #FFF !important;
    padding: 0px !important;
}

.day-component .date-top-wrapper>div.date-day-wrapper {
    font-size: 16px !important;
}

.day-component .date-bottom-wrapper>div.date-month-wrapper>span {}

.day-component .date-bottom-wrapper>div.date-month-wrapper>.date-month {
    font-size: 12px !important;
    padding: 0px 0px 0px 0px !important;
    width: 30px;
    display: inline-block;
    background: #68a0f0;
    border-radius: 0px 0px 4px 0px;
    color: #232c6f !important;
    text-align: center;
}

.day-component .date-bottom-wrapper>div.date-month-wrapper>.date-day {
    color: #FFF !important;
    font-weight: 500 !important;
    padding: 0px 0px 0px 0px !important;
    background: transparent;
    width: 28px !important;
    display: inline-block;
    font-size: 19px !important;
    text-align: center;
}

.date-bottom-wrapper {
    background: #68a0f0 !important;
    border-radius: 0px 0px 4px 4px !important;
    padding-top: 2px !important;
}

.day-component .date-top-wrapper>div.date-day-wrapper>.date-month {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #232c6f !important;
}

.flight-item-middle-info-middle-top-wrapper,
.flight-item-middle-info-bottom-wrapper {
    display: flex;
}

.flight-item-middle-info-bottom-wrapper {
    margin-left: 5px !important;
    padding-top: 2px !important;
}


.flight-detail-info-wrapper {
    padding: 0px 0px 2px 0px !important;
    margin-left: 5px !important;
    border-bottom: 1px solid #e1e1e1 !important;
}

.airline-name-wrapper .airline-name {
    font-size: 15px !important;
    color: #232c6f !important;
}

.airline-name-wrapper {
    margin-top: 3.5px !important;
}

.flight-detail-info-wrapper>div,
.flight-detail-info-wrapper>div>span {
    line-height: 16px !important;
    font-size: 14px !important;
    height: 16px !important;
    max-height: 16px !important;
    padding: 0px 0px 0px 0px !important;
}

.flight-item-middle-info-middle-top-wrapper {
    padding: 0px 0px 0px 0px !important;
}

.flight-item-middle-info-middle-top-wrapper>div.v-avatar {
    margin-top: 0px !important;
}

.flight-item-middle-info-middle-top-wrapper>div {
    width: 100% !important;
    display: inline-block !important;
}

body *,
body {
    line-height: 20px !important;
}

.routing-wrapper {
    padding: 0px 0px 0px 0px !important;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.routing-wrapper:hover {
    opacity: 0.7;
}

.routing-wrapper .routing-info-icon {
    color: inherit;
    opacity: 0.7;
}

.routing-wrapper:hover .routing-info-icon {
    opacity: 1;
}

.date-time {
    font-size: 14px !important;
    color: #232c6f !important;
}

.date-top-wrapper .icon-image-wrapper {
    max-height: 18px !important;
}

.icon-image-wrapper {
    min-width: 20px !important;
    padding: 2px !important;
}

.package-list-container {
    padding-top: 18px !important;
    max-width: 320px !important;
    margin: auto !important;
}

.advanced-published-list-flight-component .v-infinite-scroll .v-list-item {
    padding: 4px 0px 4px 0px !important;
}

.advanced-published-list-flight-component .v-infinite-scroll .v-list-item .airline-logo-and-name>label.airline-name {
    font-weight: normal !important;
    font-size: 12px !important;
}

.day-time-light img {
    filter: invert(59%) sepia(57%) saturate(773%) hue-rotate(188deg) brightness(95%) contrast(98%);
}

.day-time-dark img {
    filter: invert(15%) sepia(36%) saturate(2965%) hue-rotate(215deg) brightness(96%) contrast(95%);
}

.arrival-col.v-col>div.arrival-wrapper,
.departure-col.v-col>div.departure-wrapper {
    padding: 0px 6px 0px 0px !important;
}

.flight-item-right-info.arrival-wrapper,
.flight-item-left-info.departure-wrapper {
    max-width: 60px !important;
}

.published-reate-item .flight-item-left-info {
    display: flex !important;
}

.published-reate-item div.flight-item-info-upper div.airline-name-wrapper {
    padding: 0px !important;
}

.published-reate-item div.flight-item-middle-info {
    padding: 0px 6px 0px 6px;
}

.departure-col {
    margin: 0px 0px 0px 0px !important;
    width: 62px !important;
    min-width: 62px !important;
    padding-right: 4px !important;
}

.arrival-col {
    margin: 0px 0px 0px 0px !important;
    width: 62px !important;
    min-width: 62px !important;
    max-width: 62px !important;
    padding-right: 4px !important;
}


.duration-wrapper {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    margin-top: 8px !important;
}

.flight-icons>div {
    display: block !important;
}

.flight-icons {
    text-align: center !important;
    display: flex !important;
    width: 100% !important;
    margin-left: 0px !important;
}

span.routing-stops {
    margin-left: 4px !important;
}

.flight-icons>div {
    width: auto !important;
}

.flight-icons>div i {
    font-size: 17.5px !important;
}

.flight-list-header {
    margin: 0px !important;
    display: flex !important;
    padding: 0px !important;
    font-size: 14px !important;
}

.flight-list-header .header-cell {
    padding: 0px;
    margin: 0px;
    text-align: center !important;
}

.flight-list-header .header-cell:hover {
    cursor: pointer !important;
}

.flight-list-header .header-cell.arrival {
    width: 60px !important;
    max-width: 60px !important;
    min-width: 60px !important;
}

.flight-list-header .header-cell.departure {
    width: 60px !important;
    max-width: 60px !important;
    min-width: 60px !important;
}

.flight-list-header .header-cell.airline {
    margin-left: 0px;
    min-width: 100px !important;
    max-width: 100px !important;
    width: 100px !important;
}

.flight-list-header .header-cell.faster {
    width: 69px !important;
    max-width: 69px !important;
    min-width: 69px !important;
}

.flight-list-header .header-cell.price {
    text-align: right;
    width: 60px !important;
    max-width: 60px !important;
    min-width: 60px !important;
}

.flight-list-header .flight-list-header-cell.active {}

.v-row.flight-list-header-row {
    margin: 0px auto 8px auto !important;
    border-bottom: 0.25px solid rgba(35, 44, 111, 0.2) !important;
    width: 340px !important;
}

.v-row.flight-list-header-row>div.v-col {
    padding: 2px 0px 6px 0px !important;

}

/* Filtros compactos - nueva version */
.realtime-filters-wrapper.compact {
    max-width: 380px;
    margin: 0 auto;
    padding: 0 4px;
}

.realtime-filters-wrapper.compact .realtime-filters-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 0;
}

.realtime-filters-wrapper.compact .quick-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    flex: 1;
}

.realtime-filters-wrapper.compact .quick-filter-chip {
    font-size: 0.75em !important;
    height: 26px !important;
    cursor: pointer;
}

.realtime-filters-wrapper.compact .quick-filter-chip .v-icon {
    font-size: 14px !important;
}

.realtime-filters-wrapper.compact .advanced-filter-btn {
    flex-shrink: 0;
    height: 26px !important;
    font-size: 0.75em !important;
    text-transform: none;
    letter-spacing: normal;
}

.realtime-filters-wrapper.compact .realtime-filters-selected-wrapper {
    padding: 4px 0 !important;
}

.realtime-filters-wrapper.compact .realtime-filters-selected {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.realtime-filters-wrapper.compact .active-filter-chip {
    font-size: 0.7em !important;
    height: 22px !important;
}

/* Estilo legacy para compatibilidad */
.realtime-filters-wrapper:not(.compact) {
    display: block;
    max-width: 300px;
    margin: 0 auto;
}

.realtime-filters {
    display: flex;
    text-align: center;
}

.filter-icon-wrapper {
    width: 60px;
    padding: 0px 0px 0px 0px;
    margin: auto;
    text-align: center !important;
}

.filter-icon-wrapper i {
    font-size: 30px !important;
    padding: 0px 15px 0px 15px !important;
}

.filter-icon-wrapper i.inactive {
    color: rgb(48, 83, 163) !important;
}

.filter-icon-wrapper i.active {
    color: #c6007e !important;
}

.filter-icon-wrapper:hover {
    cursor: pointer !important;
}

.filter-icon-wrapper>span.icon-label {
    text-align: center;
    width: 100% !important;
    min-width: 100% !important;
    display: block;
    font-size: 12px !important;
}

.v-chip button {
    padding: 0px !important;
    border: none !important;
    background: transparent;
    box-shadow: none !important;
}

/*
.advanced-published-flight-filter-wrapper .airline-filter.v-autocomplete>div.v-input__control>.v-field>.v-field__field{
    padding-top: 10px !important;
}
*/
.v-autocomplete__selection .v-chip button {
    margin: 0px !important;
}

/*
.advanced-published-flight-filter-wrapper .v-autocomplete input{
    padding: 0px !important;
}
*/
.realtime-filters-selected>.v-chip {
    margin: 0px !important;
    padding: 4px 4px 4px 8px !important;
    height: 29px !important;
}

.realtime-filters-selected-wrapper {
    padding-top: 7px !important;
    padding-bottom: 1px !important;
}

.flight-item-tail {
    width: 41px !important;
    margin-top: 2px !important;
    min-width: 41px !important;
}

.virtual-scroll-container {
    overflow-y: auto;
    height: 300px;
}

.published-reate-item,
.realtime-flight-item {
    overflow: hidden !important;
    background: #FFF !important;
}

.realtime-flight-item {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.under-top-list-item {
    display: none !important;
}

.published-rates-flight-list-infinite-scroll .v-virtual-scroll__item {
    background: #fff;
    perspective: 800px;
    padding-top: 0px !important;
}

.realtime-flight-list-infinite-scrol .v-virtual-scroll__item {
    height: 87px !important;
    min-height: 87px !important;
}

.list-filtered-total {
    color: #FFF !important;
}

.list-filtered-total .list-filtered-number {
    font-weight: 450 !important;
    font-size: 13px !important;
}

.list-filtered-total .list-filtered-total-divider,
.list-filtered-total .list-total-number {
    font-weight: 400 !important;
    font-size: 11px !important;
}

.flight-list-header-cell.active {
    color: #c6007e !important;
    font-weight: 500 !important;
}

.principal-airport-component:hover {
    cursor: pointer;
}

.principal-airport-component {
    margin: 0px auto 0px auto !important;
    width: 50px !important;
    float: left !important;
    text-align: center !important;
    color: #1583ca !important;
}

.principal-airports-component {
    margin: auto !important;
    margin-top: 12px !important;
    width: 248px !important;
    max-width: 248px !important;
    display: flex !important;
    padding: 0px !important;
}

.supplements-abstract {
    display: inline-block !important;
    text-align: center;
    width: 100% !important;
}

.supplements-abstract>span {
    display: inline-flex !important;
    padding: 0px 5px 0px 5px !important;
}

.supplements-abstract span i {
    margin-right: 2px !important;
}

.insurance-currency-value.v-row>div {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.v-row.insurance-currency-value .v-field__append-inner {
    padding: 0px !important;
}

.v-virtual-scroll.rubrica-list {
    overflow: unset !important;
}

.v-row.insurance-currency-value .v-input__control .v-field__field>.v-field__input,
.v-row.insurance-currency-value .v-field__field input,
.v-row.insurance-currency-value .v-field__input input {
    height: 20px !important;
    max-height: 20px !important;
    min-height: 20px !important;
    padding: 0px !important;
}

.shipment-insurance-wrapper {
    padding: 4px !important;
    min-height: 58px !important;
}

.confirmation-wrapper.confirmation-express-wrapper .shipment-insurance-wrapper {
    margin-top: 20px;
    margin-bottom: 20px;
}

.insurance-controls,
.insurance-currency-value {
    display: inline-flex !important;
}

.v-row.insurance-controls {
    margin: 0px !important;
}

.address-place-map-dialog .v-card .v-card-text {
    padding: 0px !important;
    position: relative !important;
    overflow: hidden;
    display: flex !important;
    flex-direction: column !important;
}

.address-map-container {
    padding: 0px !important;
    flex: 1 1 0;
    min-height: 0;
    height: 100% !important;
}

.address-place-map-dialog .v-card .v-card-text {
    padding: 0px !important;
}

.address-place-map-dialog .map-address-detail-footer-wrapper {
    width: 100% !important;
    min-width: 100% !important;
    display: block !important;
    padding: 0px 0px 20px 0px !important;
}

.address-place-map-dialog .map-address-detail-fields {}

/*Deprecated*/
.address-place-map-dialog .map-address-detail-fields {
    margin: auto !important;
    padding: 4px !important;
    max-width: 380px !important;
    min-width: 320px !important;
}

/*deprecated*/
.address-place-map-dialog .map-address-detail-action {
    margin: auto !important;
    padding: 2px !important;
    width: 260px !important;
    text-align: center !important;
}

.address-place-map-dialog .map-address-detail-action .v-btn {
    margin: 4px 8px 4px 8px !important;
}

.search-place-component .append-icon,
.search-place-component .prepend-icon {
    cursor: pointer !important;
}

.search-place-component .prepend-icon {
    margin: 0px 0px 0px 0px !important;
    padding: 0px 0px 0px 0px !important;
    min-width: 36px !important;
    min-height: 33px !important;
}

.search-place-component .append-icon {
    margin: 0px 0px 0px 0px !important;
    padding: 4px 4px 0px 6px !important;
    min-width: 36px !important;
    min-height: 33px !important;
}

.prepend-icon.active {
    color: rgb(198, 0, 126) !important;
}

.search-place-component .append-icon *,
.search-place-component .prepend-icon *,
.search-place-component .append-icon,
.search-place-component .prepend-icon {
    color: #FFF !important;
    height: 24px !important;
}

.search-place-component .v-field__clearable {
    padding-top: 4px !important;
    background: #FFF !important;
    margin: 0px !important;
}

.search-place-component input {
    height: 30px !important;
    max-height: 30px !important;
    border: none !important;
    padding: 6px !important;
    background-color: #FFF !important;
}

.search-place-component .v-field__field {
    background-color: #FFF !important;
}

.search-place-component>div>div>div {
    padding-top: 0px !important;
}

.search-place-component>div>div>div.v-field__field>div.v-field__input,
.search-place-component>div>div>div.v-field__field {
    padding-top: 0px !important;
}

.search-place-component .append-icon.inactive {
    background: #3053a3 !important;
    opacity: 1 !important;
}

.search-place-component .prepend-icon.inactive {
    background: #69a1f6 !important;
    opacity: 1 !important;
}

.search-place-component .active {
    color: rgba(198, 0, 126, 1) !important;
    background-color: #FFF !important;
}

/* Ícono libro en append cuando modo rubrica está activo */
.search-place-component .rubrica-mode-icon,
.search-place-component .rubrica-mode-icon i {
    color: rgba(198, 0, 126, 1) !important;
    background-color: #FFF !important;
}

.search-place-component>.v-input__control {
    border: 1px solid #FFF !important;
}

.search-place-component>div:first-child {
    background: #FFF !important;
    height: 35px !important;
}

/* Eliminar espacio extra del v-autocomplete para alineación con el selector */
.search-place-component .v-input__details {
    display: none !important;
}

.search-place-wrapper .search-place-component {
    height: 35px !important;
    max-height: 35px !important;
    --v-input-padding-top: 0px !important;
}

.progress-wrapper {
    margin: auto;
    width: 100% !important;
    text-align: center !important;
}

.progress-wrapper .progress-component {
    color: rgb(198, 0, 126) !important;
}

.store-rubrica-wrapper {
    display: block !important;
}

.bttom-navigation .bottom-right-wrapper,
.bttom-navigation .bottom-left-wrapper {
    padding-bottom: 120px !important;
}

.bttom-navigation .bottom-left-wrapper .v-btn span i,
.bttom-navigation .bottom-right-wrapper .v-btn span i {
    height: 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
}


.bttom-navigation .bottom-left-wrapper .v-btn,
.bttom-navigation .bottom-right-wrapper .v-btn {
    color: #FFF !important;
    height: 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
    min-height: 24px !important;
}

.bttom-navigation .v-avatar {
    padding: 0px !important;
    height: 33px !important;
    width: 33px !important;
}

.bttom-navigation .v-avatar span {
    font-size: 16px !important;
    font-weight: 600 !important;
    padding: 0px !important;
    margin: auto !important;
}

.bttom-navigation .bottom-right-wrapper .v-btn,
.bttom-navigation .bottom-left-wrapper .v-btn {
    height: 24px !important;
    width: 24px !important;
    min-height: 24px !important;
    margin-top: 6px !important;
    color: #FFF !important;
}


.map-address-detail-fields {
    display: inline !important;
}

.address-detail-fields>div.v-window>div>.v-tabs-window-item>div {
    width: 320px !important;
    min-width: 320px !important;
}

.address-detail-fields>div.v-window>div>.v-tabs-window-item>div.cap-input {
    max-width: 84px !important;
    width: 84px !important;
    min-width: 84px !important;
    float: left !important;
    padding-right: 8px !important;
}

.address-detail-fields>div.v-window>div>.v-tabs-window-item>div.city-input {
    max-width: 236px !important;
    width: 236px !important;
    min-width: 236px !important;
    padding-left: 8px !important;
    float: left !important;
}

.address-detail-fields>div.v-window>div>.v-tabs-window-item>div.city-input.city-full-width {
    max-width: 320px !important;
    width: 320px !important;
    min-width: 320px !important;
    padding-left: 0 !important;
    float: none !important;
}

/* Highlight fields that need user review (no match found in DB) */
.address-detail-fields .needs-review .v-field__outline {
    --v-field-border-opacity: 1 !important;
    color: #FF9800 !important;
}

.address-detail-fields .needs-review .v-field {
    background-color: rgba(255, 152, 0, 0.08) !important;
}

.address-detail-fields .needs-review input {
    color: #E65100 !important;
}

.address-detail-fields .needs-review .v-field__outline__start,
.address-detail-fields .needs-review .v-field__outline__end,
.address-detail-fields .needs-review .v-field__outline__notch::before,
.address-detail-fields .needs-review .v-field__outline__notch::after {
    border-color: #FF9800 !important;
}

/* Animation for attention */
@keyframes needs-review-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 152, 0, 0.4);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(255, 152, 0, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 152, 0, 0);
    }
}

.address-detail-fields .needs-review .v-field {
    animation: needs-review-pulse 2s ease-in-out 3;
}

.address-detail-fields div.v-autocomplete .v-field__append-inner,
.address-detail-fields div.v-autocomplete {
    padding: 0px !important;
}

.address-detail-fields div.v-autocomplete .v-field__input {
    padding: 0px !important;
    min-height: 24px !important;
    height: 20px !important;
    font-size: 14px !important;
}

.v-row.airport-selector-row .v-field__input {
    font-size: 14px !important;
}

.v-row.airport-selector-row>div:last-child,
.v-row.airport-selector-row>div:first-child {
    text-align: center;
}

.address-detail-fields>div.v-tabs {
    margin: 0px !important;
    padding: 0px !important;
    height: 26px !important;
}

.address-detail-fields>div.v-tabs .v-tab {
    margin: 0px !important;
    padding: 0px !important;
    height: 26px !important;
}

.address-detail-fields>div.v-tabs .v-tab:first-child {
    border-right: 1px solid rgb(98, 98, 98) !important;
}

.address-detail-fields>div.v-tabs .v-tab i {
    color: rgb(98, 98, 98) !important;
}

.address-detail-fields>div.v-tabs .v-tab .v-tab__slider {
    display: none !important;
}

.address-detail-fields>div.v-tabs .v-tab--selected i {
    color: rgb(198, 0, 126) !important;
}

.address-detail-fields .v-tabs-window {
    padding-top: 12px !important;
}

.address-detail-fields>div.v-tabs .v-tab * {
    border-radius: unset !important;
}

.address-component .store-rubrica-wrapper>div.v-input {
    height: 40px !important;
    max-height: 40px !important;
    min-height: 40px !important;
}

.address-component .v-row.store-row>div.v-col,
.address-component .v-row.address-from-row>div.v-col {
    padding: 6px 12px 6px 12px !important;
}

.address-component .v-selection-control__input,
.address-component .v-row.store-row .v-btn {
    margin: 0px 4px 0px 4px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
}

.address-component .v-row.store-row {
    margin: 0px !important;
}

.address-component .v-row.store-row>div.v-col.store-col {
    padding: 6px 0px 6px !important;
}

.address-component .v-row.store-row .v-col div div {
    float: left !important;
}

.address-component .v-row.store-row .v-col div .v-btn {
    float: right !important;
}

.address-component .v-row.store-row .v-btn {
    margin-top: 4px !important;
}

.address-detail-fields .v-tabs-window {
    padding-top: 6px !important;
}

.custom-address-detail-fields.address-detail-fields.solo-cap-city,
.customs-address-detail-fields.address-detail-fields.solo-cap-city {
    margin: auto !important;
    width: 205.33px !important;
}

.address-component .store-row {
    margin-top: 0px !important;
}

.v-row.address-from-row {
    margin-top: 0px !important;
}

.map-address-detail-wrapper {
    width: 100% !important;
    text-align: center !important;
    padding-top: 20px !important;
}

.map-address-detail-wrapper>div {
    margin: auto;
    max-width: 380px !important;
}

.map-address-detail-wrapper>div.map-address-detail-show-name {
    padding: 4px !important;
    font-weight: 550 !important;
}

.map-address-detail-wrapper>div.map-address-detail-footer-wrapper {
    position: absolute !important;
    bottom: 0px !important;
    width: 100% !important;
}

.shipment-supplement-abstract-wrapper {
    margin: auto !important;
    margin-top: 0px !important;
    width: 100% !important;
    max-width: 320px !important;
    max-width: 320px !important;
    padding-top: 0px !important;
    min-height: 46px !important;
    height: 46px !important;
}

.crm-messages-list-wrapper .v-list-item {
    width: 100% !important;

    min-width: 100%;
}

.crm-messages-list-wrapper .v-list-item>div {
    display: flex !important;
}

.crm-messages-list-wrapper .v-list-item>div.v-list-item__prepend,
.crm-messages-list-wrapper .v-list-item>div.v-list-item__append {
    margin-top: 6px;
}

.crm-messages-list-wrapper .v-list-item>div.v-list-item__content {
    display: flex;
}

.crm-messages-list-wrapper .v-list-item>div.v-list-item__content>div.v-card.mine {
    margin-left: auto;
    margin-right: 8px;
}

.crm-messages-list-wrapper .v-list-item>div.v-list-item__content>div.v-card {
    margin-right: autoauto;
    margin-left: 8px;
}

.crm-messages-list-wrapper .v-list-item>div.v-list-item__content .message-date {
    width: auto !important;
    text-align: right;
    font-size: 12px;
}

.v-btn.my-place .v-icon,
.v-btn.current-location .v-icon {
    font-size: 22px !important;
}

.v-btn.my-place,
.v-btn.current-location {
    margin: 0px !important;
    padding: 0px !important;
    height: 30px !important;
    width: 30px !important;
    max-width: 30px !important;
    min-width: 30px !important;
}

/* margin-top removed — vertical centering handled by flex container */

.preferred-active span i {
    color: rgb(198, 0, 126) !important;
}

.preferred-inactive span i {
    color: #d1d1d1 !important;
}

.search-on-rubrica-component input {
    min-height: 33px !important;
}

.rubrica-detailed-wrapper {
    margin-top: 12px !important;
}

.rubrica-container .rubrica-item {
    padding: 6px 2px 6px 2px !important;
}

.rubrica-container .rubrica-item .v-list-item__prepend {
    padding: 0px 4px 0px 0px !important;
}

.rubrica-container .rubrica-item .v-list-item__content {
    padding: 0px 8px 0px 8px !important;
    cursor: pointer !important;
}

.rubrica-container .v-virtual-scroll__item {
    border-bottom: 1px solid #e1e1e1;
}

.rubrica-container .text-caption {
    display: inline-flex !important;
    width: 100% !important;
    text-overflow: ellipsis;
    height: 20px !important;
}

.rubrica-container .text-caption>div.cap-and-city-wrapper {
    min-width: 60% !important;
    border-right: 1px solid #e1e1e1 !important;
}

.rubrica-container .text-caption>div.contact-name-wrapper {
    min-width: 40% !important;
}

.rubrica-container .text-caption>div>div {
    text-overflow: ellipsis;
    padding: 0px 4px 0px !important;
    width: 100% !important;
}

.progress-wrapper .v-progress-linear__indeterminate {
    background-color: rgb(198, 0, 126) !important;
}

/* Non-blocking progress bar - allows interaction with results below */
.progress-wrapper.progress-non-blocking {
    position: sticky;
    top: 0;
    z-index: 10;
    padding: 8px 0;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(4px);
}

.progress-wrapper.progress-non-blocking .v-progress-linear {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.progress-wrapper.progress-non-blocking .v-progress-linear__determinate {
    background: linear-gradient(90deg, rgb(198, 0, 126) 0%, rgb(140, 0, 90) 100%) !important;
    transition: width 0.3s ease-out;
}

.progress-wrapper.progress-non-blocking .v-progress-linear__indeterminate {
    background: linear-gradient(90deg, rgb(198, 0, 126) 0%, rgb(140, 0, 90) 100%) !important;
}

.progress-wrapper.progress-non-blocking .progress-text {
    font-size: 13px;
    font-weight: 500;
    color: #FFFFFF;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    letter-spacing: 0.3px;
}

.progress-wrapper.progress-non-blocking .progress-text strong {
    font-weight: 700;
    font-size: 14px;
}

.progress-wrapper.progress-non-blocking .progress-message {
    font-weight: 500;
}

/* Progress Animation Container - GIF animation before progress data arrives */
.progress-animation-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 16px 8px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 8px;
}

.progress-loading-animation {
    width: 100px;
    height: auto;
    max-width: 100%;
}

.progress-animation-message {
    margin-top: 12px;
    font-size: 13px;
    font-weight: 500;
    color: #555;
    text-align: center;
}

/* Mobile adjustments for progress animation */
@media (max-width: 600px) {
    .progress-animation-container {
        padding: 12px 8px;
    }

    .progress-loading-animation {
        width: 80px;
    }

    .progress-animation-message {
        font-size: 12px;
        margin-top: 8px;
    }
}

/* ==========================================================================
   UNIFIED PROGRESS BAR STYLES
   Brand color: rgb(198, 0, 126) - FindAir Pink/Magenta
   ========================================================================== */

/* Linear Progress Bars - Standard inline loading */
.findair-progress-linear {
    border-radius: 6px !important;
    overflow: hidden;
}

.findair-progress-linear .v-progress-linear__indeterminate,
.findair-progress-linear .v-progress-linear__determinate {
    background: linear-gradient(90deg, rgb(198, 0, 126) 0%, rgb(140, 0, 90) 100%) !important;
}

.findair-progress-linear .v-progress-linear__background {
    background-color: rgba(198, 0, 126, 0.15) !important;
}

/* Circular Progress Bars - For dialogs and centered loading */
.findair-progress-circular {
    color: rgb(198, 0, 126) !important;
}

.findair-progress-circular .v-progress-circular__overlay {
    stroke: rgb(198, 0, 126) !important;
}

/* Small inline circular progress (for autocomplete, search) */
.findair-progress-circular-sm {
    color: rgb(198, 0, 126) !important;
}

/* Loading container with centered progress and optional message */
.findair-loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    gap: 12px;
}

.findair-loading-container .loading-message {
    color: #666;
    font-size: 14px;
    font-weight: 500;
}

/* Image placeholder progress (keep subtle for images) */
.findair-progress-placeholder {
    color: rgba(198, 0, 126, 0.5) !important;
}

.place-select-btn-wrapper {
    width: 100% !important;
    text-align: right !important;
    padding: 6px 0px 6px 0px !important;
}

button.gm-ui-hover-effect span {
    margin: auto !important;
}

button.gm-ui-hover-effect {
    height: 30px !important;
    width: 30px !important;
    padding: 0px !important;
    border: 0px !important;
    margin: 8px 0px 0px 8px !important;
    text-align: center !important;
}

.place-select-btn-wrapper button {
    margin: 0px !important;
    font-size: 14px !important;
    padding: 6px 8px 6px 8px !important;
    font-weight: 500 !important;
}

.clear-address-btn {
    transform: rotateY(180deg);
}

.nav-bar-icon-btn.active span i {
    color: rgb(198, 0, 126) !important;
}

.close-map-btn-wrapper>.close-map-btn {
    margin: 0px !important;
    width: 100px !important;
}

.close-map-btn-wrapper {
    position: fixed;
    bottom: 0px !important;
    width: 40px !important;
    left: calc(50vw - 100px) !important;
    width: auto !important;
    margin: auto !important;
    padding: 6px !important;
}

.previous-next-btn.v-btn span i {
    color: #FFF !important;
}

.previous-next-btn.v-btn {
    color: #FFF !important;
    margin: 0px !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    background: rgb(198, 0, 126) !important;
    padding: 0px !important;
    border: none !important;
    box-shadow: unset !important;
}


.delivery-row,
.pickup-row,
.note-row {
    margin: 0px !important;
    align-items: center !important;
}

.delivery-row>.v-col,
.pickup-row>.v-col,
.note-row>.v-col {
    display: flex !important;
    align-items: center !important;
    padding: 0px 4px !important;
}

.delivery-row>.v-col:first-child,
.pickup-row>.v-col:first-child,
.note-row>.v-col:first-child {
    padding-left: 16px !important;
}

.delivery-row>.v-col:last-child,
.pickup-row>.v-col:last-child,
.note-row>.v-col:last-child {
    padding-right: 12px !important;
}

.note-container>div.v-row>div.v-col {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.delivery-row .active-btn,
.pickup-row .active-btn,
.note-row .active-btn {
    font-size: 24px !important;
    color: rgb(198, 0, 126) !important;
}

.delivery-row .v-col div.col-wrapper,
.pickup-row .v-col div.col-wrapper,
.note-row .v-col div.col-wrapper {
    width: 100% !important;
}

.note-wrapper,
.delivery-wrapper,
.pick-up-wrapper {
    padding-bottom: 4px !important;
}

.pickup-address-summary-wrapper,
.delivery-address-summary-wrapper {
    padding: 4px 16px;
}

.confirmation-address-summary {
    background: #f5f7fa;
    border-radius: 6px;
    padding: 6px 10px;
}

.confirmation-address-summary .address-summary-label {
    font-weight: 600;
    font-size: 0.85rem;
    color: #333;
}

.confirmation-address-summary .address-summary-icon {
    color: #1565C0;
}

.confirmation-address-summary .address-summary-details {
    padding-left: 28px;
    font-size: 0.8rem;
    color: #555;
    line-height: 1.5;
}

.confirmation-address-summary .address-summary-name {
    font-weight: 500;
    color: #333;
}

.confirmation-address-summary .address-summary-airport {
    color: #1565C0;
    font-weight: 500;
}

.confirmation-address-summary .address-summary-empty {
    padding-left: 28px;
    font-size: 0.8rem;
    color: #999;
    font-style: italic;
}

.note-text-filled {
    font-size: 13px;
    color: #333;
}

.note-container .col-wrapper .active-btn {
    font-size: 24px !important;
    color: rgb(198, 0, 126) !important;
}

.quote-request-container {
    padding: 10px !important;
    width: 100% !important;
}

.quote-request-container .v-btn {
    margin: 0px !important;
}

.request-btn-wrapper {
    margin: auto !important;
    width: 100px !important;
}

.contact-dialog-body {
    padding: 20px 24px 16px 24px !important;
}

.contact-dialog-body .v-row {
    margin: 0px !important;
}

.contact-dialog-body .v-col {
    padding: 4px 8px !important;
}

.contact-dialog-body .v-input--checkbox {
    margin-top: 0px !important;
}

.contact-dialog-submit-col {
    text-align: center;
    padding-top: 12px !important;
}

.contact-dialog-submit-btn {
    margin: 0px !important;
}

.request-btn-wrapper .v-btn {
    width: 100px !important;
    max-width: 100px !important;
    background: rgb(198, 0, 126);
    color: #FFF;
    transition-property: none !important;
}

.request-btn-wrapper .v-btn span.v-ripple__animation--in {
    display: none !important;
}

.note-wrapper .note-wrapper-tab-wrapper {
    max-height: 38px !important;
    min-height: 38px !important;
    height: 38px !important;
}

.note-wrapper textarea {
    padding: 0px 6px 0px 6px !important;
    mask-image: none !important;
}

.order-bar-wrapper {
    display: flex !important;
}

.order-bar-wrapper div.order-option-btn {
    padding: 0px;
    min-width: 25% !important;
    text-align: center !important;
    display: flex !important;
}

.order-bar-wrapper div.order-option-btn>div.order-option-btn-inner {
    margin: auto;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    display: flex !important;
}

.order-bar-wrapper div.order-option-btn.price>div.order-option-btn-inner {
    margin-right: 0px !important;
}

.hide {
    display: none !important;
}

.address-loading-hidden {
    visibility: hidden !important;
    pointer-events: none !important;
}

.no-result-found {
    margin: 12px;
}

.filter-info-wrapper>span {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    line-height: 18px !important;
    height: 18px !important;
    margin-top: -9px !important;
}

.published-flight-info {
    display: flex !important;
    padding: 0px !important;
}

.empty-order-gap {
    min-width: 19.5px !important;
    width: 19.5px !important;
    min-height: 19.5px !important;
    height: 19.5px !important;
}

.published-flight-info>div.published-flight-info-left {
    min-width: 41px !important;
    max-width: 41px !important;
    width: 41px !important;
    text-align: center;
    padding: 7px 0px 0px 0px !important;
}

.published-flight-info>div.published-flight-info-center {
    min-width: 200px !important;
    max-width: 200px !important;
    width: 200px !important;
    padding: 0px 4px 0px 8px !important;
}

.published-flight-info>div.published-flight-info-center .service-name {
    font-size: 11px !important;
}

.published-flight-info>div.published-flight-info-center .airports-wrapper {
    display: flex;
    font-size: 11px !important;
}

.published-flight-info>div.published-flight-info-center .airports-wrapper>i.flight-icon {
    margin: 0px 4px 0px 4px !important;
}

/* Airports wrapper clickable for published flights */
.published-flight-info>div.published-flight-info-center .airports-wrapper {
    cursor: pointer;
    transition: opacity 0.2s ease;
    align-items: center;
    gap: 4px;
}

.published-flight-info>div.published-flight-info-center .airports-wrapper:hover {
    opacity: 0.7;
}

.published-flight-info>div.published-flight-info-center .airports-wrapper .airports-info-icon {
    color: inherit;
    opacity: 0.7;
    margin-left: 4px;
}

.published-flight-info>div.published-flight-info-center .airports-wrapper:hover .airports-info-icon {
    opacity: 1;
}

.published-flight-info>div.flight-item-price-info {
    min-width: 75px !important;
    max-width: 75px !important;
    width: 75px !important;
    padding: 0px 0px 0px 4px !important;
    text-align: right !important;
}

.published-flight-info .service-code,
.published-flight-info .promo-date {
    font-size: 11px !important;
}

.published-flight-info .service-code {
    margin-top: 4.5px !important;
}

.filter-info-wrapper>span span {
    font-size: 18px !important;
}

.filter-info-wrapper .v-btn {
    height: 22px !important;
    width: 22px !important;
}

.filter-control {
    bottom: 20px !important;
    position: fixed;
    width: 100% !important;
}

.filter-control-wrapper .v-btn {
    margin: 0px !important;
    width: 120px !important;
}

.filter-control-wrapper {
    margin: auto !important;
    width: 120px !important;
}

div.promo-info i {
    font-size: 16px !important;
}

div.message-info-card {
    max-width: 320px !important;
    margin: auto;
    margin-bottom: 10px !important;
    text-align: justify;
}


div.message-info-card div.v-card-text div {
    display: block;
}

div.message-info-card div.icon-image-wrapper {
    width: 20px !important;
    max-width: 20px !important;
    min-width: 20px !important;
    height: 20px !important;
}

div.message-info-card div.v-card-text div img {
    height: 20px !important;
    float: left !important;
    display: inline;
}

.message-info-card .v-card-text {
    padding-top: 0px !important;
}

div.message-info-card div.v-card-text span.icon-wrapper {
    color: #FFF !important;
    background: #3053a3 !important;
    padding: 0px 3px 2px 3px !important;
    border-radius: 2px !important;
}

div.message-info-card div.v-card-text span.icon-wrapper i {
    font-size: 18px !important;
}

.message-info-card .card-header h5 {
    text-align: center;
    font-weight: normal !important;
    font-size: 20px !important;
    margin: 0px !important;
}

.message-info-card .card-header h5,
.message-info-card .card-header>div,
.message-info-card .card-header {
    height: 23px !important;
}

.preferred-country-title {
    text-align: center;
    font-size: 16px !important;
    padding: 0px 0px 8px 0px !important;
}

.preferred-country-col-wrapper {
    width: 100%;
    overflow: visible;
}

.preferred-country-content {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: visible;
    gap: 3px;
    align-items: center;
    justify-content: center;
    padding: 4px 0px;
    max-width: 100%;
}

.v-card.file-dialog {
    border-radius: 0px !important;
}

.v-card.file-dialog .v-btn {
    margin: 0px !important;
    height: 28px;
    width: 28px;
}

.v-card.file-dialog .v-btn span i {
    font-size: 22px !important;
}

.v-card.file-dialog .v-card-title .text-h5 {
    font-size: 18px !important;
}

.v-card.file-dialog .v-input__prepend {
    padding: 0px !important;
    margin: auto !important;
}

.v-card.customs-dialog .v-card-text .v-input__control,
.v-card.file-dialog .v-card-text .v-input__control {
    border: 1px solid #e1e1e1 !important;
    margin: 0px !important;
    padding-top: 8px !important;
    padding-left: 8px !important;
    padding-bottom: 8px !important;
}

.v-card.file-dialog .v-card-text .v-input__control {
    max-height: 200px !important;

}

.v-card.file-dialog .v-card-text .v-input__control>div {
    overflow: auto !important;
}

.v-card.file-dialog .v-card-text .v-input__control .v-field__input {
    padding-top: 0px !important;
}


.v-card.customs-dialog .v-card-text textarea {
    resize: none;
    padding: 0px !important;
}

.v-card.customs-dialog .v-card-text textarea {
    border: none !important;
    box-sizing: border-box !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
    box-shadow: none !important;
}

.v-card.customs-dialog .v-field__append-inner {
    padding-top: 12px !important;
}

.v-card.customs-dialog .v-card-text .v-autocomplete .v-field__input {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.btn-step-wrapper {
    display: block !important;
    text-align: center !important;
    width: 100% !important;
}

.btn-step-wrapper .v-btn {
    width: 150px !important;
    margin: auto;
}

.btn-icon:hover {
    cursor: pointer;
}

.v-row.row-btn-container {
    margin: auto !important;
    margin-top: 12px !important;
    ;
    max-width: 320px !important;
}

.v-row.row-btn-container>div {
    padding: 3px !important;
    width: 100% !important;
}

.v-row.row-btn-container>div>div>button span {
    text-transform: capitalize !important;
    font-weight: normal !important;
}

.v-row.row-btn-container>div>div>button span i {
    font-size: 24px !important;
}

.filter-info-wrapper span,
.filter-info-wrapper .v-btn span i {
    font-size: 18px !important;
}

.navigation-wrapper>div .v-btn.tab-selected-item {
    background: #e1e1e1 !important;
}

.navigation-wrapper>div.active-tab {
    margin: none !important;
}

.two-row-button-wrapper.disabled,
.btn-step-wrapper.disabled {
    color: #d1d1d1 !important;
}

.btn-step-wrapper.enabled span.v-btn__content,
.btn-step-wrapper.enabled span i {
    color: rgb(198, 0, 126) !important;
}

.navigation-wrapper .v-btn:last-child,
.navigation-wrapper .v-btn:first-child {
    border: none !important;
}

.v-row.row-btn-divider-container {
    margin: 0px !important;
    padding: 0px !important;
}

.my-possition-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.my-possition-wrapper span.icon-image-label {
    font-size: 10px;
    margin-top: 2px;
    line-height: 1;
}

.btn-step-upper,
.btn-step-down {
    width: 100% !important;
    display: block !important;
    min-width: 100% !important;
    margin: auto !important;
}

.title-class {
    text-align: center !important;
    font-weight: 500 !important;
    margin-top: 8px !important;
    padding-bottom: 12px !important;
    font-size: 20px !important;
    border-bottom: 1px #e1e1e1 solid !important;
    margin-bottom: 8px !important;
}

.shipment-supplements-wrapper {
    margin: 12px auto 14px auto !important;

}

.row-btn-container-wrapper.package-details-btn-container-wrapper {
    width: 100%;
    margin: 10px 0px 10px 0px;
}

.address-country-row .v-col-2 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding-right: 4px !important;
    padding-left: 4px !important;
}

.row-btn-container.package-details-btn-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    width: 320px;
    margin: auto;
    text-align: center;
}

.row-btn-container.package-details-btn-container>div.two-row-button-wrapper {
    display: contents;
}

.row-btn-container.package-details-btn-container>div.two-row-button-wrapper>div.button-two-rows-component {
    grid-row: 1;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #e1e1e1 !important;
    border-radius: 6px;
    padding: 8px 6px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.row-btn-container.package-details-btn-container>div.two-row-button-wrapper>div.btn-step-down-wrapper {
    grid-row: 2;
    padding: 4px 8px 0 8px;
}

.row-btn-container.package-details-btn-container>div.two-row-button-wrapper>div.button-two-rows-component .btn-label {
    margin: 0px 6px 0px 6px;
}

.row-btn-container.package-details-btn-container>div.two-row-button-wrapper.enabled>div.button-two-rows-component i {
    color: rgb(48, 83, 163) !important;
}

.row-btn-container.package-details-btn-container>div.two-row-button-wrapper>div.button-two-rows-component i {
    font-size: 28px !important;
}

.row-btn-container.package-details-btn-container>div.two-row-button-wrapper>div.button-two-rows-component>div.btn-step-upper {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    min-width: auto !important;
    margin: 0 !important;
}

.row-btn-container.package-details-btn-container>div.two-row-button-wrapper.enabled>div.button-two-rows-component {
    border: 1px rgb(48, 83, 163) !important;
    background: #68a0f0;
    color: #FFF;
}

.menu-logged-user-avatar {
    background: rgb(48, 83, 163);
    color: #FFF;
}

.v-main.main-container div.virtual-scroll-wrapper.reatime-flight>div.flight-list-infinite-scroll {
    height: calc(100vh - 260px) !important;
}

.v-main.main-container {
    height: calc(100vh - 120px) !important;
    max-height: calc(100vh - 120px) !important;
    min-height: calc(100vh - 120px) !important;
    margin-top: 50px !important;
    padding: 0px;
}


.published-rates-flight-list-infinite-scroll {
    max-width: 340px !important;
    width: 340px !important;
    margin: auto;
}

.published-rates-flight-list-infinite-scroll>div.v-virtual-scroll__container>div.v-virtual-scroll__item,
.published-rates-flight-list-infinite-scroll>div.v-virtual-scroll__container>div.v-virtual-scroll__item>div.published-reate-item.item {
    max-width: 320px !important;
    width: 320px !important;
    margin: auto;
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper {
    display: block;
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper:hover {
    cursor: pointer;
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div.item-wrapper-down>div.delivery-day {
    font-weight: 450;
    color: rgb(48, 83, 163);
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div.item-wrapper-down>div {
    width: 100%;
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div.item-wrapper-down>div.delivery-gap {
    text-align: right;
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div.item-wrapper-down>div.delivery-gap>span {
    margin-left: 4px;
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div {
    width: 100% !important;
    display: inline-flex;
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div.item-wrapper-top>div.express-price {
    text-align: right;
    width: 20%;
    font-weight: 500;
    font-size: 15px;
    color: rgb(48, 83, 163);
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div.item-wrapper-top>div.express-service-name {
    width: 80%;
    text-align: left;
}

.advanced-service-list-component .v-virtual-scroll .v-list-item {
    border-radius: 0px !important;
}

.advanced-service-list-component .v-virtual-scroll {
    padding-bottom: 10px !important;
}

.confirmation-image .confirmation_ok_image img {
    max-height: 120px !important;
}

.advanced-service-list-component .v-virtual-scroll>div.v-virtual-scroll__container>div.v-virtual-scroll__item {
    border: 1px solid #e1e1e1;
    margin-top: 8px;
    margin-top: 8px;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item {
    padding: 10px;
}

.v-row.package-tab-top-bar {
    margin: 0px !important;
    padding: 0px !important;
}

.v-row.package-tab-top-bar i,
.v-row.package-tab-top-bar span {
    color: #FFF !important;
}

.primary-text {
    color: #232c6f;
    font-weight: 500;
}

.secondary-text {
    width: 280px !important;
    margin: auto;
    text-align: justify;
}

.v-row.flight-list-infinite-scroll-row {
    margin: 0px auto 0px auto !important;
    width: 340px !important;
}

.v-row.order-bar-row {
    margin: 0px auto 8px auto !important;
    width: 340px !important;
}

.customs-accept-btn {
    background: #232c6f !important;
    color: #FFF !important;
    margin: auto
}

.customs-presets-row .v-chip-group {
    justify-content: flex-start;
}

.customs-presets-row .v-chip {
    margin: 2px !important;
}

.package-presets-row {
    padding: 0 12px;
}

.package-presets-row .v-chip-group {
    justify-content: center;
}

.package-presets-row .v-chip {
    margin: 2px !important;
}

.customs-dialog .v-card-text {
    padding-top: 8px !important;
    margin-top: 0px !important;
}

.customs-dialog hr.v-divider {
    margin: 0px !important;
}

.customs-dialog .v-card-text .customs-title>div {
    margin: auto !important;
    width: 250px !important;
    text-align: center;
    padding-bottom: 12px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-day-of-week label {
    font-weight: normal !important;
    font-size: 12pt;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-day-of-week {
    margin-top: 20px;
}

.advanced-realtime-flight-list-filter-dialog-component div.day-of-week-wrapper {
    margin-top: 20px;
}

.advanced-realtime-flight-list-filter-dialog-component .day-of-week-wrapper .day-of-week {
    display: inline-block;
    text-align: center;
    float: left;
    width: 34px !important;
    padding: 0px 0px 0px 0px;
    margin: 0px auto 0px auto;
}

.advanced-realtime-flight-list-filter-dialog-component .day-of-week-wrapper .day-of-week .day-of-week-label {
    text-align: center;
    width: 100%;
}

.advanced-realtime-flight-list-filter-dialog-component .day-of-week-wrapper .day-of-week .v-selection-control__wrapper {
    width: 34px !important;
}


.type-of-goods-dialog .type-of-goods-card>div.v-card-text {
    padding: 0px !important;
    height: 364px;
}

.type-of-goods-dialog .type-of-goods-card>div.v-card-text>div>div.v-virtual-scroll {
    margin-top: 8px;
}

.type-of-goods-dialog .type-of-goods-card>div.v-card-text>div.selected-type-of-goods-wrapper>div.selected-type-of-goods {
    width: 280px !important;
    margin: auto;
    margin-top: 20px;
    text-align: left;
}

.type-of-goods-dialog .type-of-goods-card>div.v-card-text>div.selected-type-of-goods-wrapper>div.selected-type-of-goods>i.btn-icon {
    margin: 0px !important;
    cursor: pointer;
}

.type-of-goods-dialog .type-of-goods-card>div.v-card-text>div.selected-type-of-goods-wrapper>div.selected-type-of-goods>div.selected-type-of-good-label {
    width: 235px;
    margin: 0px 4px 0px 4px;
    font-size: 15px;
}

.type-of-goods-dialog .type-of-goods-card>div.v-card-text>div.selected-type-of-goods-wrapper>div.selected-type-of-goods-btn-wrapper {
    width: 100%;
    margin-top: 80px;
    display: flex;
}

.type-of-goods-dialog .type-of-goods-card>div.v-card-text>div.selected-type-of-goods-wrapper>div.selected-type-of-goods-btn-wrapper>.v-btn {
    margin: auto !important;
    background: rgb(48, 83, 163) !important;
    color: #FFF;
}

.type-of-goods-dialog .type-of-goods-card>div.v-card-text>div>div.v-virtual-scroll .icon-wrapper {
    margin: 0px;
    margin-right: 5px;
}

.type-of-goods-dialog .type-of-goods-card>div.v-card-text>div>div.v-virtual-scroll .v-virtual-scroll__item:nth-child(odd) {
    background-color: #f1f1f1;
}

.type-of-goods-dialog .search-type-of-goods {
    border-bottom: 1px solid #d1d1d1;
}

/* ============================================================
   GLOBAL DIALOG DESIGN SYSTEM - Uniform styling for all popups
   ============================================================ */

/* --- 1. GLOBAL DIALOG CARD SHAPE & ELEVATION --- */
.v-dialog > .v-overlay__content > .v-card {
    border-radius: 8px !important;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18) !important;
}

.v-dialog--fullscreen > .v-overlay__content > .v-card {
    border-radius: 0px !important;
}

/* --- 2. GLOBAL DIALOG TOOLBAR --- */
.v-dialog .v-card > .v-toolbar {
    background-color: rgb(48, 83, 163) !important;
    color: white !important;
}

.v-dialog .v-card > .v-toolbar .v-toolbar-title {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: white !important;
}

.v-dialog .v-card > .v-toolbar .v-btn {
    color: white !important;
    margin: 0px !important;
}

.v-dialog .v-card > .v-toolbar .v-toolbar__content {
    min-height: 44px !important;
    padding: 0 8px 0 16px !important;
}

/* --- 3. DIALOG CLOSE BUTTON --- */
.v-dialog .v-card > .v-toolbar .v-btn--icon {
    width: 32px !important;
    height: 32px !important;
    font-size: 18px !important;
}

/* --- 4. GLOBAL DIALOG CONTENT PADDING --- */
.v-dialog .v-card > .v-card-text {
    padding: 16px !important;
}

/* --- 5. GLOBAL DIALOG ACTIONS BAR --- */
.v-dialog .v-card > .v-card-actions {
    padding: 8px 16px !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px;
}

/* Actions bar background for modern dialogs (excludes legacy blue-bg dialogs) */
.v-dialog:not(.dialog-box):not(.error-dialog) .v-card > .v-card-actions {
    background: #fafafa;
    border-top: 1px solid #e8e8e8;
}

/* --- 6. GLOBAL DIALOG BUTTON STYLING --- */
.v-dialog .v-card .v-card-actions .v-btn {
    margin-bottom: 0px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    letter-spacing: 0.2px;
    border-radius: 6px !important;
    font-size: 13px !important;
}

/* --- 7. LEGACY BTN-WRAPPER INSIDE ACTIONS --- */
.v-dialog .v-card .v-card-actions .btn-wrapper {
    display: contents;
}

/* --- 8. FULLSCREEN DIALOG EXCEPTIONS --- */
.v-dialog--fullscreen .v-card > .v-card-text {
    padding: 24px 48px !important;
}

.v-dialog--fullscreen .v-card > .v-toolbar .v-toolbar__content {
    min-height: 56px !important;
    padding: 0 16px !important;
}

/* ============================================================
   END GLOBAL DIALOG DESIGN SYSTEM
   ============================================================ */

.dialog-box .v-overlay__content {
    width: 360px;
}

.dialog-box .v-card>div,
.error-dialog .error-card>div,
.type-of-goods-dialog .type-of-goods-card>div {
    padding: 6px !important;
}

/* Filter dialogs: layout v-tabs/v-toolbar/v-card-actions tiene su propio padding
   (pa-0/pa-3/pa-4 en el template). El padding global de 6px sobre TODOS los divs
   directos del v-card rompia el alineamiento de toolbar y tabs. */
.advanced-published-flight-list-filter-dialog-component .v-card>div.v-card-text,
.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text {
    padding: 0 !important;
}

.dialog-box .v-card>div.v-card-item,
.error-dialog .error-card>div.v-card-item,
.type-of-goods-dialog .type-of-goods-card>div.v-card-item {
    padding: 0px !important;
}

.dialog-box .v-card>div.v-card-item>div.v-card-item__content>div.v-card-title *,
.error-dialog .error-card>div.v-card-item>div.v-card-item__content>div.v-card-title *,
.type-of-goods-dialog .type-of-goods-card>div.v-card-item>div.v-card-item__content>div.v-card-title * {
    font-size: 14px !important;
    background: rgb(48, 83, 163) !important;
    color: #FFF !important;
}

/* Filter dialogs: toolbar tiene color="transparent" en el template, no debe
   pintarse de azul como los dialogos legacy. Solo aplicamos color al titulo. */
.advanced-published-flight-list-filter-dialog-component .v-toolbar,
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar {
    background: rgb(48, 83, 163) !important;
    color: #FFF !important;
}
.advanced-published-flight-list-filter-dialog-component .v-toolbar .v-toolbar-title,
.advanced-published-flight-list-filter-dialog-component .v-toolbar .v-btn,
.advanced-published-flight-list-filter-dialog-component .v-toolbar .v-icon,
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar .v-toolbar-title,
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar .v-btn,
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar .v-icon {
    color: #FFF !important;
}

.card-main-toolbar,
.dialog-box .v-card>div.v-card-item>div.v-card-item__content>div.v-card-title .v-btn,
.error-dialog .error-card>div.v-card-item>div.v-card-item__content>div.v-card-title .v-btn,
.type-of-goods-dialog .type-of-goods-card>div.v-card-item>div.v-card-item__content>div.v-card-title .v-btn {
    margin: 0px;
}

.dialog-box.toolbar-on-card-text .v-card-text {
    padding: 0px !important;
}

.dialog-box.toolbar-on-card-text .v-card-text .card-main {
    padding: 6px;
}

.card-main-toolbar div.v-toolbar__content,
.card-main-toolbar div.v-toolbar__content>.v-btn>span>i {
    background: rgb(48, 83, 163) !important;
    color: #FFF !important;
}

.card-main-toolbar .v-toolbar-title {
    margin: 0px;
    padding: 0px;
}

.card-main-toolbar .v-btn {
    margin: 0px;
    text-transform: none !important;
    padding: 0px;
}


.error-dialog .error-list-wrapper {
    margin: 18px;
}

.error-dialog .error-card>div.v-card-text {
    padding: 0px;
    height: auto;
}

.error-dialog .error-list-wrapper div.v-virtual-scroll .v-virtual-scroll__item {
    margin-bottom: 9px;
    font-size: 14px;
}

.dialog-box .v-card .v-card-actions .v-btn,
.error-dialog .v-card-actions .v-btn {
    margin-bottom: 0px;
}

.dialog-box .v-card .v-card-actions .v-btn {
    background: #68a0f0 !important;
    color: #FFF;
    margin: 0px 2px 0px 2px;
}

.error-dialog.warnings .error-card .v-card-actions .v-btn {
    background: #68a0f0 !important;
    color: #FFF;
    margin: 0px 2px 0px 2px;
}

.dialog-box .v-card .v-card-actions,
.error-dialog.warnings .error-card .v-card-actions {
    margin: auto;
}

.dialog-box .v-card .v-card-actions .v-btn span,
.error-dialog.warnings .error-card .v-card-actions .v-btn span {
    text-transform: none !important;
}

.dialog-box .v-tabs .v-btn {
    margin: 0px;
}

.dialog-box .v-tabs .v-btn {
    text-align: center;
}

.advanced-published-flight-list-filter-dialog-component .v-card>div.v-card-text div.filters-wrapper,
.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text div.filters-wrapper {
    padding: 0px 12px 0px 12px;
}

.advanced-published-flight-list-filter-dialog-component .mdi-checkbox-marked,
.advanced-realtime-flight-list-filter-dialog-component .mdi-checkbox-marked {
    color: #68a0f0;
}

.advanced-published-flight-list-filter-dialog-component .range-wrapper>div.v-range-slider .v-slider-thumb>div.v-slider-thumb__surface,
.advanced-published-flight-list-filter-dialog-component .range-wrapper>div.v-range-slider>div.v-input__control .v-slider-track__fill,
.advanced-realtime-flight-list-filter-dialog-component .range-wrapper>div.v-range-slider .v-slider-thumb>div.v-slider-thumb__surface,
.advanced-realtime-flight-list-filter-dialog-component .range-wrapper>div.v-range-slider>div.v-input__control .v-slider-track__fill {
    background: #68a0f0;
}

/* Published & Realtime Filter Dialog - Tabs Layout
   Alineamiento armonico: toolbar superior, tabs centrados, contenido con padding
   uniforme, acciones inferiores con gap consistente. */
.advanced-published-flight-list-filter-dialog-component .published-filter-dialog-card,
.advanced-realtime-flight-list-filter-dialog-component .v-card {
    overflow: hidden;
    border-radius: 8px;
}

.advanced-published-flight-list-filter-dialog-component .v-toolbar,
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar {
    min-height: 48px;
    padding: 0 8px;
}

.advanced-published-flight-list-filter-dialog-component .v-toolbar .v-toolbar-title,
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar .v-toolbar-title {
    font-size: 14px !important;
    font-weight: 500;
    padding-left: 8px;
}

.advanced-published-flight-list-filter-dialog-component .v-tabs,
.advanced-realtime-flight-list-filter-dialog-component .v-tabs {
    min-height: 40px;
    background: #f5f7fa;
}

.advanced-published-flight-list-filter-dialog-component .v-tab,
.advanced-realtime-flight-list-filter-dialog-component .v-tab {
    min-height: 40px;
    font-size: 13px;
    text-transform: none;
    letter-spacing: 0;
    padding: 0 12px;
}

.advanced-published-flight-list-filter-dialog-component .v-tabs-window,
.advanced-realtime-flight-list-filter-dialog-component .v-tabs-window {
    min-height: 320px;
}

.advanced-published-flight-list-filter-dialog-component .v-card-actions,
.advanced-realtime-flight-list-filter-dialog-component .v-card-actions {
    padding: 8px 12px;
    border-top: 1px solid #e0e0e0;
    gap: 8px;
    min-height: 52px;
}

/* Filter row spacing dentro de las tabs */
.advanced-published-flight-list-filter-dialog-component .filter-wrapper,
.advanced-realtime-flight-list-filter-dialog-component .filter-wrapper {
    padding: 0 4px;
}

.advanced-published-flight-list-filter-dialog-component .filter-label,
.advanced-realtime-flight-list-filter-dialog-component .filter-label {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.advanced-published-flight-list-filter-dialog-component .filter-label label {
    color: #3053a3;
    font-weight: 500;
    display: flex;
    align-items: center;
    line-height: 1.4;
}

/* Sliders: dar respiracion a los thumb-label arriba para evitar choque con el label */
.advanced-published-flight-list-filter-dialog-component .filter-wrapper .v-slider,
.advanced-published-flight-list-filter-dialog-component .filter-wrapper .v-range-slider,
.advanced-realtime-flight-list-filter-dialog-component .filter-wrapper .v-slider,
.advanced-realtime-flight-list-filter-dialog-component .filter-wrapper .v-range-slider {
    margin-top: 18px;
}

.advanced-published-flight-list-filter-dialog-component .filter-label .v-icon {
    color: #3053a3;
}

.advanced-published-flight-list-filter-dialog-component .v-slider-thumb__label {
    background: #3053a3 !important;
    font-size: 11px;
}

.advanced-published-flight-list-filter-dialog-component .v-slider-thumb__label::before {
    color: #3053a3;
}

.advanced-published-flight-list-filter-dialog-component .filter-airlines .v-list-item {
    min-height: 48px;
}

.advanced-published-flight-list-filter-dialog-component .filter-airlines .v-avatar {
    border: 1px solid #e0e0e0;
}

.advanced-published-flight-list-filter-dialog-component .filter-airlines .airline-list-item {
    min-height: 48px;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
}

.advanced-published-flight-list-filter-dialog-component .filter-airlines .airline-list-item:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

.advanced-published-flight-list-filter-dialog-component .filter-airlines .airline-tail-img {
    width: 32px;
    height: auto;
    object-fit: contain;
}

.advanced-published-flight-list-filter-dialog-component .filter-apply-btn {
    background: #3053a3 !important;
}

/* Published Filters Header - Quick Filters (Direct, Promo, Priority) */
.published-filters-wrapper {
    display: block;
    max-width: 300px;
    margin: 0 auto;
}

.published-filters {
    display: flex;
    text-align: center;
    justify-content: center;
    gap: 8px;
}

.published-filters .filter-icon-wrapper {
    width: 60px;
    padding: 4px 0;
    margin: 0;
    text-align: center;
    cursor: pointer;
    border-radius: 8px;
    transition: background-color 0.2s ease;
}

.published-filters .filter-icon-wrapper:hover {
    background-color: rgba(48, 83, 163, 0.08);
}

.published-filters .filter-icon-wrapper i {
    font-size: 26px !important;
    padding: 0 !important;
    display: block;
    margin: 0 auto 2px auto;
}

.published-filters .filter-icon-wrapper i.inactive {
    color: rgb(48, 83, 163) !important;
}

.published-filters .filter-icon-wrapper i.active {
    color: #c6007e !important;
}

.published-filters .filter-icon-wrapper>span.icon-label {
    text-align: center;
    width: 100%;
    display: block;
    font-size: 11px;
    color: #666;
}

.published-filters .filter-icon-wrapper i.active+span.icon-label {
    font-weight: 500;
}

.published-filters-selected-wrapper {
    padding-top: 7px !important;
    padding-bottom: 1px !important;
}

.published-filters-selected>.v-chip {
    margin: 0px !important;
    padding: 4px 4px 4px 8px !important;
    height: 29px !important;
}

/* Quick Filters in List Header */
.quick-filters-row {
    margin-bottom: 8px !important;
}

.published-quick-filters {
    display: flex;
    justify-content: center;
    gap: 16px;
    padding: 8px 0;
    background: transparent;
    border-radius: 8px;
    margin: 0 auto;
    max-width: 280px;
}

.quick-filter-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 8px;
    transition: background-color 0.2s ease;
    min-width: 60px;
}

.quick-filter-item:hover {
    background-color: rgba(48, 83, 163, 0.1);
}

.quick-filter-icon {
    font-size: 24px !important;
    margin-bottom: 2px;
}

.quick-filter-icon.inactive {
    color: rgb(48, 83, 163) !important;
}

.quick-filter-icon.active {
    color: #c6007e !important;
}

.quick-filter-label {
    font-size: 11px;
    color: #666;
    text-align: center;
}

.quick-filter-item:has(.quick-filter-icon.active) .quick-filter-label {
    font-weight: 600;
    color: #333;
}

/* ============================================
   Unified Quick Filters - Shared by Realtime & Published
   ============================================ */
.unified-quick-filters {
    display: flex;
    justify-content: center;
    gap: 12px;
    padding: 8px 0;
    margin: 8px auto;
    max-width: 320px;
}

.unified-filter-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 8px;
    min-width: 56px;
    transition: background-color 0.2s ease;
}

.unified-filter-item:hover {
    background-color: rgba(48, 83, 163, 0.08);
}

.unified-filter-icon {
    font-size: 26px !important;
    margin-bottom: 2px;
}

.unified-filter-icon.inactive {
    color: rgb(48, 83, 163) !important;
}

.unified-filter-icon.active {
    color: #c6007e !important;
}

.unified-filter-label {
    font-size: 11px;
    color: #666;
    text-align: center;
    font-weight: 400;
}

.unified-filter-item:has(.unified-filter-icon.active) .unified-filter-label {
    font-weight: 600;
    color: #333;
}

/* ============================================
   Chip indicador del service activo debajo de los
   quick filters. El selector real vive ahora dentro del
   filter dialog (tab "Service") con search + multi-check.
   ============================================ */
.service-code-active-row {
    width: 100%;
}

/* ============================================
   Airlines list inside filter dialog tab "Airlines".
   Three-column grid (checkbox 32px | tail 32px | name 1fr)
   garantiza alineacion vertical exacta de checkbox, logo y
   texto independiente del ancho del logo o del label.
   ============================================ */
.airline-list-item {
    display: grid;
    grid-template-columns: 32px 36px 1fr;
    align-items: center;
    column-gap: 8px;
    padding: 4px 16px;
    height: 48px;
}

.airline-list-item:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

.airline-list-item-checkbox {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.airline-list-item-checkbox .v-checkbox-btn {
    flex: 0 0 auto;
    min-height: 0;
}

.airline-list-item-tail {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 100%;
}

.airline-list-item-tail .airline-tail-img {
    width: 32px;
    height: 32px;
    object-fit: contain;
    border-radius: 4px;
    background-color: #f5f5f5;
}

.airline-list-item-name {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
}

.airline-list-item-name > span {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Search bar dentro del tab Service / wrapper */
.service-search-wrapper {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

/* ============================================ */

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text .filters-wrapper>.filter-wrapper label {
    text-align: center;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text .filters-wrapper>.filter-wrapper .v-virtual-scroll label {
    margin-left: 8px;
    font-size: 10pt;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text .filters-wrapper>.filter-wrapper .v-virtual-scroll label .v-avatar {
    margin-right: 8px !important;
}

.crm-detail-card .v-list-item {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

.crm-messages-list-wrapper .v-list {
    max-height: 300px;
}

.crm-new-card>div.v-card-text {
    padding: 16px 20px 16px 20px !important;
}

.crm-item>div.v-card-text {
    padding: 0px 16px 0px 16px !important;
}

.day-of-week-wrapper {
    display: flex;
}

.advanced-realtime-flight-list-filter-dialog-component .v-range-slider {
    padding: 0px 22px 0px 22px;
}

.advanced-realtime-flight-list-filter-dialog-component .v-range-slider .v-slider-thumb__label {
    width: max-content;
    background: #3053a3;
    font-size: 10pt;
    color: #FFF;
    box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.35);
}

.advanced-realtime-flight-list-filter-dialog-component .v-range-slider .v-slider-thumb__label::before {
    color: #3053a3;
}

.advanced-realtime-flight-list-filter-dialog-component .general-tab-active .v-range-slider .v-slider-thumb__label {
    width: max-content;
    background: #FFF;
    font-size: 10pt;
    color: #3053a3;
    padding: 3px;
    box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.35);
}

.advanced-realtime-flight-list-filter-dialog-component .general-tab-active .v-range-slider .v-slider-thumb__label::before {
    color: #FFF;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text {
    padding: 0px !important;
    ;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text>div.card-main {
    padding: 0px 6px 6px 6px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text>div.card-main-toolbar>.v-toolbar .v-tabs {
    margin: 0px 6px 0px 6px;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text>div.card-main .v-tabs .v-tab,
.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text>div.card-main-toolbar>.v-toolbar .v-tabs .v-tab {
    height: 44px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text>div.card-main .v-tabs,
.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text>div.card-main-toolbar>.v-toolbar .v-tabs {
    height: 48px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text>div.card-main .v-tabs .v-tab {
    width: 33%;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text.general-tab-active .filter.filter-arrival div,
.advanced-realtime-flight-list-filter-dialog-component .v-card>div.v-card-text.general-tab-active .filter.filter-departure div {
    text-align: center;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card {
    min-height: 600px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions .v-btn {
    margin: 0px 8px 0px 8px;
    min-width: 80px;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions {
    width: 100%;
    display: flex;
    background: #FFF !important;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-label label {
    font-weight: 500 !important;
    font-size: 12pt;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions i {
    color: #3053a3;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions>div {
    width: 25%;
    text-align: center;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions>div.apply-btn-wrapper {
    width: 50%;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions>div.apply-btn-wrapper .v-btn {
    width: 100%;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions>div.apply-btn-wrapper .v-btn {
    margin: 0px;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card-text div.v-tabs,
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar-title div.v-tabs {
    margin: auto !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card-text div.v-tabs .v-tab.v-btn,
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar-title div.v-tabs .v-tab.v-btn {
    width: 33% !important;
}

.dialog-box .v-card {
    background: rgb(48, 83, 163);
    color: #FFF;
    padding: 0px 6px 6px 6px;
}

.dialog-box .v-card .v-card-text .v-tabs .v-tab {
    text-transform: none !important;
    color: #FFF;
}

.dialog-box .v-card .v-card-text {
    background: #2463cd;
}

.advanced-realtime-flight-list-filter-dialog-component .card-main {}

.advanced-realtime-flight-list-filter-dialog-component .airline-tab-active .card-main {
    background: #FFF;
}

.advanced-realtime-flight-list-filter-dialog-component .airline-tab-active label {
    color: #3053a3;
}

.advanced-realtime-flight-list-filter-dialog-component .airline-tab-active .card-main {
    color: gray !important;
}

.advanced-realtime-flight-list-filter-dialog-component .airline-tab-active .card-main i {
    color: rgb(104, 160, 240) !important;
    box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.35);
    padding: 0px;
}

.airline-list-wrapper>div.v-virtual-scroll .v-list-item {
    margin: 0px 0px 0px 8px;
    padding: 6px 0px 6px 0px;
}

.airline-list-wrapper>div.v-virtual-scroll .v-list-item .v-checkbox .v-messages {
    display: none;
}

.airline-list-wrapper {
    margin-top: 12px;
}

.dialog-box .v-card .v-card-text i {
    color: #FFF;
}

.dialog-box .range-wrapper .v-slider.v-input--horizontal .v-slider-track {
    height: calc(var(--v-slider-track-size) + 1px) !important;
    background: #FFF !important;
}

.dialog-box .range-wrapper .v-slider.v-input--horizontal .v-slider-track__background {
    background: #FFF !important;
    height: calc(var(--v-slider-track-size) + 1px) !important;

}

.advanced-realtime-flight-list-filter-dialog-component .filter-transit-time-6h {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-transit-time-6h div {
    width: 100%;
    text-align: center;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-transit-time-6h .icon-wrapper i {
    font-size: 30px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-transit-time-6h .label-wrapper {
    margin-top: 8px;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-transit-time-6h .checkbox-wrapper>div {
    margin: auto;
    width: 40px;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions.general-tab-active {
    background: rgb(48, 83, 163) !important;

}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-actions.general-tab-active i {
    color: #FFF;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-text.general-tab-active .filter-wrapper .filter-arrival.filter,
.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-text.general-tab-active .filter-wrapper .filter-departure.filter {
    margin-top: 40px;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-text.general-tab-active .filter-wrapper .filter-arrival.filter label,
.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-text.general-tab-active .filter-wrapper .filter-departure.filter label {
    display: none;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-text.general-tab-active .filter-stopopvers {
    margin-top: 40px;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card .v-card-text.general-tab-active .filters-wrapper {
    margin-top: 60px;
}

.address-search-place-btn {
    margin-top: 22px;
    display: flex;
}

.address-search-place-btn .v-btn {
    width: auto !important;
    margin: auto !important;
}


.place-dialog-list-list-wrapper {
    background: #FFF;
}

.dialog-box .place-dialog-list-list-wrapper .v-card>div.v-card-text {
    border-radius: 4px;
}

.dialog-box .place-dialog-list-list-wrapper .v-card {
    padding: 4px;
    margin: 4px !important;
}

.dialog-box .place-dialog-list-list-wrapper .v-card .v-card-text {
    display: inline-block;
    width: 100%;
}

.dialog-box .place-dialog-list-list-wrapper .v-card .v-card-text .item-place-name {
    margin-bottom: 0px;
}

.dialog-box.place-dialog-list-dialog>div>.v-card>div.v-card-text {
    background: #FFF;
}

.dialog-box.place-dialog-list-dialog>div>.v-card>div.v-card-item>div.v-card-item__content>div.v-card-title>.v-toolbar {
    display: flex;
}

.dialog-box.place-dialog-list-dialog>div>.v-card>div.v-card-item>div.v-card-item__content>div.v-card-title>.v-toolbar img {
    margin-top: 75px;
}

.button-component {
    display: block !important;
    width: 100% !important;
}

.button-component>div {
    margin: auto;
    display: block;
    width: max-content;
}

.button-component>div {
    margin-top: 4px;
}

.button-component .v-btn span.v-btn__content {
    padding-top: 8px;
    padding-bottom: 8px;
}

.button-component .v-btn {
    height: auto !important;
}

.button-component .v-btn span.v-btn__content div.button-sublabel-wrapper {
    margin-top: 4px;
}

.place-dialog-list-dialog .v-card.place-dialog-list-card .v-card>.v-card-actions i {
    font-size: 30px;
}

.place-dialog-list-dialog .v-card.place-dialog-list-card .v-card>.v-card-actions {
    margin: 0px;
    padding: 1px;
    display: inline-block;
    height: auto !important;
    min-height: auto !important;
}

.filter-wrapper {
    margin-top: 8px;
}

.filter-wrapper .filter-label label {
    font-weight: normal;
}

.filter-wrapper .range-wrapper {
    margin-top: 30px;
}

.confirmation-wrapper.confirmation-express-wrapper .shipment-ldv-component-wrapper>div.btn {
    margin: auto;
    max-width: 80px;
    color: #232c6f;
    text-align: center;
    padding: 6px;
    font-size: 28px;
}

/* CAMERA  */

body {
    display: flex;
    justify-content: center;
}

.camera-button,
.camera-shoot {
    display: block;
    width: 100%;
}

.camera-button>button,
.camera-shoot>button {
    display: block;
    margin: 12px auto 12px auto;
    width: 100px;
    color: #FFF;
    padding: 6px;
}

.camera-button>button {
    width: 120px;
    padding: 8px;
}

.camera-shoot>button i {
    font-size: 32px;
}

.dialog-box.files .v-chip {
    --v-chip-height: 100% !important;
}

.dialog-box.files>div.v-overlay__content>div.v-card>div.v-card-text>div.file-component-field-wrapper {
    overflow: scroll;
    max-height: 300px;
    margin-bottom: 12px;
}

.dialog-box.files>div.v-overlay__content>div.v-card>div.v-card-text>div.file-component-field-wrapper {
    color: #FFF;
    width: 100% !important;
    padding: 0px;
}

.dialog-box.files>div.v-overlay__content>div.v-card>div.v-card-text>div.file-component-field-wrapper>div.file-chips {
    width: 100% !important;
    min-width: 100%;
    margin: auto;
    display: inline-block;
}

.dialog-box.files>div.v-overlay__content>div.v-card>div.v-card-text>div.file-component-field-wrapper>div.file-chips>.v-chip {
    margin: auto;
    width: 280px;
    display: inline-flex;
    padding: 0px !important;
    text-align: center;
}


.dialog-box.files>div.v-overlay__content>div.v-card>div.v-card-text>div.file-component-field-wrapper>div.file-chips>.v-chip>.v-chip__close>i {
    font-size: 24px;
}

.dialog-box.files>div.v-overlay__content>div.v-card>div.v-card-text>div.file-component-field-wrapper>div.file-chips>.v-chip>.v-chip__close {
    margin: 0px 4px 0px 4px;
    max-height: 40px;
    max-width: 40px;
}


.dialog-box.files>div.v-overlay__content>div.v-card>div.v-card-text>div.file-component-field-wrapper>div.file-chips>.v-chip>.v-chip__content {
    width: 230px !important;
    color: #FFF;
    margin: auto;
}

.dialog-box.files .v-chip .thumnail-wrapper img {
    min-height: auto !important;
    max-height: auto !important;
    height: auto !important;
    width: 230px !important;
    margin: auto;
}

.privacy-note-span a:hover {
    color: darkblue;
    font-weight: bold;
}

.web-camera-container {
    margin-top: 2rem;
    margin-bottom: 2rem;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 500px;


    .camera-button {
        margin-bottom: 2rem;
    }

    .camera-box {
        .camera-shutter {
            opacity: 0;
            width: 450px;
            height: 337.5px;
            background-color: #fff;
            position: absolute;

            &.flash {
                opacity: 1;
            }
        }
    }

    .camera-shoot {
        margin: 1rem 0;

        button {
            height: 60px;
            width: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 100%;

            img {
                height: 35px;
                object-fit: cover;
            }
        }
    }

    .camera-loading {
        overflow: hidden;
        height: 100%;
        position: absolute;
        width: 100%;
        min-height: 150px;
        margin: 3rem 0 0 -1.2rem;

        ul {
            height: 100%;
            position: absolute;
            width: 100%;
            z-index: 999999;
            margin: 0;
        }

        .loader-circle {
            display: block;
            height: 14px;
            margin: 0 auto;
            top: 50%;
            left: 100%;
            transform: translateY(-50%);
            transform: translateX(-50%);
            position: absolute;
            width: 100%;
            padding: 0;

            li {
                display: block;
                float: left;
                width: 10px;
                height: 10px;
                line-height: 10px;
                padding: 0;
                position: relative;
                margin: 0 0 0 4px;
                background: #999;
                animation: preload 1s infinite;
                top: -50%;
                border-radius: 100%;

                &:nth-child(2) {
                    animation-delay: .2s;
                }

                &:nth-child(3) {
                    animation-delay: .4s;
                }
            }
        }
    }

    @keyframes preload {
        0% {
            opacity: 1
        }

        50% {
            opacity: .4
        }

        100% {
            opacity: 1
        }
    }
}

/*END CAMERA*/

/* CAMERA CONTROLS - Camera switch button */
.camera-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    padding: 10px 0;
}

.camera-switch button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.camera-switch button:hover {
    background-color: rgba(0, 0, 0, 0.7);
}

.camera-switch button i {
    font-size: 24px;
}

/* DROP ZONE STYLES */
.drop-zone {
    border: 2px dashed #ccc;
    border-radius: 8px;
    padding: 10px;
    transition: all 0.2s ease;
    margin-bottom: 10px;
}

.drop-zone.drag-over {
    border-color: #1976d2;
    background-color: rgba(25, 118, 210, 0.08);
}

.drop-zone .drop-hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #999;
    font-size: 12px;
    padding: 8px 0;
}

.drop-zone.drag-over .drop-hint {
    color: #1976d2;
}

/* FILE COUNTER */
.file-counter {
    text-align: right;
    color: #666;
    font-size: 12px;
}

/* ==========================================================================
   FILE CARDS STYLES - Improved file attachment display
   ========================================================================== */

/* Header with counter */
.file-list-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.file-counter-text {
    font-size: 12px;
    color: #666;
    font-weight: 500;
}

/* File cards container - grid layout */
.file-cards-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    max-height: 220px;
    overflow-y: auto;
    padding: 4px;
    margin-bottom: 16px;
}

/* Individual file card */
.file-card {
    position: relative;
    background: #f5f5f5;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.2s ease;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.file-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Remove button */
.file-card-remove {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.6);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: all 0.2s ease;
    padding: 0;
}

.file-card-remove:hover {
    background: #f44336;
    transform: scale(1.1);
}

.file-card-remove .v-icon {
    color: #fff !important;
    font-size: 12px !important;
}

/* Image thumbnail container */
.file-card-thumbnail {
    position: relative;
    width: 100%;
    height: 70px;
    overflow: hidden;
    background: #e0e0e0;
}

.file-card-image-preview {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Camera icon overlay for photos */
.file-card-overlay {
    position: absolute;
    bottom: 4px;
    left: 4px;
    width: 22px;
    height: 22px;
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Non-image file icon wrapper */
.file-card-icon-wrapper {
    height: 70px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #fafafa 0%, #f0f0f0 100%);
    gap: 2px;
}

.file-card-icon-wrapper .v-icon {
    font-size: 28px !important;
}

.file-card-extension {
    font-size: 9px;
    font-weight: 700;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* File info footer */
.file-card-info {
    padding: 6px 8px;
    background: #fff;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.file-card-name {
    display: block;
    font-size: 10px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
    line-height: 1.3;
}

.file-card-size {
    display: block;
    font-size: 9px;
    color: #999;
    margin-top: 2px;
}

/* Empty state */
.file-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    color: #bdbdbd;
    gap: 8px;
    background: #fafafa;
    border-radius: 8px;
    margin-bottom: 16px;
}

.file-empty-state span {
    font-size: 12px;
}

/* Responsive adjustments for smaller dialogs */
@media (max-width: 360px) {
    .file-cards-container {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Scrollbar styling for file cards container */
.file-cards-container::-webkit-scrollbar {
    width: 4px;
}

.file-cards-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.file-cards-container::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}

.file-cards-container::-webkit-scrollbar-thumb:hover {
    background: #a1a1a1;
}

/* END FILE CARDS STYLES */

/* ==========================================================================
   FILE DIALOG - MINIMAL STYLE
   Using brand colors: #232c6f (primary), #c6007e (accent)
   ========================================================================== */

.file-dialog-card {
    background: #fff !important;
}

/* v-card-text override: file dialog needs pa-0 since content has its own padding */
.file-dialog-component .v-card > .v-card-text {
    padding: 0px !important;
}

/* Attached files bar - thumbnails grid */
.attached-files-bar {
    display: flex;
    align-items: center;
    padding: 6px 10px;
    background: #f8f8f8;
    border-bottom: 1px solid #e1e1e1;
    gap: 8px;
}

.attached-thumbs-grid {
    display: flex;
    gap: 8px;
    flex: 1;
    overflow-x: auto;
    padding: 2px;
}

.attached-thumbs-grid::-webkit-scrollbar {
    height: 4px;
}

.attached-thumbs-grid::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 2px;
}

.attached-thumb-item {
    position: relative;
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    border-radius: 6px;
    cursor: pointer;
    border: 1px solid #ddd;
    transition: all 0.2s;
    background: #fff;
    overflow: hidden;
}

.attached-thumb-item:hover {
    border-color: #232c6f;
    box-shadow: 0 2px 6px rgba(35, 44, 111, 0.2);
}

.thumb-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.thumb-icon {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5;
}

.thumb-icon .v-icon {
    color: #232c6f !important;
    font-size: 16px !important;
}

.thumb-remove {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    border-radius: 50% !important;
    background: rgba(0, 0, 0, 0.65) !important;
    border: none !important;
    cursor: pointer;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0;
    transition: opacity 0.15s;
    padding: 0 !important;
    box-sizing: border-box !important;
}

.thumb-remove:hover {
    background: #c6007e !important;
}

.attached-thumb-item:hover .thumb-remove {
    opacity: 1;
}

.thumb-remove .v-icon {
    color: #fff !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

.files-count {
    font-size: 11px;
    color: #232c6f;
    font-weight: 500;
    flex-shrink: 0;
}

/* Error message */
.file-error-msg {
    padding: 8px 12px;
    background: #fff0f0;
    color: #c00;
    font-size: 11px;
    border-bottom: 1px solid #fcc;
}

/* Tabs - compact size, no resize on active */
.file-tabs {
    display: flex;
    height: 34px;
    margin-bottom: 8px;
    background: #f5f5f5;
}

.file-tab {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    height: 34px;
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 11px;
    color: #666;
    transition: all 0.2s;
    box-sizing: border-box;
}

.file-tab:hover {
    color: #232c6f;
    background: rgba(35, 44, 111, 0.05);
}

.file-tab.active {
    color: #232c6f;
    background: #fff;
    font-weight: 600;
}

.file-tab .v-icon {
    color: inherit !important;
    font-size: 16px !important;
}

.file-tab span {
    font-weight: 500;
}

/* Body - optimized for camera visibility */
.file-dialog-body {
    padding: 8px;
    height: 320px;
    box-sizing: border-box;
    overflow: hidden;
}

.tab-panel {
    height: 100%;
    overflow: hidden;
}

/* Upload zone */
.upload-zone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    border: 2px dashed #ddd;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
}

.upload-zone:hover {
    border-color: #232c6f;
    background: #f8f9ff;
}

.upload-zone.drag-over {
    border-color: #c6007e;
    background: #fff5fa;
}

.upload-icon {
    color: #232c6f !important;
    margin-bottom: 8px;
}

.upload-text {
    font-size: 13px;
    color: #333;
    margin-bottom: 4px;
}

.upload-hint {
    font-size: 10px;
    color: #999;
}

/* Camera panel */
/* Camera tab panel inside the file dialog: roomy, transparent, no frame. */
.camera-panel {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    height: 100%;
    overflow: hidden;
    padding: 12px 14px 8px;
    background: transparent;
}

/* Default root of camera-component when used standalone (no host class).
   Intentionally flat — no shadow, no border. Consumers that want a card
   look should wrap it in their own container. */
.camera-root {
    background: transparent;
    border: 0;
    box-shadow: none;
    border-radius: 0;
}

/* `camera-minimal` is the variant used when the component is embedded inside
   another card (currently: the file dialog's Camera tab). The host already
   provides padding and elevation, so we collapse the root to its content. */
.camera-minimal {
    width: 100%;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* Camera component styles inside dialog - compact layout */
.camera-minimal .camera-button {
    margin: 4px 0 10px;
    text-align: center;
}

.camera-minimal .camera-button button {
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 8px 22px !important;
    border-radius: 999px !important;
    min-width: 140px !important;
    transition: background-color 120ms ease, transform 80ms ease;
}

.camera-minimal .camera-button button:active {
    transform: scale(0.97);
}

.camera-minimal .camera-button button.is-primary {
    background: #232c6f !important;
    border-color: #232c6f !important;
    color: #fff !important;
}

.camera-minimal .camera-button button.is-danger {
    background: #c6007e !important;
    border-color: #c6007e !important;
    color: #fff !important;
}

.camera-minimal .camera-box {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    margin: 4px auto 10px;
    width: 100%;
    max-width: 320px;
    max-height: 240px;
    background: #0a0a0a;
    display: flex;
    align-items: center;
    justify-content: center;
}

.camera-minimal .camera-box video,
.camera-minimal .camera-box canvas {
    max-height: 240px;
    width: 100% !important;
    height: auto !important;
    display: block;
    object-fit: cover;
}

.camera-minimal .camera-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
    margin-top: 6px;
    padding: 2px 0 6px;
}

.camera-minimal .camera-shoot button {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    background: #c6007e !important;
    border: 2px solid #fff !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

.camera-minimal .camera-shoot button:hover {
    background: #a00066 !important;
}

.camera-minimal .camera-shoot button .v-icon {
    color: #fff !important;
    font-size: 18px !important;
}

.camera-minimal .camera-switch button {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: #232c6f !important;
    border: none !important;
}

.camera-minimal .camera-switch button .v-icon {
    color: #fff !important;
    font-size: 14px !important;
}

/* Footer uses standard v-card-actions via Global Dialog Design System */

/* ==========================================================================
   FILE PREVIEW MODAL - Teleported to body, above everything
   ========================================================================== */
.file-preview-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.95) !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    margin: 0 !important;
    cursor: pointer;
    box-sizing: border-box !important;
}

.file-preview-content {
    position: relative;
    max-width: min(90vw, 500px);
    max-height: 85vh;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
    cursor: default;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.preview-img {
    max-width: min(90vw, 500px);
    max-height: 85vh;
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
}

.preview-file-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 40px 60px;
    text-align: center;
}

.preview-file-info .v-icon {
    color: #232c6f !important;
}

.preview-file-info span {
    color: #333;
    font-size: 14px;
    word-break: break-all;
}

.preview-file-size {
    color: #888 !important;
    font-size: 12px !important;
}

/* Preview action buttons container */
.preview-actions {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    gap: 8px;
    z-index: 100;
}

.preview-actions .preview-btn {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
    border-radius: 50% !important;
    border: 2px solid #fff !important;
    cursor: pointer;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
    padding: 0 !important;
}

.preview-actions .preview-btn.btn-delete {
    background: #c6007e !important;
}

.preview-actions .preview-btn.btn-delete:hover {
    background: #a00066 !important;
}

.preview-actions .preview-btn.btn-close {
    background: #232c6f !important;
}

.preview-actions .preview-btn.btn-close:hover {
    background: #1a2156 !important;
}

.preview-actions .preview-btn .v-icon {
    color: #fff !important;
    font-size: 16px !important;
}

/* END FILE DIALOG MINIMAL */

@keyframes zoomOut {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.9);
    }

    100% {
        transform: scale(1);
    }
}

/* ==========================================================================
   PLACE SEARCH DROPDOWN STYLES
   Google Places search dropdown component
   ========================================================================== */

/* Search wrapper - flex para autocomplete + selector lado a lado */
.search-place-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.search-place-input-wrapper {
    position: relative;
    width: 100%;
}

/* Dropdown container */
.place-results-dropdown-wrapper {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1000;
    margin-top: 4px;
}

.place-results-dropdown {
    overflow-y: auto;
    border-radius: 8px !important;
    max-height: 350px;
}

/* Results list */
.place-results-list {
    padding: 0 !important;
}

.place-result-item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.place-result-item:last-child {
    border-bottom: none;
}

.place-result-item:hover,
.place-result-item.highlighted {
    background-color: rgba(var(--v-theme-primary), 0.08) !important;
}

.place-result-item.highlighted {
    background-color: rgba(var(--v-theme-primary), 0.12) !important;
}

/* Place name and address */
.place-name {
    font-size: 0.9rem !important;
    line-height: 1.3 !important;
    color: rgba(0, 0, 0, 0.87);
}

.place-address {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    color: rgba(0, 0, 0, 0.6);
    max-width: 200px;
}

/* Rating and type badges */
.place-result-item .v-chip {
    font-size: 0.65rem !important;
    height: 18px !important;
}

.place-result-item .v-chip .v-icon {
    font-size: 10px !important;
}

/* Map button */
.place-result-item .v-btn--icon {
    opacity: 0.6;
    transition: opacity 0.15s ease;
}

.place-result-item:hover .v-btn--icon,
.place-result-item.highlighted .v-btn--icon {
    opacity: 1;
}

/* Search hints */
.search-hint {
    font-size: 0.75rem;
    color: #757575;
    margin-top: 4px;
}

.search-error {
    font-size: 0.75rem;
    color: #f44336;
    margin-top: 4px;
}

/* Loading state */
.place-results-dropdown .v-progress-circular {
    margin: 0 auto;
}

/* Footer hint */
.place-results-dropdown .text-caption {
    background-color: #fafafa;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    .place-results-dropdown {
        max-height: 280px;
    }

    .place-address {
        max-width: 150px;
    }

    .place-result-item .v-chip.d-none.d-sm-flex {
        display: none !important;
    }
}

/* Icon colors by type */
.place-result-item .v-icon.mdi-warehouse {
    color: #795548 !important;
}

.place-result-item .v-icon.mdi-airplane {
    color: #2196F3 !important;
}

.place-result-item .v-icon.mdi-train {
    color: #4CAF50 !important;
}

.place-result-item .v-icon.mdi-domain {
    color: #607D8B !important;
}

.place-result-item .v-icon.mdi-store {
    color: #FF9800 !important;
}

.place-result-item .v-icon.mdi-city {
    color: #9C27B0 !important;
}

/* END PLACE SEARCH DROPDOWN */

/* ============================================
   CRM TICKET LIST - IMPROVED UI
   ============================================ */

/* Ticket Card Styles */
.crm-ticket-card {
    position: relative;
    margin-bottom: 12px;
    border-radius: 8px !important;
    overflow: hidden;
    transition: all 0.2s ease;
    cursor: pointer;
    border: 1px solid #e0e0e0;
}

.crm-ticket-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    border-color: #1976d2;
}

.crm-ticket-card.ticket-open {
    border-left: none;
}

.crm-ticket-card.ticket-closed {
    opacity: 0.85;
}

/* Status indicator bar on left */
.ticket-status-indicator {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
}

.ticket-status-indicator.status-open {
    background: linear-gradient(180deg, #4CAF50, #81C784);
}

.ticket-status-indicator.status-closed {
    background: linear-gradient(180deg, #9E9E9E, #BDBDBD);
}

/* Ticket header */
.ticket-header {
    flex-wrap: wrap;
    gap: 8px;
}

.ticket-subject-wrapper {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
}

.ticket-subject {
    font-weight: 600;
    font-size: 14px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ticket-badges {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

/* Ticket preview */
.ticket-preview {
    font-size: 13px;
    line-height: 1.4;
    color: #666;
    min-height: 20px;
}

/* Ticket footer */
.ticket-footer {
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid #f0f0f0;
}

.ticket-contact {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    color: #757575;
}

.ticket-date {
    display: flex;
    align-items: center;
}

/* ============================================
   CRM DETAIL DIALOG - CHAT STYLE
   ============================================ */

/* Chat-style messages */
.crm-messages-list-wrapper.chat-style {
    background: #f5f5f5;
    border-radius: 8px;
    padding: 16px;
    max-height: 400px;
    overflow-y: auto;
}

.messages-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.message-row {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

.message-row.message-mine {
    flex-direction: row-reverse;
}

.message-row.message-other {
    flex-direction: row;
}

.message-avatar {
    flex-shrink: 0;
}

.message-bubble {
    max-width: 75%;
    padding: 10px 14px;
    border-radius: 16px;
    position: relative;
}

.message-bubble.bubble-mine {
    background: linear-gradient(135deg, #1976d2, #1565c0);
    color: white;
    border-bottom-right-radius: 4px;
}

.message-bubble.bubble-other {
    background: white;
    color: #333;
    border-bottom-left-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.message-sender {
    font-size: 11px;
    font-weight: 600;
    margin-bottom: 4px;
    color: #1976d2;
}

.message-content {
    font-size: 14px;
    line-height: 1.4;
    word-wrap: break-word;
}

.message-time {
    font-size: 10px;
    margin-top: 4px;
    opacity: 0.7;
    text-align: right;
}

.bubble-mine .message-time {
    color: rgba(255, 255, 255, 0.8);
}

.bubble-other .message-time {
    color: #999;
}

/* ============================================
   CRM RESPONSIVE STYLES
   ============================================ */

@media (max-width: 768px) {
    .crm-ticket-card .v-card-text {
        padding: 12px !important;
    }

    .ticket-header {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .ticket-badges {
        margin-top: 8px;
    }

    .ticket-footer {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .ticket-date {
        margin-top: 4px;
    }

    .message-bubble {
        max-width: 85%;
    }

    .crm-messages-list-wrapper.chat-style {
        padding: 12px;
        max-height: 300px;
    }
}

@media (max-width: 480px) {
    .ticket-subject {
        font-size: 13px;
    }

    .ticket-preview {
        font-size: 12px;
    }

    .message-bubble {
        max-width: 90%;
        padding: 8px 12px;
    }

    .message-content {
        font-size: 13px;
    }
}

/* ============================================
   CRM LIST COMPONENT IMPROVEMENTS
   ============================================ */

.crm-list-component .crm-list-wrapper {
    padding: 16px;
}

.crm-list-component .v-infinite-scroll .item {
    padding: 0 !important;
}

.crm-list-component .v-infinite-scroll .item.even,
.crm-list-component .v-infinite-scroll .item.odd {
    background: transparent !important;
}

/* Add CRM button - Floating Action Button Style */
.crm-list-add-button-wrapper {
    position: fixed;
    bottom: 80px;
    right: 24px;
    z-index: 100;
}

.crm-add-btn {
    text-transform: none !important;
    font-weight: 600 !important;
    padding: 0 24px !important;
    border-radius: 28px !important;
    box-shadow: 0 4px 12px rgba(25, 118, 210, 0.4) !important;
    transition: all 0.3s ease !important;
}

.crm-add-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(25, 118, 210, 0.5) !important;
}

/* Send message area improvements */
.crm-send-message-wrapper {
    background: #fff;
}

/* New ticket dialog: clean layout, no separator */
.crm-new-card .crm-send-message-wrapper {
    padding: 0;
    margin: 0;
    border: none;
}

.crm-new-card .action-buttons-wrapper {
    border-top: none;
    padding-top: 4px;
    margin-top: 12px;
}

.crm-send-message-wrapper .v-container {
    padding: 0 !important;
}

.crm-send-message-wrapper .v-row {
    margin: 0 !important;
}

.crm-send-message-wrapper .v-col {
    padding: 4px 8px !important;
}

.crm-send-message-wrapper .v-textarea,
.crm-send-message-wrapper .v-text-field {
    margin-bottom: 0 !important;
}

.crm-send-message-wrapper .v-btn {
    text-transform: none;
    font-weight: 500;
}

/* Reply area in chat style */
.chat-style .crm-send-message-wrapper {
    background: #fff;
    border-radius: 8px;
    margin-top: 16px;
    padding: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.chat-style .crm-send-message-wrapper .v-textarea {
    background: #f5f5f5;
    border-radius: 8px;
}

/* Action buttons in send message */
.crm-send-message-wrapper .d-flex.justify-end {
    gap: 8px;
    padding-top: 8px;
}

.crm-send-message-wrapper .v-btn[color="blue-darken-2"] {
    min-width: 100px;
}

.crm-send-message-wrapper .v-btn[color="red-darken-2"] {
    min-width: 120px;
}

/* Responsive for floating button */
@media (max-width: 768px) {
    .crm-list-add-button-wrapper {
        bottom: 70px;
        right: 16px;
    }

    .crm-add-btn {
        padding: 0 16px !important;
    }
}

/* New CRM dialog improvements */
.crm-new-dialog .v-card {
    border-radius: 12px !important;
}

.crm-detail-dialog .v-card {
    border-radius: 12px !important;
    max-height: 90vh;
    overflow: hidden;
}

.crm-detail-dialog .v-card-text {
    overflow-y: auto;
    max-height: calc(90vh - 80px);
}

/* New ticket form styling */
.new-ticket-form {
    padding: 8px 0;
}

/* =============================================
   Advanced Filter Dialog - CRM List
   ============================================= */

.crm-advanced-filter-dialog .advanced-filter-content {
    padding: 16px 20px 8px 20px;
}

.crm-advanced-filter-dialog .filter-field-wrapper {
    margin-bottom: 16px;
}

.crm-advanced-filter-dialog .filter-date-row {
    display: flex;
    gap: 12px;
}

.crm-advanced-filter-dialog .filter-date-row > * {
    flex: 1;
}

.crm-optional-fields-panel .v-expansion-panel-title,
.crm-optional-fields-panel .v-expansion-panel-title--active {
    background: transparent !important;
}

.crm-optional-fields-panel .v-expansion-panel-text__wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.form-section-title {
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    color: #1976d2;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e0e0e0;
}

.message-input-area {
    margin-top: 12px;
}

.message-input-area .v-textarea {
    background: #fafafa;
    border-radius: 8px;
}

/* Action buttons wrapper */
.action-buttons-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #e0e0e0;
}

.action-buttons-wrapper .v-btn {
    text-transform: none !important;
    font-weight: 500;
}

.action-buttons-wrapper .send-btn {
    min-width: 120px;
}

.action-buttons-wrapper .close-ticket-btn {
    min-width: 130px;
}

/* Success dialog */
.success-dialog-card {
    border-radius: 12px !important;
}

/* Responsive adjustments for send message */
@media (max-width: 768px) {
    .action-buttons-wrapper {
        flex-direction: column-reverse;
        gap: 8px;
    }

    .action-buttons-wrapper .v-btn {
        width: 100%;
    }

    .action-buttons-wrapper .v-spacer {
        display: none;
    }
}

/* ============================================
   CRM DETAIL DIALOG - IMPROVED STYLING
   ============================================ */

/* Main dialog overlay */
.crm-detail-dialog.v-dialog {
    max-width: 900px !important;
    width: 95% !important;
    margin: 16px auto !important;
}

.crm-detail-dialog .v-overlay__content {
    max-width: 900px !important;
    width: 95% !important;
}

/* CRM Item Card (the detail card) */
.crm-item.crm-detail-card {
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15) !important;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
}

/* Card text/content area */
.crm-item.crm-detail-card>.v-card-text {
    padding: 16px !important;
    background: #fafafa;
    overflow-y: auto;
    flex: 1;
}

/* Toolbar in detail card */
.crm-item.crm-detail-card .v-toolbar {
    flex-shrink: 0;
}

/* Messages wrapper - chat style */
.crm-item .crm-messages-list-wrapper.chat-style {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    max-height: 350px;
    overflow-y: auto;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.crm-item .messages-container {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Message row styling */
.crm-item .message-row {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    animation: fadeInUp 0.3s ease;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.crm-item .message-row.message-mine {
    flex-direction: row-reverse;
}

.crm-item .message-row.message-other {
    flex-direction: row;
}

/* Avatar styling */
.crm-item .message-avatar {
    flex-shrink: 0;
}

.crm-item .message-avatar .v-avatar {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Message bubble styling */
.crm-item .message-bubble {
    max-width: 70%;
    padding: 12px 16px;
    border-radius: 18px;
    position: relative;
    word-wrap: break-word;
}

.crm-item .message-bubble.bubble-mine {
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%);
    color: #fff;
    border-bottom-right-radius: 6px;
    box-shadow: 0 2px 8px rgba(25, 118, 210, 0.3);
}

.crm-item .message-bubble.bubble-other {
    background: #fff;
    color: #333;
    border-bottom-left-radius: 6px;
    border: 1px solid #e8e8e8;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.crm-item .message-sender {
    font-size: 11px;
    font-weight: 600;
    margin-bottom: 4px;
    color: #1976d2;
}

.crm-item .message-content {
    font-size: 14px;
    line-height: 1.5;
}

.crm-item .message-time {
    font-size: 10px;
    margin-top: 6px;
    opacity: 0.7;
    text-align: right;
}

.crm-item .bubble-mine .message-time {
    color: rgba(255, 255, 255, 0.85);
}

.crm-item .bubble-other .message-time {
    color: #888;
}

/* Send message component inside detail dialog */
.crm-item .crm-send-message-wrapper,
.item-wrapper>.crm-send-message-wrapper {
    background: #fff;
    border-radius: 12px;
    margin-top: 16px;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    flex-shrink: 0;
}

.crm-item .crm-send-message-wrapper .v-textarea,
.item-wrapper>.crm-send-message-wrapper .v-textarea {
    background: #f5f5f5;
    border-radius: 8px;
}

.crm-item .crm-send-message-wrapper .v-textarea .v-field,
.item-wrapper>.crm-send-message-wrapper .v-textarea .v-field {
    border-radius: 8px;
}

/* Action buttons in detail dialog */
.crm-item .action-buttons-wrapper,
.item-wrapper .action-buttons-wrapper {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #eee;
    flex-wrap: wrap;
}

.crm-item .action-buttons-wrapper .v-btn,
.item-wrapper .action-buttons-wrapper .v-btn {
    text-transform: none !important;
    font-weight: 500;
    border-radius: 8px !important;
    min-height: 40px;
}

.crm-item .action-buttons-wrapper .send-btn,
.item-wrapper .action-buttons-wrapper .send-btn {
    min-width: 120px;
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%) !important;
    color: #fff !important;
}

.crm-item .action-buttons-wrapper .close-ticket-btn,
.item-wrapper .action-buttons-wrapper .close-ticket-btn {
    min-width: 130px;
}

/* CRM ID wrapper in title */
.crm-item .crm-id-wrapper {
    display: flex;
    align-items: center;
    font-weight: 600;
}

/* Empty state when ticket is closed */
.crm-item .crm-send-message-wrapper.ticket-closed-notice {
    text-align: center;
    color: #666;
    padding: 20px;
}

/* Scrollbar styling for messages */
.crm-item .crm-messages-list-wrapper.chat-style::-webkit-scrollbar {
    width: 6px;
}

.crm-item .crm-messages-list-wrapper.chat-style::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
}

.crm-item .crm-messages-list-wrapper.chat-style::-webkit-scrollbar-thumb {
    background: #c0c0c0;
    border-radius: 3px;
}

.crm-item .crm-messages-list-wrapper.chat-style::-webkit-scrollbar-thumb:hover {
    background: #a0a0a0;
}

/* Responsive adjustments for detail dialog */
@media (max-width: 768px) {
    .crm-detail-dialog.v-dialog {
        margin: 8px !important;
        max-height: 95vh;
    }

    .crm-item.crm-detail-card>.v-card-text {
        padding: 12px !important;
    }

    .crm-item .crm-messages-list-wrapper.chat-style,
    .item-wrapper .crm-messages-list-wrapper.chat-style {
        padding: 12px;
        max-height: 280px;
    }

    .crm-item .message-bubble,
    .item-wrapper .message-bubble {
        max-width: 85%;
        padding: 10px 14px;
    }

    .crm-item .crm-send-message-wrapper,
    .item-wrapper .crm-send-message-wrapper {
        padding: 12px;
    }
}

@media (max-width: 480px) {

    .crm-item .message-bubble,
    .item-wrapper .message-bubble {
        max-width: 90%;
    }

    .crm-item .message-content,
    .item-wrapper .message-content {
        font-size: 13px;
    }

    .crm-item .crm-messages-list-wrapper.chat-style,
    .item-wrapper .crm-messages-list-wrapper.chat-style {
        max-height: 240px;
    }
}

/* ================================================
   CLUSTERING - Cards de vuelos recomendados
   ================================================ */

/* Toggle vista */
.view-toggle-row {
    margin-bottom: 8px;
}

.view-toggle-row .v-btn-toggle {
    border-radius: 8px;
    overflow: hidden;
}

.view-toggle-row .v-btn-toggle .v-btn {
    text-transform: none;
    letter-spacing: normal;
}

/* Contenedor de lista clusterizada */
.clustered-flight-list {
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
}

.clustered-flight-list-row {
    margin-top: 4px;
}

.clustered-flight-list-row .v-col {
    padding: 0 !important;
}

/* Summary de clusters */
.clustering-summary {
    text-align: center;
    padding: 6px 0;
    margin-bottom: 6px;
}

/* Contenedor de clusters */
.clusters-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ================================================
   CLUSTER CARD - Estilo card limpio
   ================================================ */

.cluster-card {
    background: #fff;
    border: 1.5px solid #e8ecf0;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.2s ease;
    position: relative;
}

.cluster-card:hover {
    border-color: #232c6f;
    box-shadow: 0 4px 12px rgba(35, 44, 111, 0.1);
}

.cluster-card.expanded {
    border-color: #232c6f;
    box-shadow: 0 4px 16px rgba(35, 44, 111, 0.15);
}

.cluster-card.streaming {
    border-color: #ff9800;
}

/* Etiqueta de categoria - posicionada dentro del card */
.cluster-card-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 0 0 8px 0;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.cluster-card-label.label-success {
    background: linear-gradient(135deg, #2e7d32 0%, #43a047 100%);
}

.cluster-card-label.label-warning {
    background: linear-gradient(135deg, #ed6c02 0%, #ff9800 100%);
}

.cluster-card-label.label-info {
    background: linear-gradient(135deg, #0288d1 0%, #03a9f4 100%);
}

.cluster-card-label.label-primary {
    background: linear-gradient(135deg, #232c6f 0%, #3a4595 100%);
}

.cluster-card-label.label-secondary {
    background: linear-gradient(135deg, #7b1fa2 0%, #9c27b0 100%);
}

.cluster-card-label .v-icon {
    font-size: 16px !important;
}

/* Contenido principal */
.cluster-card-content {
    padding: 44px 16px 12px 16px;
    cursor: pointer;
}

.cluster-card-content:hover {
    background: #fafbfc;
}

/* Fila principal con info del vuelo */
.cluster-card-main {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cluster-card-route {
    flex: 1;
    min-width: 0;
}

.cluster-card-route .route-text {
    display: block;
    font-size: 17px;
    font-weight: 700;
    color: #1a1f36;
    letter-spacing: 0.5px;
}

.cluster-card-route .airline-code {
    display: block;
    font-size: 13px;
    color: #6b7280;
    margin-top: 2px;
}

.cluster-card-airline {
    flex-shrink: 0;
}

.cluster-card-airline .airline-logo {
    border: 1px solid #e8ecf0;
}

.cluster-card-info {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #6b7280;
    font-size: 13px;
    flex-shrink: 0;
}

.cluster-card-info .flight-separator {
    color: #d1d5db;
}

.cluster-card-price {
    flex-shrink: 0;
    text-align: right;
}

.cluster-card-price .price-currency {
    font-size: 16px;
    font-weight: 500;
    color: #1a1f36;
    vertical-align: top;
}

.cluster-card-price .price-value {
    font-size: 26px;
    font-weight: 700;
    color: #1a1f36;
    line-height: 1;
}

/* Descripcion */
.cluster-card-description {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f0f2f5;
    font-size: 13px;
    color: #6b7280;
}

/* Footer expandible */
.cluster-card-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    background: #f8f9fb;
    border-top: 1px solid #e8ecf0;
    cursor: pointer;
    transition: background 0.2s;
}

.cluster-card-footer:hover {
    background: #eef1f5;
}

.cluster-card-footer .footer-text {
    font-size: 13px;
    font-weight: 500;
    color: #232c6f;
}

.cluster-card-footer .v-icon {
    color: #232c6f;
}

/* Alternativas expandidas */
.cluster-card-alternatives {
    background: #f8f9fb;
    border-top: 1px solid #e8ecf0;
    max-height: 260px;
    overflow-y: auto;
}

.cluster-card-alternatives .realtime-flight-item,
.cluster-card-alternatives .published-reate-item {
    background: transparent !important;
    border-bottom: 1px solid #e8ecf0;
}

.cluster-card-alternatives .realtime-flight-item:last-child,
.cluster-card-alternatives .published-reate-item:last-child {
    border-bottom: none;
}

.cluster-card-alternatives .airline-flights-group {
    padding: 10px 12px !important;
    border-bottom: none !important;
}

.cluster-card-alternatives .v-list-item {
    padding: 0 !important;
    min-height: auto !important;
}

/* Scrollbar */
.cluster-card-alternatives::-webkit-scrollbar {
    width: 5px;
}

.cluster-card-alternatives::-webkit-scrollbar-track {
    background: #f0f0f0;
}

.cluster-card-alternatives::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

/* ================================================
   LEGACY CLUSTER STYLES (mantener compatibilidad)
   ================================================ */

.cluster-flight-group {
    display: none;
}

/* Vuelos adicionales con scroll */
.cluster-additional {
    background: #fafafa;
    border-top: 1px dashed #e0e0e0;
    max-height: 280px;
    overflow-y: auto;
    scroll-behavior: smooth;
}

/* Scrollbar personalizado para cluster-additional */
.cluster-additional::-webkit-scrollbar {
    width: 6px;
}

.cluster-additional::-webkit-scrollbar-track {
    background: #f0f0f0;
}

.cluster-additional::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

.cluster-additional::-webkit-scrollbar-thumb:hover {
    background: #aaa;
}

.cluster-additional .realtime-flight-item,
.cluster-additional .published-reate-item {
    background: transparent !important;
    border-bottom: 1px solid #eee;
}

.cluster-additional .realtime-flight-item:last-child,
.cluster-additional .published-reate-item:last-child {
    border-bottom: none;
}

.similar-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    font-size: 0.75em;
    color: #888;
    gap: 8px;
    position: sticky;
    top: 0;
    background: #fafafa;
    z-index: 1;
}

.similar-divider::before,
.similar-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #ddd;
}

/* Botones expandir/colapsar - mas compactos */
.expand-trigger,
.collapse-trigger {
    text-align: center;
    padding: 4px;
    border-top: 1px dashed #e0e0e0;
    background: #fafafa;
}

.expand-trigger .v-btn,
.collapse-trigger .v-btn {
    text-transform: none;
    letter-spacing: normal;
    font-size: 0.8em;
    height: 28px !important;
}

/* Estado vacio y cargando */
.no-clusters,
.loading-clusters {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px 16px;
    color: #888;
    text-align: center;
}

.no-clusters p,
.loading-clusters p {
    margin-top: 10px;
    font-size: 0.95em;
}

.loading-clusters .loading-hint {
    font-size: 0.8em;
    color: #aaa;
    margin-top: 6px;
}

/* Transiciones de lista */
.cluster-list-enter-active,
.cluster-list-leave-active {
    transition: all 0.3s ease;
}

.cluster-list-enter-from,
.cluster-list-leave-to {
    opacity: 0;
    transform: translateY(-10px);
}

.cluster-list-move {
    transition: transform 0.3s ease;
}

/* View toggle row */
.view-toggle-row {
    margin-bottom: 4px !important;
}

.view-toggle-row .v-col {
    padding: 4px 0 !important;
}

.view-toggle-row .v-btn-toggle {
    height: 32px;
}

.view-toggle-row .v-btn-toggle .v-btn {
    height: 32px !important;
    font-size: 0.8em;
}

/* Responsive */
@media (max-width: 600px) {
    .clustered-flight-list {
        max-width: 100%;
    }

    .cluster-header {
        padding: 6px 10px;
        gap: 6px;
    }

    .cluster-price-range {
        font-size: 0.85em;
    }

    .cluster-label .v-chip {
        font-size: 0.7em;
        height: 22px !important;
    }

    .cluster-count {
        font-size: 0.75em;
    }

    .view-toggle-row .v-btn-toggle .v-btn {
        font-size: 0.75em;
        padding: 0 6px;
    }

    .cluster-additional {
        max-height: 220px;
    }
}

@media (max-width: 400px) {
    .cluster-header {
        padding: 6px 8px;
    }

    .cluster-label .v-chip {
        font-size: 0.65em;
    }

    .cluster-count {
        font-size: 0.7em;
    }

    .cluster-price-range {
        font-size: 0.8em;
    }

    .cluster-additional {
        max-height: 180px;
    }
}

/* ================================================
   SMART FILTER DROPDOWN
   ================================================ */

.smart-filter-wrapper {
    padding: 8px 0;
}

.smart-filter-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 4px;
}

.smart-filter-btn {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
}

.smart-filter-btn .v-icon {
    opacity: 0.8;
}

.smart-filter-dropdown {
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
    border: 1px solid #e8ecf0;
    overflow: hidden;
}

.quick-filter-list {
    padding: 4px 0 !important;
}

.quick-filter-item {
    min-height: 48px !important;
    padding: 8px 16px !important;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.quick-filter-item:hover {
    background-color: #f5f7fa !important;
}

.quick-filter-item.filter-active {
    background-color: #e8f4fd !important;
}

.quick-filter-item .v-list-item__prepend {
    margin-right: 12px;
}

.filter-item-title {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #1a1f36 !important;
    line-height: 1.3 !important;
}

.filter-item-subtitle {
    font-size: 12px !important;
    color: #6b7280 !important;
    line-height: 1.3 !important;
    margin-top: 2px !important;
}

.active-filters-text {
    font-size: 13px;
    color: #1976d2;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.advanced-filter-btn {
    min-width: 36px !important;
    padding: 0 8px !important;
}

.applied-filters-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 4px 0;
}

.applied-filter-chip {
    font-size: 12px !important;
    height: 24px !important;
}

.applied-filter-chip .v-chip__close {
    font-size: 14px !important;
}

/* Responsive smart filter */
@media (max-width: 600px) {
    .smart-filter-bar {
        gap: 8px;
    }

    .active-filters-text {
        max-width: 120px;
        font-size: 12px;
    }

    .smart-filter-btn {
        font-size: 13px !important;
    }
}

/* ================================================
   TOP FLIGHTS COMPONENT - Top 3 Recommendations
   Horizontal card layout similar to cluster groups
   ================================================ */

.top-flights-component {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
}

/* Header */
.top-flights-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    padding: 0 4px;
}

.top-flights-title {
    display: flex;
    align-items: center;
    font-size: 15px;
    font-weight: 600;
    color: #1a1f36;
}

.top-flights-header .summary-chip {
    font-size: 11px;
}

/* Grid of 3 cards - vertical stack */
.top-flights-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Individual card - horizontal layout */
.top-flight-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.2s ease;
    position: relative;
}

.top-flight-card:hover {
    border-color: #232c6f;
    box-shadow: 0 2px 8px rgba(35, 44, 111, 0.12);
}

.top-flight-card.has-flight {
    cursor: pointer;
}

.top-flight-card.streaming {
    border-style: dashed;
    border-color: #ff9800;
}

/* Card color accents based on category */
.top-flight-card.card-success {
    border-left: 3px solid #43a047;
}

.top-flight-card.card-warning {
    border-left: 3px solid #ff9800;
}

.top-flight-card.card-info {
    border-left: 3px solid #03a9f4;
}

/* Card header row with label and price */
.top-flight-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: linear-gradient(90deg, #f8f9fa 0%, #fff 100%);
    border-bottom: 1px solid #f0f2f5;
}

/* Category label - chip style */
.top-flight-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    color: white;
}

.top-flight-label.label-success {
    background: linear-gradient(135deg, #2e7d32 0%, #43a047 100%);
}

.top-flight-label.label-warning {
    background: linear-gradient(135deg, #ed6c02 0%, #ff9800 100%);
}

.top-flight-label.label-info {
    background: linear-gradient(135deg, #0288d1 0%, #03a9f4 100%);
}

.top-flight-label .v-icon {
    font-size: 12px !important;
}

/* Price display in header */
.top-flight-price {
    font-size: 15px;
    font-weight: 700;
    color: #232c6f;
}

/* Card content - main area */
.top-flight-content {
    padding: 10px 12px;
}

/* Main row layout: Logo | Info | Button */
.top-flight-main-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Logo wrapper */
.top-flight-logo-wrapper {
    flex-shrink: 0;
}

.top-flight-logo-wrapper .airline-logo {
    border: 1px solid #e8ecf0;
    background: #fff;
}

/* Flight info section - flexible */
.top-flight-info {
    flex: 1;
    min-width: 0;
}

/* Airline name row */
.top-flight-airline-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.top-flight-airline-row .airline-name {
    font-size: 13px;
    font-weight: 600;
    color: #1a1f36;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top-flight-airline-row .flight-number {
    font-size: 12px;
    color: #6b7280;
}

/* Route row */
.top-flight-route-row {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #6b7280;
    flex-wrap: wrap;
}

.top-flight-route-row .route-text {
    font-weight: 600;
    color: #1a1f36;
    letter-spacing: 0.3px;
}

.top-flight-route-row .route-separator {
    color: #d1d5db;
}

.top-flight-route-row .duration-text,
.top-flight-route-row .stops-text {
    color: #6b7280;
}

/* Service type row */
.top-flight-service-row {
    margin-top: 4px;
}

/* Times row for realtime */
.top-flight-times-row {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: #9ca3af;
    margin-top: 4px;
}

.top-flight-times-row .time-label {
    color: #9ca3af;
}

.top-flight-times-row .time-value {
    font-weight: 500;
    color: #6b7280;
}

.top-flight-times-row .time-separator {
    color: #d1d5db;
    margin: 0 2px;
}

/* Action button */
.top-flight-action {
    flex-shrink: 0;
}

.top-flight-action .select-btn {
    min-width: 70px;
    font-size: 12px;
    font-weight: 600;
}

/* Empty/loading state */
.top-flight-empty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 12px;
    min-height: 60px;
}

.top-flight-empty .empty-text {
    font-size: 12px;
    color: #9ca3af;
}

/* Footer */
.top-flights-footer {
    display: flex;
    justify-content: center;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid #f0f2f5;
}

/* Row container */
.top-flights-row {
    margin-top: 8px;
}

.top-flights-row .v-col {
    padding: 0 !important;
}

/* Animation for streaming state */
@keyframes pulse-border {

    0%,
    100% {
        border-color: #ff9800;
    }

    50% {
        border-color: #ffcc80;
    }
}

.top-flight-card.streaming {
    animation: pulse-border 1.5s ease-in-out infinite;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    .top-flights-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .top-flight-main-row {
        flex-wrap: wrap;
    }

    .top-flight-info {
        flex-basis: calc(100% - 52px);
    }

    .top-flight-action {
        width: 100%;
        margin-top: 8px;
    }

    .top-flight-action .select-btn {
        width: 100%;
    }

    .top-flight-route-row {
        flex-wrap: wrap;
    }
}

/* Dynamic card count - adjust layout based on visible cards */
.top-flights-grid.cards-1 .top-flight-card {
    max-width: 100%;
}

.top-flights-grid.cards-1 .top-flight-card.card-info {
    /* Best Choice solo - highlight it more */
    border-left-width: 4px;
}

.top-flights-grid.cards-2 .top-flight-card {
    max-width: 100%;
}

/* When only 1 or 2 cards, make Best Choice (first card) more prominent */
.top-flights-grid.cards-1 .top-flight-card:first-child,
.top-flights-grid.cards-2 .top-flight-card:first-child {
    border-left-width: 4px;
}

.top-flights-grid.cards-1 .top-flight-card:first-child .top-flight-label,
.top-flights-grid.cards-2 .top-flight-card:first-child .top-flight-label {
    padding: 5px 12px;
    font-size: 12px;
}

.top-flights-grid.cards-1 .top-flight-card:first-child .top-flight-price,
.top-flights-grid.cards-2 .top-flight-card:first-child .top-flight-price {
    font-size: 17px;
}

/* ========================================
   Flight Details Popup Component
   ======================================== */

.flight-details-popup .v-overlay__content {
    max-width: 500px !important;
}

.flight-details-card {
    border-radius: 12px !important;
    overflow: hidden;
}

/* Header */
.flight-details-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 14px 16px !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    white-space: normal !important;
}

.flight-details-header .header-content {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex: 1;
}

/* Sin borde ni caja: el logo de la aerolinea es una imagen con fondo propio y
   el recuadro gris le recortaba la cola del avion. Se deja limpio. */
.flight-details-header .airline-logo {
    background: transparent;
    flex-shrink: 0;
    object-fit: contain;
}

.flight-details-header .header-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.flight-details-header .airline-name {
    font-size: 15px;
    font-weight: 600;
    color: #1a1a1a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flight-details-header .route-display {
    font-size: 13px;
    color: #666;
    font-weight: 500;
    letter-spacing: 0.5px;
}

/* Price banner */
.flight-details-card .price-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%);
    color: white;
}

.flight-details-card .price-label {
    font-size: 13px;
    opacity: 0.9;
}

.flight-details-card .price-value {
    font-size: 20px;
    font-weight: 700;
}

/* Content area */
.flight-details-content {
    padding: 12px 20px 16px !important;
}

.flight-details-content .detail-section {
    margin-bottom: 16px;
}

.flight-details-content .detail-section:last-child {
    margin-bottom: 0;
}

.flight-details-content .section-title {
    display: flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid #f0f0f0;
}

.flight-details-content .section-title .v-icon {
    color: #888 !important;
}

.flight-details-content .section-content {
    padding-left: 0;
}

/* Detail rows — label : value */
.flight-details-content .detail-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 4px 0;
    gap: 12px;
}

.flight-details-content .detail-row + .detail-row {
    border-top: 1px solid #f8f8f8;
}

.flight-details-content .detail-label {
    font-size: 13px;
    color: #888;
    flex-shrink: 0;
}

.flight-details-content .detail-value {
    font-size: 13px;
    font-weight: 600;
    color: #1a1a1a;
    text-align: right;
}

/* Schedule section (realtime) */
.flight-details-content .schedule-row {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 4px 0;
    gap: 0;
}

.flight-details-content .schedule-point {
    text-align: center;
    flex: 1;
    min-width: 0;
}

.flight-details-content .schedule-airport {
    font-size: 20px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 4px;
}

.flight-details-content .schedule-datetime {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
}

.flight-details-content .schedule-date {
    font-size: 12px;
    color: #888;
}

.flight-details-content .schedule-time {
    font-size: 15px;
    font-weight: 600;
    color: #1976d2;
}

.flight-details-content .schedule-arrow {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    color: #bbb;
    flex-shrink: 0;
}

.flight-details-content .schedule-arrow .v-icon {
    font-size: 20px !important;
    color: #bbb !important;
}

.flight-details-content .schedule-duration {
    font-size: 11px;
    color: #888;
    margin-top: 2px;
    white-space: nowrap;
}

/* Promo section */
.flight-details-content .promo-section .section-title {
    color: #4caf50;
}

.flight-details-content .promo-section .section-title .v-icon {
    color: #4caf50 !important;
}

.flight-details-content .promo-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: #e8f5e9;
    border-radius: 8px;
    font-size: 13px;
    color: #2e7d32;
}

.flight-details-content .promo-valid {
    font-size: 12px;
    color: #888;
    margin-top: 6px;
    padding-left: 4px;
}

/* Actions */
.flight-details-actions {
    padding: 8px 16px !important;
}

/* ---- CTA de seleccion dentro del popup de detalle ----
   El detalle no tenia salida hacia adelante: se leia la info y solo se podia
   cerrar. Este footer cierra el bucle en el momento de maxima intencion.
   Va despues de la regla de arriba para ganar por orden en cascada. */
.flight-details-card .flight-details-actions {
    padding: 12px 16px 16px 16px !important;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    /* Sticky: el CTA quedaba tras un scroll de longitud variable (published
       tiene 6 secciones, realtime 3). Ahora siempre esta a la vista. */
    position: sticky;
    bottom: 0;
    z-index: 2;
    background: #fff;
}

/* El contenido debe poder desplazarse bajo el footer fijo sin que el dialogo
   crezca fuera de pantalla en moviles. */
.flight-details-card .flight-details-content {
    max-height: 60vh;
    overflow-y: auto;
}

.flight-details-select-btn.v-btn {
    text-transform: none !important;
    font-weight: 600;
    border-radius: 6px !important;
}

.flight-details-select-btn .flight-details-select-price {
    margin-left: auto;
    font-weight: 700;
}

/* Details button in list items */
.flight-details-btn {
    min-width: 32px !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
}

.flight-details-btn .v-btn__content {
    font-size: 18px;
}

/* ========================================
   Flight Card Component (Unified)
   ======================================== */

/* Base card styles */
.flight-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.2s ease;
    position: relative;
}

.flight-card:hover {
    border-color: #232c6f;
    box-shadow: 0 2px 8px rgba(35, 44, 111, 0.12);
}

.flight-card.has-flight {
    cursor: pointer;
}

/* Card color accents */
.flight-card.card-success {
    border-left: 3px solid #43a047;
}

.flight-card.card-warning {
    border-left: 3px solid #ff9800;
}

.flight-card.card-info {
    border-left: 3px solid #03a9f4;
}

.flight-card.card-grey {
    border-left: 3px solid #9e9e9e;
}

/* Card header (top3 variant) */
.flight-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: linear-gradient(90deg, #f8f9fa 0%, #fff 100%);
    border-bottom: 1px solid #f0f2f5;
}

/* Card label chip */
.flight-card-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    color: white;
}

.flight-card-label.label-success {
    background: linear-gradient(135deg, #2e7d32 0%, #43a047 100%);
}

.flight-card-label.label-warning {
    background: linear-gradient(135deg, #ed6c02 0%, #ff9800 100%);
}

.flight-card-label.label-info {
    background: linear-gradient(135deg, #0288d1 0%, #03a9f4 100%);
}

.flight-card-label.label-grey {
    background: linear-gradient(135deg, #616161 0%, #9e9e9e 100%);
}

.flight-card-label .v-icon {
    font-size: 12px !important;
}

/* Price in header */
.flight-card-price-header {
    font-size: 15px;
    font-weight: 700;
    color: #232c6f;
}

/* Card content */
.flight-card-content {
    padding: 10px 12px;
}

/* Main row layout */
.flight-card-main {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Logo */
.flight-card-logo {
    flex-shrink: 0;
}

.flight-card-logo .airline-logo {
    border: 1px solid #e8ecf0;
    background: #fff;
}

/* Info section */
.flight-card-info {
    flex: 1;
    min-width: 0;
}

.flight-card-airline {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.flight-card-airline .airline-name {
    font-size: 13px;
    font-weight: 600;
    color: #1a1f36;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flight-card-airline .flight-number {
    font-size: 12px;
    color: #6b7280;
}

/* Route row */
.flight-card-route {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #6b7280;
    flex-wrap: wrap;
}

.flight-card-route .route-text {
    font-weight: 600;
    color: #1a1f36;
    letter-spacing: 0.3px;
}

.flight-card-route .separator {
    color: #d1d5db;
}

/* Service and times rows */
.flight-card-service,
.flight-card-times {
    display: flex;
    align-items: center;
    margin-top: 4px;
    font-size: 11px;
}

.flight-card-times .time-value {
    color: #6b7280;
    font-weight: 500;
}

/* Price for non-top3 variants */
.flight-card-price {
    text-align: right;
    padding: 0 8px;
}

.flight-card-price .price-value {
    font-size: 14px;
    font-weight: 700;
    color: #232c6f;
}

/* Actions */
.flight-card-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.flight-card-actions .select-btn {
    min-width: 60px;
    font-size: 12px;
    font-weight: 600;
}

/* Empty state */
.flight-card-empty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 12px;
    min-height: 60px;
}

.flight-card-empty .empty-text {
    font-size: 12px;
    color: #9ca3af;
}

/* Variant: mini */
.flight-card.flight-card-mini {
    border-radius: 6px;
}

.flight-card.flight-card-mini .flight-card-content {
    padding: 8px 10px;
}

.flight-card.flight-card-mini .flight-card-airline .airline-name {
    font-size: 12px;
}

.flight-card.flight-card-mini .flight-card-route {
    font-size: 11px;
}

.flight-card.flight-card-mini .flight-card-price .price-value {
    font-size: 13px;
}

/* Variant: cluster */
.flight-card.flight-card-cluster {
    border-radius: 10px;
}

/* ========================================
   Flight Representative Card (Unified)
   Used by TopFlightsComponent and ClusterFlightGroupComponent
   ======================================== */

.flight-rep-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.2s ease;
    position: relative;
}

.flight-rep-card:hover {
    border-color: #232c6f;
    box-shadow: 0 2px 8px rgba(35, 44, 111, 0.12);
}

.flight-rep-card.has-flight {
    cursor: pointer;
}

.flight-rep-card.streaming {
    border-style: dashed;
    border-color: #ff9800;
    animation: pulse-border 1.5s ease-in-out infinite;
}

/* Color accents */
.flight-rep-card.card-success {
    border-left: 3px solid #43a047;
}

.flight-rep-card.card-warning {
    border-left: 3px solid #ff9800;
}

.flight-rep-card.card-info {
    border-left: 3px solid #03a9f4;
}

.flight-rep-card.card-primary {
    border-left: 3px solid #232c6f;
}

.flight-rep-card.card-secondary {
    border-left: 3px solid #9c27b0;
}

.flight-rep-card.card-grey {
    border-left: 3px solid #9e9e9e;
}

/* Header with label and price */
.flight-rep-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: linear-gradient(90deg, #f8f9fa 0%, #fff 100%);
    border-bottom: 1px solid #f0f2f5;
}

/* Label chip */
.flight-rep-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    color: white;
}

.flight-rep-label.label-success {
    background: linear-gradient(135deg, #2e7d32 0%, #43a047 100%);
}

.flight-rep-label.label-warning {
    background: linear-gradient(135deg, #ed6c02 0%, #ff9800 100%);
}

.flight-rep-label.label-info {
    background: linear-gradient(135deg, #0288d1 0%, #03a9f4 100%);
}

.flight-rep-label.label-primary {
    background: linear-gradient(135deg, #1a237e 0%, #232c6f 100%);
}

.flight-rep-label.label-secondary {
    background: linear-gradient(135deg, #7b1fa2 0%, #9c27b0 100%);
}

.flight-rep-label.label-grey {
    background: linear-gradient(135deg, #616161 0%, #9e9e9e 100%);
}

.flight-rep-label .v-icon {
    font-size: 12px !important;
}

/* Price in header */
.flight-rep-price-header {
    font-size: 15px;
    font-weight: 700;
    color: #232c6f;
}

/* Content area - contiene los componentes de item existentes */
.flight-rep-card-content {
    padding: 0;
}

/* Description opcional bajo el header */
.flight-rep-description {
    font-size: 11px;
    color: #6b7280;
    padding: 4px 12px 0;
    background: linear-gradient(90deg, #f8f9fa 0%, #fff 100%);
}

/* Ajustes para el componente realtime dentro del wrapper */
.flight-rep-card-content .realtime-flight-item {
    padding: 0 !important;
    min-height: auto !important;
}

.flight-rep-card-content .realtime-flight-item .airline-flights-group {
    padding: 8px 12px !important;
}

/* Ajustes para el componente published dentro del wrapper */
.flight-rep-card-content .published-reate-item {
    padding: 0 !important;
    min-height: auto !important;
}

.flight-rep-card-content .published-flight-info {
    padding: 8px 12px !important;
}

/* Ocultar el precio del item interno cuando hay header (ya se muestra en header):
   en la card el header es el unico punto de seleccion y duplicar el boton
   confundia sobre cual pulsar. */
.flight-rep-card.has-flight .flight-rep-card-header+.flight-rep-description+.flight-rep-card-content .flight-price-text,
.flight-rep-card.has-flight .flight-rep-card-header+.flight-rep-card-content .flight-price-text {
    display: none !important;
}

/* Ajuste del wrapper del precio cuando esta oculto */
.flight-rep-card.has-flight .flight-rep-card-header+.flight-rep-description+.flight-rep-card-content .flight-price-wrapper,
.flight-rep-card.has-flight .flight-rep-card-header+.flight-rep-card-content .flight-price-wrapper {
    justify-content: flex-end;
}

/* Solo mostrar el boton de detalles */
.flight-rep-card.has-flight .flight-rep-card-header+.flight-rep-description+.flight-rep-card-content .flight-details-btn,
.flight-rep-card.has-flight .flight-rep-card-header+.flight-rep-card-content .flight-details-btn {
    margin-right: 0;
}

/* Empty state */
.flight-rep-empty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 12px;
    min-height: 60px;
}

.flight-rep-empty .empty-text {
    font-size: 12px;
    color: #9ca3af;
}

/* Compact mode - para alternativas en clusters */
.flight-rep-card.compact {
    border-radius: 6px;
    margin-bottom: 8px;
}

.flight-rep-card.compact .flight-rep-card-content .realtime-flight-item .airline-flights-group,
.flight-rep-card.compact .flight-rep-card-content .published-flight-info {
    padding: 6px 10px !important;
}

/* En modo compacto, mostrar el precio en el item (no hay header) */
.flight-rep-card.compact .flight-price-text {
    display: inline !important;
}

/* Integration with cluster card */
.cluster-card .flight-rep-card {
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.cluster-card .flight-rep-card:hover {
    box-shadow: none;
}

.cluster-card-alternatives .flight-rep-card {
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    margin-bottom: 8px;
}

.cluster-card-alternatives .flight-rep-card:last-child {
    margin-bottom: 0;
}

/* ========================================
   Top Flights - Diseño Mockup Style
   ======================================== */

/* Header Banner */
.top-flights-header-banner {
    background-color: #4c74d9;
    color: #ffffff;
    text-align: center;
    padding: 24px 16px 32px;
    border-bottom-left-radius: 24px;
    border-bottom-right-radius: 24px;
    margin-bottom: 24px;
}

.top-flights-header-banner .header-icon {
    font-size: 40px;
    margin-bottom: 12px;
}

.top-flights-header-banner .header-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.top-flights-header-banner .header-subtitle {
    font-size: 14px;
    opacity: 0.8;
    margin: 0;
}

/* Header elegante para Top Flights */
.top-flights-header {
    text-align: center;
    padding: 20px 16px 16px;
    margin-bottom: 8px;
}

.top-flights-title {
    font-size: 20px;
    font-weight: 600;
    color: #232c6f;
    margin: 0 0 6px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    text-align: center;
    width: 100%;
}

.top-flights-title-icon {
    color: #232c6f !important;
    font-size: 24px !important;
}

/* Cards Container - Vertical stack con gap */
.top-flights-cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
}

/* Card Styling - Borde fino con sombra 3D */
.top-flights-cards .flight-rep-card {
    border-radius: 12px;
    padding: 0;
    border: 1px solid #e0e0e0;
    margin: 0px 15px;
    box-shadow: 2px 2px 4px rgba(128, 128, 128, 0.25);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.top-flights-cards .flight-rep-card:hover {
    box-shadow: 3px 3px 6px rgba(128, 128, 128, 0.35);
    transform: translateY(-1px);
}

/* Card borders - borde fino con colores sutiles */
.top-flights-cards .flight-rep-card.card-success,
.top-flights-cards .flight-rep-card.card-green {
    border-color: #c8e6c9;
}

.top-flights-cards .flight-rep-card.card-warning,
.top-flights-cards .flight-rep-card.card-orange {
    border-color: #ffe0b2;
}

.top-flights-cards .flight-rep-card.card-info,
.top-flights-cards .flight-rep-card.card-blue {
    border-color: #c5cae9;
}

/* Labels - Fondo sólido con texto blanco (estilo chip/badge) */
.top-flights-cards .flight-rep-label {
    font-size: 12px;
    padding: 5px 12px;
    border-radius: 16px;
    font-weight: 600;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.top-flights-cards .flight-rep-label .v-icon {
    color: #ffffff !important;
}

/* Best Price - Verde */
.top-flights-cards .flight-rep-label.label-success,
.top-flights-cards .flight-rep-label.label-green {
    background: #2e7d32;
    color: #ffffff;
}

/* Fastest - Amarillo/Naranja */
.top-flights-cards .flight-rep-label.label-warning,
.top-flights-cards .flight-rep-label.label-orange {
    background: #f9a825;
    color: #ffffff;
}

/* Best Choice - Azul (color primario del proyecto) */
.top-flights-cards .flight-rep-label.label-info,
.top-flights-cards .flight-rep-label.label-blue {
    background: #232c6f;
    color: #ffffff;
}

/* Precio en header */
.top-flights-cards .flight-rep-price-header {
    font-size: 18px;
    font-weight: 700;
    color: #232c6f;
}

/* Card Footer con descripcion */
.flight-rep-card-footer {
    font-size: 12px;
    color: #666666;
    padding: 8px 12px;
    margin-top: 0;
    text-align: center;
    background: #f8f9fa;
    border-top: 1px solid #e0e0e0;
}

/* CTA Section */
.top-flights-cta {
    text-align: center;
    padding: 20px 16px 24px;
}

.top-flights-cta .cta-button {
    background-color: #ffffff;
    color: #232c6f;
    border: 2px solid #232c6f;
    border-radius: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.top-flights-cta .cta-button:hover {
    background-color: #232c6f;
    color: #ffffff;
}

.top-flights-cta .cta-subtitle {
    font-size: 12px;
    color: #666666;
    margin-top: 6px;
}

/* Responsive */
@media (max-width: 420px) {
    .top-flights-header-banner {
        padding: 16px 12px 24px;
    }

    .top-flights-header-banner .header-title {
        font-size: 18px;
    }

    .top-flights-cards {
        padding: 0 12px;
        gap: 16px;
    }

    .top-flights-cards .flight-rep-price-header {
        font-size: 20px;
    }
}

/* ========================================
   Indicadores de vuelo (Priority/Promo)
   ======================================== */

/* Indicadores inline junto al precio */
.published-flight-info .flight-price-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.published-flight-info .flight-indicators {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-right: 4px;
}

.published-flight-info .flight-indicators .v-icon {
    font-size: 16px !important;
}

.published-flight-info .flight-indicators .priority-icon {
    color: #ff9800 !important;
}

.published-flight-info .flight-indicators .promo-icon {
    color: #43a047 !important;
}

/* ========================================
   Flight Representative Card - Clickable
   ======================================== */

/* Precio clickeable en el header */
.flight-rep-price-clickable {
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    transition: background-color 0.2s ease;
}

.flight-rep-price-clickable:hover {
    background-color: rgba(35, 44, 111, 0.1);
}

/* El precio del header es el unico punto de seleccion cuando la card lleva
   label (el boton del item interno se oculta mas arriba), asi que se muestra
   como CTA explicito: precio + etiqueta "Select". */
.flight-rep-price-clickable {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.15;
    border: 1px solid rgba(35, 44, 111, 0.25);
}

.flight-rep-price-clickable .flight-rep-price-value {
    font-weight: 700;
    white-space: nowrap;
}

.flight-rep-price-clickable .flight-rep-price-cta {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    opacity: 0.75;
}

/* Card clickeable */
.flight-rep-card.has-flight {
    cursor: pointer;
}

.flight-rep-card.has-flight:hover {
    box-shadow: 0 4px 12px rgba(35, 44, 111, 0.15);
}

/* ========================================
   Door-to-Door Card Styles
   ======================================== */

/* Purple color for DtD cards */
.flight-rep-card.card-purple {
    border-left: 3px solid #9c27b0;
}

.top-flights-cards .flight-rep-card.card-purple {
    border-color: #e1bee7;
}

/* DtD specific card styling */
.flight-rep-card.dtd-card {
    background: linear-gradient(135deg, #fafafa 0%, #f5f0f7 100%);
}

/* DtD Label */
.top-flights-cards .flight-rep-label.label-purple {
    background-color: #9c27b0;
    color: #fff;
}

/* DtD Price Breakdown */
.dtd-price-breakdown {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 6px 12px;
    background: #f9f5fb;
    border-top: 1px dashed #e1bee7;
    border-bottom: 1px dashed #e1bee7;
    font-size: 11px;
}

.dtd-breakdown-row {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #666;
}

.dtd-breakdown-row .dtd-icon {
    color: #9c27b0;
    opacity: 0.7;
}

.dtd-breakdown-row .dtd-label {
    font-weight: 500;
    color: #888;
}

.dtd-breakdown-row .dtd-price {
    font-weight: 600;
    color: #333;
}

/* Mobile responsiveness for DtD breakdown */
@media (max-width: 600px) {
    .dtd-price-breakdown {
        flex-direction: column;
        gap: 4px;
    }
}

/* ========================================
   Route Comparison Component - Multi-Route
   ======================================== */

.route-comparison-wrapper {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 12px;
    margin-bottom: 16px;
    border: 1px solid #e1e1e1;
}

.route-comparison-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e1e1e1;
}

.route-comparison-title {
    font-size: 14px;
    font-weight: 500;
    color: #232c6f;
    display: flex;
    align-items: center;
}

.route-comparison-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.route-comparison-item {
    display: flex;
    align-items: center;
    padding: 10px 12px;
    background: #fff;
    border-radius: 6px;
    border: 1px solid #e1e1e1;
    cursor: pointer;
    transition: all 0.2s ease;
    gap: 8px;
}

.route-comparison-item:hover {
    background: #f0f4ff;
    border-color: #232c6f;
}

.route-comparison-item.route-active {
    background: #e8f0fe;
    border-color: #232c6f;
    border-width: 2px;
}

.route-comparison-item.route-best {
    border-left: 3px solid #43a047;
}

.route-check-icon {
    margin-right: 4px;
}

.route-terminals {
    display: flex;
    align-items: center;
    font-weight: 500;
    color: #232c6f;
    min-width: 90px;
}

.route-origin,
.route-destination {
    font-size: 14px;
    font-weight: 600;
}

.route-separator {
    color: #999;
    margin: 0 4px;
}

.route-flight-count {
    font-size: 13px;
    color: #666;
    min-width: 70px;
}

.route-price {
    font-size: 13px;
    color: #333;
    flex: 1;
}

.route-price strong {
    color: #232c6f;
    font-size: 15px;
}

.route-badges {
    display: flex;
    align-items: center;
    gap: 6px;
}

.route-badge {
    font-size: 10px !important;
    padding: 2px 6px !important;
    height: auto !important;
}

.route-ground-icon {
    margin-left: 4px;
}

.route-comparison-footer {
    margin-top: 12px;
    text-align: center;
    border-top: 1px solid #e1e1e1;
    padding-top: 8px;
}

/* Responsive para móviles */
@media (max-width: 480px) {
    .route-comparison-item {
        flex-wrap: wrap;
        gap: 4px;
    }

    .route-terminals {
        width: 100%;
        margin-bottom: 4px;
    }

    .route-separator {
        display: none;
    }

    .route-flight-count,
    .route-price {
        font-size: 12px;
    }
}

/* ========================================
   Ground Service Toggle - Address Component
   ======================================== */

.ground-service-toggle-wrapper {
    margin-top: 8px;
    padding: 8px 12px;
    background: #f5f7fa;
    border-radius: 6px;
}

.ground-service-toggle-wrapper .v-switch {
    margin: 0;
}

.ground-service-info-alert {
    margin-top: 8px;
}

.alternative-airports-info {
    margin-top: 8px;
    padding: 8px;
    background: #e8f5e9;
    border-radius: 4px;
    font-size: 12px;
    color: #2e7d32;
}

/* ADDRESS ICON BAR */
.address-icon-bar {
    background: transparent !important;
    padding: 0 !important;
}

.address-icon-bar-inner {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.address-icon-bar-btn {
    height: 36px !important;
    width: 36px !important;
    min-width: 36px !important;
    border-radius: 50% !important;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.address-icon-bar-btn .v-icon {
    font-size: 20px !important;
}

.address-icon-bar-btn-active {
    background-color: rgba(48, 83, 163, 0.12) !important;
}

.address-icon-bar-btn:not(.address-icon-bar-btn-active) .v-icon {
    color: #9e9e9e !important;
}

.address-icon-bar-btn-clean {
    transform: rotateY(180deg);
}

.address-icon-bar-btn-clean .v-icon {
    color: #9e9e9e !important;
}

.address-icon-bar-btn-clean:hover .v-icon {
    color: rgb(198, 0, 126) !important;
}

/* Indicador de ruta alternativa en flight list item */
.flight-item-route-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 10px !important;
    padding: 2px 6px !important;
    height: auto !important;
}

.flight-item-ground-transport {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #ff9800;
    margin-top: 4px;
}

.flight-item-ground-transport .v-icon {
    font-size: 14px;
}

.flight-item-total-cost {
    font-weight: 600;
    color: #232c6f;
}

/* ==========================================
   AI Extract Components
   ========================================== */

.ai-extract-section {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 10px 14px;
    margin-bottom: 16px;
    background: #f9fafc;
    border-radius: 8px;
    border: 1px solid #eee;
}

/* Global AI Extract banner (before tabs) */
.ai-extract-section.ai-extract-global {
    margin: 0 0 16px 0;
}

.ai-extract-btn {
    text-transform: none !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
}

.ai-extract-btn .v-icon {
    margin-right: 4px;
}

.ai-extract-preview-card {
    border-radius: 8px !important;
}

.ai-extract-preview-card .v-card-title {
    color: #232c6f;
    padding: 10px 16px !important;
    font-size: 13px;
    font-weight: 500;
    border-bottom: 1px solid #eee;
}

.ai-extract-preview-card .v-card-title .v-chip {
    font-size: 10px;
}

.extraction-sections .extraction-section {
    padding: 12px 8px !important;
}

.extraction-sections .v-list-item-title {
    font-weight: 400;
    font-size: 13px;
    margin-bottom: 6px;
}

.extraction-sections .v-list-item-subtitle {
    font-size: 12px;
    line-height: 1.5;
    opacity: 0.9;
}

.extraction-sections .v-list-item-subtitle strong {
    color: #333;
    font-weight: 500;
}

/* Loading state */
.ai-extract-btn.v-btn--loading {
    pointer-events: none;
}

.mdi-spin {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* AI Extract Modal Component */
.ai-extract-modal-section {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #eee;
    display: flex;
    justify-content: center;
}

.ai-extract-trigger-btn {
    text-transform: none !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    font-size: 12px !important;
    border-radius: 6px !important;
    border-color: #232c6f !important;
}

.ai-extract-trigger-btn:hover {
    background: #232c6f !important;
    color: #fff !important;
}

.ai-extract-modal-card {
    border-radius: 12px !important;
    overflow: hidden;
    display: flex !important;
    flex-direction: column !important;
    max-height: 85vh !important;
    background: #fff !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18) !important;
}

.ai-extract-modal-card > .v-card-text {
    overflow-y: auto !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
}

.ai-extract-modal-card > .v-card-title,
.ai-extract-modal-card > .v-card-actions {
    flex-shrink: 0 !important;
}

/* Header - clean minimal style matching file-dialog */
.ai-extract-modal-header {
    background: #fff !important;
    color: #232c6f !important;
    padding: 10px 16px !important;
    min-height: 44px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    border-bottom: 1px solid #e8e8e8 !important;
}

.ai-extract-modal-header .v-icon {
    color: #232c6f !important;
    font-size: 20px !important;
}

.ai-extract-modal-header .v-btn {
    color: #999 !important;
    flex-shrink: 0 !important;
}

.ai-extract-modal-header .v-btn:hover {
    color: #333 !important;
}

/* Drag & Drop Zone */
.ai-extract-dropzone {
    border: 2px dashed #d0d4e4;
    border-radius: 10px;
    padding: 36px 16px;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
    background: #f9fafc;
}

.ai-extract-dropzone:hover {
    border-color: #232c6f;
    background: #f0f2ff;
}

.ai-extract-dropzone.dragging {
    border-color: #232c6f;
    border-style: solid;
    background: #eef1fb;
    transform: scale(1.005);
}

.ai-extract-dropzone.has-files {
    padding: 20px 16px;
}

/* File list in modal */
.ai-extract-file-list {
    background: #f9fafc !important;
    border-radius: 8px;
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #eee !important;
}

.ai-extract-file-item {
    border-bottom: 1px solid #eee;
}

.ai-extract-file-item:last-child {
    border-bottom: none;
}

/* Section cards in preview */
.ai-extract-modal-card .ai-extract-section-card {
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    overflow: hidden;
    box-shadow: none !important;
}

.ai-extract-modal-card .ai-extract-section-card .v-card-title {
    background: #f7f8fb !important;
    color: #333 !important;
    padding: 6px 12px !important;
    min-height: 40px !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    border-bottom: 1px solid #eee;
}

/* Override global selection-control height in section headers */
.ai-extract-modal-card .ai-extract-section-card .v-card-title .v-selection-control {
    height: auto !important;
    min-height: unset !important;
}

.ai-extract-modal-card .ai-extract-section-card .v-card-text {
    padding: 4px 12px 8px 12px !important;
}

/* Field rows inside section cards */
.ai-extract-modal-card .field-row {
    padding: 3px 0 !important;
    border-bottom: 1px solid #f3f3f3;
    min-height: 32px;
}

.ai-extract-modal-card .field-row:last-child {
    border-bottom: none;
}

/* Inactive field row (toggle OFF) - only label fades, value stays readable */
.ai-extract-modal-card .field-row.field-row-inactive .field-label {
    color: #bbb !important;
}

/* Field toggle icon button (replaces v-switch in field rows) */
.ai-extract-field-toggle {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    margin: 0 4px 0 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.ai-extract-field-toggle .v-icon {
    font-size: 16px !important;
}

.ai-extract-field-toggle:not(.ai-extract-field-toggle-active) .v-icon {
    color: #bbb !important;
}

.ai-extract-field-toggle-active {
    background-color: rgba(35, 44, 111, 0.08) !important;
}

.ai-extract-field-toggle.v-btn--disabled .v-icon {
    color: #e0e0e0 !important;
}

.ai-extract-modal-card .field-row .field-label {
    font-size: 11px;
    color: #888;
    min-width: 65px;
    width: 65px;
    flex-shrink: 0;
    cursor: pointer;
    user-select: none;
}

.ai-extract-modal-card .field-row .field-label:hover {
    color: #555;
}

.ai-extract-modal-card .field-row .field-value {
    font-size: 13px;
    color: #333;
    font-weight: 400;
    margin-left: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.ai-extract-modal-card .field-row .field-value.empty {
    color: #c0c0c0;
    font-weight: 400;
}

/* Clickable "Select Airport" link in field value */
.ai-extract-select-airport-link {
    color: #fb8c00 !important;
    cursor: pointer;
    user-select: none;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center;
    animation: airport-select-pulse 1.5s ease-in-out infinite;
}

.ai-extract-select-airport-link:hover {
    color: #e65100 !important;
}

@keyframes airport-select-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Disabled section content (section switch OFF) */
.ai-extract-section-disabled {
    pointer-events: none;
}

.ai-extract-section-disabled .field-label {
    color: #bbb !important;
    cursor: default !important;
}

.ai-extract-section-disabled .field-value {
    color: #bbb !important;
}

.ai-extract-section-disabled .ai-extract-field-toggle .v-icon {
    color: #e0e0e0 !important;
}

/* Footer actions */
.ai-extract-modal-card > .v-card-actions {
    background: #f9fafc !important;
    border-top: 1px solid #eee !important;
    padding: 10px 16px !important;
}

/* Processing step */
.ai-extract-processing {
    padding: 40px 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ai-extract-processing-animation {
    width: 120px;
    height: auto;
}

.ai-extract-processing .processing-label {
    font-size: 13px;
    font-weight: 400;
    color: #555;
    margin-top: 20px;
}

.ai-extract-processing .processing-sublabel {
    font-size: 12px;
    color: #999;
    margin-top: 4px;
}

.ai-extract-processing .processing-slow-warning {
    font-size: 12px;
    color: #c6007e;
    font-style: italic;
    margin-top: 8px;
}

/* Confidence badge in preview header */
.ai-extract-confidence-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px;
    background: #f7f8fb;
}

.ai-extract-confidence-bar .confidence-label {
    font-size: 12px;
    font-weight: 400;
    color: #555;
}

/* Warning alert in preview header (outside scroll area, always visible) */
.ai-extract-modal-card .ai-extract-warning {
    font-size: 12px;
    border-radius: 0 !important;
    margin: 0 !important;
}

/* Preview header: confidence bar + warning, fixed above scroll */
.ai-extract-preview-header {
    flex-shrink: 0 !important;
    border-bottom: 1px solid #eee;
}

.ai-extract-preview-header .ai-extract-warning {
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

/* Airport selection dialog */
.ai-extract-airport-dialog .v-card {
    border-radius: 10px !important;
}

.ai-extract-airport-dialog .v-card-title {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #333 !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid #eee;
}

.ai-extract-airport-option {
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    padding: 10px 12px;
    cursor: pointer;
    transition: all 0.15s ease;
    width: 100%;
    box-sizing: border-box;
    background: #fff;
}

/* Override global radio height AND width inside airport options */
.ai-extract-airport-option .v-selection-control.v-radio {
    height: auto !important;
    min-height: unset !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    flex: 0 0 24px !important;
}

.ai-extract-airport-option .v-selection-control__wrapper {
    width: 20px !important;
    height: 20px !important;
}

.ai-extract-airport-option:hover {
    border-color: #232c6f;
    background: #f7f8fb;
}

.ai-extract-airport-option.selected {
    border-color: #232c6f;
    background: #eef1fb;
}

/* Upload tabs */
.ai-extract-upload-tabs {
    min-height: unset !important;
}
.ai-extract-upload-tabs .v-tab {
    text-transform: none !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    min-width: unset !important;
    padding: 0 12px !important;
}

/* Text input tab */
.ai-extract-text-input {
    padding: 4px 0;
}
.ai-extract-textarea .v-field {
    font-size: 13px !important;
    border-radius: 8px !important;
}
.ai-extract-textarea textarea {
    min-height: 200px !important;
}
.ai-extract-text-hint {
    font-size: 11px;
    color: #aaa;
    margin-top: 6px;
    margin-bottom: 0;
}

/* Speech dictation bar */
.ai-extract-speech-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    padding: 4px 0;
}
.ai-extract-speech-status {
    font-size: 12px;
    color: #c6007e;
    font-weight: 400;
}
.ai-extract-speech-interim {
    font-weight: 400;
    color: #888;
    font-style: italic;
}
.ai-extract-speech-hint {
    font-size: 12px;
    color: #aaa;
}

/* Microphone pulse animation */
@keyframes mic-pulse {
    0% { box-shadow: 0 0 0 0 rgba(198, 0, 126, 0.4); }
    70% { box-shadow: 0 0 0 8px rgba(198, 0, 126, 0); }
    100% { box-shadow: 0 0 0 0 rgba(198, 0, 126, 0); }
}
.ai-extract-mic-pulse {
    animation: mic-pulse 1.5s infinite;
}

/* ---- AI Extract: Harmonized typography & color classes ---- */

/* Subtitle text (upload step description) */
.ai-extract-subtitle {
    font-size: 12px;
    color: #888;
}

/* Dropzone text */
.ai-extract-dropzone-text {
    font-size: 13px;
    font-weight: 400;
    color: #555;
    margin-top: 8px;
    margin-bottom: 2px;
}

.ai-extract-dropzone-hint {
    font-size: 11px;
    color: #aaa;
}

/* File list items */
.ai-extract-file-icon {
    color: #232c6f;
}

.ai-extract-file-name {
    font-size: 13px;
    font-weight: 400;
}

.ai-extract-file-size {
    font-size: 11px;
    color: #aaa;
}

.ai-extract-file-remove {
    color: #ccc;
}

/* Error & info alerts */
.ai-extract-error-alert,
.ai-extract-info-alert {
    font-size: 12px;
    border-radius: 8px;
}

/* Back to upload button */
.ai-extract-back-btn {
    text-transform: none;
    color: #888;
    font-size: 11px;
}

/* Warning alert content */
.ai-extract-warning-title {
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 2px;
}

.ai-extract-warning-list {
    list-style-type: disc;
}

.ai-extract-warning-list li {
    font-size: 12px;
}

.ai-extract-warning-body {
    font-size: 12px;
    color: inherit;
}

/* Section titles (Origin, Destination, Packages, Customs) */
.ai-extract-section-title {
    font-size: 13px;
    font-weight: 500;
    color: #333;
}

.ai-extract-section-icon {
    color: #232c6f;
}

.ai-extract-section-switch {
    transform: scale(0.85);
}

/* Confidence & status chips */
.ai-extract-chip {
    font-size: 10px;
}

/* Field row icons */
.ai-extract-field-icon {
    color: #bbb;
}

/* Wider field label (for packages) */
.field-label-wide {
    min-width: 85px;
    width: 85px;
}

/* Cancel and confirm action buttons */
.ai-extract-cancel-btn {
    text-transform: none;
    color: #888;
}

.ai-extract-confirm-btn {
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0;
    border-radius: 6px;
}

/* Airport dialog */
.ai-extract-airport-card {
    border-radius: 10px;
    overflow: hidden;
}

.ai-extract-airport-header {
    font-size: 13px;
    font-weight: 500;
    color: #333;
    padding: 12px 16px;
    border-bottom: 1px solid #eee;
}

.ai-extract-airport-header .v-icon {
    color: #232c6f;
}

.ai-extract-airport-body {
    padding: 16px;
}

.ai-extract-airport-hint {
    font-size: 12px;
    color: #888;
    margin-bottom: 12px;
}

.ai-extract-airport-group {
    width: 100%;
}

.ai-extract-airport-info {
    min-width: 0;
}

.ai-extract-airport-code {
    font-size: 13px;
    font-weight: 500;
    color: #232c6f;
}

.ai-extract-airport-name {
    font-size: 11px;
    color: #888;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ai-extract-airport-actions {
    padding: 10px 16px;
    border-top: 1px solid #eee;
    background: #f9fafc;
}

/* ---- AI Extract: Audio Tab ---- */
.ai-extract-audio-container {
    min-height: 200px;
    padding: 8px 0;
}

.ai-extract-record-btn {
    width: 72px !important;
    height: 72px !important;
    border-radius: 50% !important;
}

.ai-extract-record-pulse {
    animation: record-pulse 1.5s infinite;
}

@keyframes record-pulse {
    0% { box-shadow: 0 0 0 0 rgba(198, 0, 126, 0.5); }
    70% { box-shadow: 0 0 0 16px rgba(198, 0, 126, 0); }
    100% { box-shadow: 0 0 0 0 rgba(198, 0, 126, 0); }
}

.ai-extract-recording-timer {
    font-size: 24px;
    font-weight: 600;
    font-family: monospace;
    color: #c6007e;
    margin-bottom: 4px;
}

.ai-extract-audio-hint {
    font-size: 13px;
    color: #555;
    margin: 0;
}

.ai-extract-audio-subhint {
    font-size: 11px;
    color: #999;
    margin: 0;
}

.ai-extract-audio-player {
    width: 100%;
    max-width: 320px;
    height: 36px;
}

.ai-extract-audio-divider {
    margin: 12px 0;
}

/* El v-divider de Vuetify trae `flex: 1 1 100%`, que la clase utilitaria
   flex-grow-1 NO anula (solo cambia flex-grow). Con dos dividers pidiendo
   cada uno el 100% del ancho, el flexbox comprime el <span> central al mínimo
   y el texto "or upload an audio file" se rompe/deforma. Forzamos que el texto
   no encoja ni haga wrap, y que los dividers absorban el espacio restante. */
.ai-extract-audio-divider > span {
    flex: 0 0 auto;
    white-space: nowrap;
    line-height: 1;
}

.ai-extract-audio-divider > .v-divider {
    flex: 1 1 0;
    align-self: center;
}

/* =============================================
   Advanced Filter Dialog - Shipment List
   ============================================= */

.shipment-list-advanced-filter-dialog .advanced-filter-content {
    padding: 0 20px 16px 20px;
    min-height: 200px;
}

.shipment-list-advanced-filter-dialog .v-tabs-window-item {
    padding-top: 16px;
}

.shipment-list-advanced-filter-dialog .filter-field-wrapper {
    margin-bottom: 16px;
}

.shipment-list-advanced-filter-dialog .filter-field-row {
    display: flex;
    gap: 12px;
}

.shipment-list-advanced-filter-dialog .filter-field-row > * {
    flex: 1;
}

.shipment-list-advanced-filter-dialog .filter-checkbox-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.shipment-list-advanced-filter-dialog .advanced-filter-actions {
    padding: 8px 16px;
}

/* Advanced Filter Button - App Bar */
.appbar-filter-col {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
}

.appbar-filter-badge {
    overflow: visible !important;
}

.appbar-filter-badge .v-badge__badge {
    font-size: 10px !important;
    min-width: 18px !important;
    height: 18px !important;
    line-height: 18px !important;
    padding: 0 4px !important;
}

.appbar-form-lading-page button.v-btn.appbar-advanced-filter-btn {
    color: #FFF !important;
    width: 36px !important;
    height: 36px !important;
}

.appbar-advanced-filter-btn .v-icon {
    font-size: 22px !important;
    color: #FFF !important;
}

/* ========================================
   Promo Carousel Component Styles
   ======================================== */

.promo-carousel-wrapper {
    margin-top: 24px;
    margin-bottom: 16px;
    padding: 0 8px;
}

.promo-carousel {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.promo-carousel .v-carousel__controls {
    background: transparent;
}

.promo-carousel .v-carousel__controls .v-btn {
    color: rgba(255, 255, 255, 0.8);
}

.promo-carousel .v-carousel__controls .v-btn--active {
    color: #fff;
}

.promo-slide {
    position: relative;
    overflow: hidden;
}

.promo-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.3) 50%,
        rgba(0, 0, 0, 0.7) 100%
    );
    z-index: 1;
}

.promo-content {
    position: relative;
    z-index: 2;
    padding: 24px;
    color: #fff;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.promo-title {
    color: #fff !important;
    margin-bottom: 8px;
    font-weight: 700 !important;
}

.promo-subtitle {
    color: rgba(255, 255, 255, 0.9) !important;
    margin-bottom: 16px;
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.promo-cta {
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    .promo-carousel-wrapper {
        padding: 0 4px;
        margin-top: 16px;
    }

    .promo-carousel {
        border-radius: 12px;
    }

    .promo-content {
        padding: 16px;
    }

    .promo-title {
        font-size: 1.1rem !important;
    }

    .promo-subtitle {
        font-size: 0.875rem !important;
        max-width: 100%;
    }

    .promo-cta {
        font-size: 0.75rem !important;
    }
}

/* ========================================
   Address Dialog Component Styles
   ======================================== */

/* Dialog card */
.address-dialog-component {
    border-radius: 8px !important;
    overflow: hidden;
}

/* Compact toolbar title */
.address-dialog-component .address-dialog-toolbar {
    min-height: 44px !important;
    height: 44px !important;
}

.address-dialog-component .address-dialog-toolbar .v-toolbar__content {
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 12px !important;
}

.address-dialog-component .address-dialog-toolbar .v-toolbar-title {
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 0.01em;
}

/* Content area */
.address-dialog-component .address-dialog-content {
    max-height: 70vh;
    overflow-y: auto;
}

/* Country selector chip */
.address-dialog-component .country-selector {
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
    cursor: pointer;
    min-width: 72px;
    transition: background-color 0.2s ease;
}

.address-dialog-component .country-selector:hover {
    background: #eeeeee;
}

.address-dialog-component .country-flag {
    flex: 0 0 24px;
    border-radius: 2px;
}

.address-dialog-component .country-code {
    font-weight: 500;
    font-size: 13px;
    color: #424242;
}

/* Country autocomplete */
.address-dialog-component .country-autocomplete {
    max-width: 160px;
    min-width: 160px;
}

/* Google search field */
.address-dialog-component .google-search-field {
    min-width: 200px;
}

/* Form fields - consistent sizing */
.address-dialog-component .address-field .v-field__input {
    font-size: 14px !important;
    font-weight: 400 !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    min-height: 36px !important;
}

.address-dialog-component .address-field input {
    font-size: 14px !important;
    font-weight: 400 !important;
}

.address-dialog-component .address-field .v-label.v-field-label {
    font-size: 13px !important;
    font-weight: 400 !important;
}

.address-dialog-component .address-field .v-field-label--floating {
    font-size: 11px !important;
    font-weight: 400 !important;
}

/* Zip code field width */
.address-dialog-component .zip-field {
    max-width: 110px;
    min-width: 110px;
}

/* Phone field width */
.address-dialog-component .phone-field {
    max-width: 140px;
    min-width: 140px;
}

/* Normalize all form fields font-weight */
.address-dialog-component .v-field__input,
.address-dialog-component .v-field input,
.address-dialog-component .v-label.v-field-label {
    font-weight: 400 !important;
}

.address-dialog-component .v-field-label--floating {
    font-weight: 400 !important;
}

/* Text captions and labels */
.address-dialog-component .text-caption {
    font-weight: 400;
    font-size: 12px !important;
}

/* Ensure autocomplete items have normal weight */
.address-dialog-component .v-list-item-title {
    font-weight: 400 !important;
    font-size: 14px !important;
}

/* Chip text - normal weight */
.address-dialog-component .v-chip {
    font-weight: 400 !important;
}

/* Needs review highlight */
.address-dialog-component .needs-review .v-field__outline {
    border-color: #fb8c00 !important;
}

.address-dialog-component .needs-review .v-field__outline__start,
.address-dialog-component .needs-review .v-field__outline__end,
.address-dialog-component .needs-review .v-field__outline__notch::before,
.address-dialog-component .needs-review .v-field__outline__notch::after {
    border-color: #fb8c00 !important;
}

/* Action buttons */
.address-dialog-component .v-card-actions .v-btn {
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.02em;
    text-transform: none !important;
}

/* Divider spacing */
.address-dialog-component .v-divider {
    opacity: 0.6;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    .address-dialog-component .d-flex.ga-2 {
        flex-wrap: wrap;
    }

    .address-dialog-component .country-autocomplete,
    .address-dialog-component .google-search-field {
        min-width: 100% !important;
        max-width: 100% !important;
    }

    .address-dialog-component .zip-field,
    .address-dialog-component .phone-field {
        min-width: 100px;
        max-width: 100px;
    }
}

/* ============================================
   Address Dual Dialog Component
   - Popup con tabs para PKP/DST combinados
   ============================================ */

.address-dual-dialog-component {
    overflow: hidden;
}

/* Toolbar styling (mismo que address-dialog) */
.address-dual-dialog-component .address-dialog-toolbar {
    min-height: 48px !important;
    height: 48px !important;
}

.address-dual-dialog-component .address-dialog-toolbar .v-toolbar__content {
    min-height: 48px !important;
    height: 48px !important;
    padding: 0 8px !important;
}

.address-dual-dialog-component .address-dialog-toolbar .v-toolbar-title {
    font-size: 14px !important;
    font-weight: 500 !important;
}

/* Content area */
.address-dual-dialog-component .address-dialog-content {
    max-height: 70vh;
    overflow-y: auto;
}

/* Country selector */
.address-dual-dialog-component .country-selector {
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
    cursor: pointer;
    transition: background-color 0.2s;
    flex-shrink: 0;
}

.address-dual-dialog-component .country-selector:hover {
    background: #eeeeee;
}

.address-dual-dialog-component .country-flag {
    border-radius: 2px;
}

.address-dual-dialog-component .country-code {
    font-size: 13px;
    font-weight: 400;
}

.address-dual-dialog-component .country-autocomplete {
    max-width: 150px;
    flex-shrink: 0;
}

/* Google search field */
.address-dual-dialog-component .google-search-field {
    min-width: 200px;
}

/* Tabs wrapper - center tabs */
.address-dual-dialog-component .address-tabs-wrapper {
    display: flex;
    justify-content: center;
    margin-bottom: 12px;
}

/* Main Pickup/Delivery tabs styling */
.address-dual-dialog-component .address-tabs {
    background: transparent;
    border: none !important;
    border-radius: 0;
    padding: 0;
    min-height: 36px !important;
}

.address-dual-dialog-component .address-tabs .v-tab {
    text-transform: none !important;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.2px;
    min-width: 90px;
    min-height: 36px !important;
    border-radius: 0 !important;
    transition: all 0.15s ease;
    color: #9e9e9e !important;
    border-bottom: 2px solid transparent;
}

.address-dual-dialog-component .address-tabs .v-tab:hover {
    color: #232c6f !important;
    background: transparent;
}

.address-dual-dialog-component .address-tabs .v-tab--selected {
    color: #232c6f !important;
    font-weight: 500;
    border-bottom-color: #232c6f !important;
    background: transparent !important;
}

.address-dual-dialog-component .address-tabs .v-tab--selected .v-icon {
    color: #232c6f !important;
}

.address-dual-dialog-component .address-tabs .v-tab__slider {
    display: none !important;
}

.address-dual-dialog-component .address-tabs .v-tab.tab-complete {
    color: #2e7d32 !important;
}

.address-dual-dialog-component .address-tabs .v-tab.tab-complete.v-tab--selected {
    border-bottom-color: #2e7d32 !important;
}

.address-dual-dialog-component .address-tabs .v-tab.tab-complete .v-icon {
    color: #2e7d32 !important;
}

.address-dual-dialog-component .address-tabs .v-tab.tab-disabled {
    color: #bdbdbd !important;
    opacity: 0.6;
}

/* Address fields */
.address-dual-dialog-component .address-field .v-field__input {
    font-size: 13px;
    font-weight: 400;
    padding-top: 8px !important;
    padding-bottom: 4px !important;
    min-height: 36px;
}

.address-dual-dialog-component .address-field input {
    font-size: 13px !important;
    font-weight: 400 !important;
}

.address-dual-dialog-component .address-field .v-label.v-field-label {
    font-size: 13px;
    font-weight: 400;
}

.address-dual-dialog-component .address-field .v-field-label--floating {
    font-size: 11px;
}

/* Zip field - compact width */
.address-dual-dialog-component .zip-field {
    min-width: 70px;
    max-width: 80px;
    flex-shrink: 0;
}

/* Zip field in collapsed mode */
.address-dual-dialog-component .zip-field-collapsed {
    min-width: 100px;
    max-width: 140px;
}

.address-dual-dialog-component .phone-field {
    min-width: 100px;
    max-width: 120px;
    flex-shrink: 0;
}

/* Disabled section styling */
.address-dual-dialog-component .disabled-section {
    opacity: 0.5;
    pointer-events: none;
}

/* Normalize font weights */
.address-dual-dialog-component .v-field__input,
.address-dual-dialog-component .v-field input,
.address-dual-dialog-component .v-label.v-field-label {
    font-weight: 400 !important;
}

.address-dual-dialog-component .v-field-label--floating {
    font-weight: 400 !important;
}

.address-dual-dialog-component .text-caption {
    font-weight: 400;
}

/* Form fields in expanded mode - underlined variant */
.address-dual-dialog-component .expanded-mode .v-text-field .v-field--variant-underlined {
    background: transparent;
}

.address-dual-dialog-component .expanded-mode .v-text-field .v-field--variant-underlined::before {
    border-color: #d0d0d0;
}

.address-dual-dialog-component .expanded-mode .v-text-field .v-field--variant-underlined:hover::before {
    border-color: #232c6f;
}

.address-dual-dialog-component .expanded-mode .v-text-field .v-field--focused::before {
    border-color: #232c6f !important;
}

.address-dual-dialog-component .expanded-mode .v-text-field .v-field__input {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    min-height: 32px !important;
}

.address-dual-dialog-component .expanded-mode .v-field__prepend-inner {
    padding-right: 8px !important;
    color: #9e9e9e !important;
}

.address-dual-dialog-component .expanded-mode .v-field__prepend-inner .v-icon {
    font-size: 18px !important;
    opacity: 0.7;
}

/* Needs review indicator (orange border) */
.address-dual-dialog-component .needs-review .v-field__outline {
    color: #ff9800 !important;
}

.address-dual-dialog-component .needs-review .v-field__outline__start,
.address-dual-dialog-component .needs-review .v-field__outline__end,
.address-dual-dialog-component .needs-review .v-field__outline__notch::before,
.address-dual-dialog-component .needs-review .v-field__outline__notch::after {
    border-color: #ff9800 !important;
}

/* Needs review for underlined variant */
.address-dual-dialog-component .needs-review .v-field--variant-underlined::before {
    border-color: #ff9800 !important;
}

.address-dual-dialog-component .needs-review .v-field--variant-underlined .v-field__input {
    color: #e65100;
}

/* Checkbox styling */
.address-dual-dialog-component .v-checkbox .v-label {
    font-size: 13px;
    font-weight: 400;
}

/* Action buttons */
.address-dual-dialog-component .v-card-actions {
    background: #fafafa;
    border-top: 1px solid #e8e8e8;
}

.address-dual-dialog-component .v-card-actions .v-btn {
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0.2px;
    border-radius: 8px !important;
}

.address-dual-dialog-component .v-card-actions .v-btn--variant-text {
    color: #666;
}

.address-dual-dialog-component .v-card-actions .v-btn--variant-text:hover {
    background: rgba(0,0,0,0.04);
}

/* Primary action button */
.address-dual-dialog-component .v-card-actions .v-btn.bg-primary {
    box-shadow: 0 2px 8px rgba(35, 44, 111, 0.25);
}

.address-dual-dialog-component .v-card-actions .v-btn.bg-success {
    box-shadow: 0 2px 8px rgba(46, 125, 50, 0.25);
}

/* Dividers */
.address-dual-dialog-component .v-divider {
    opacity: 0.5;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    .address-dual-dialog-component .d-flex.ga-2 {
        flex-wrap: wrap;
    }

    .address-dual-dialog-component .country-autocomplete,
    .address-dual-dialog-component .google-search-field {
        min-width: 100% !important;
        max-width: 100% !important;
    }

    .address-dual-dialog-component .zip-field,
    .address-dual-dialog-component .phone-field {
        min-width: 100px;
        max-width: 100px;
    }

    .address-dual-dialog-component .address-tabs .v-tab {
        min-width: 80px;
        font-size: 12px;
    }
}

/* ======= NEW: Toolbar with Country + Google Search ======= */

/* Country selector in toolbar - pill style */
.address-dual-dialog-component .country-selector-toolbar {
    background: rgba(255, 255, 255, 0.18);
    cursor: pointer;
    transition: all 0.2s ease;
    border-radius: 16px;
    padding: 4px 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.address-dual-dialog-component .country-selector-toolbar:hover {
    background: rgba(255, 255, 255, 0.28);
    border-color: rgba(255, 255, 255, 0.35);
}

.address-dual-dialog-component .country-selector-toolbar .v-img {
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.address-dual-dialog-component .country-selector-toolbar .text-body-2 {
    font-weight: 500 !important;
    letter-spacing: 0.3px;
}

/* Country autocomplete in toolbar */
.address-dual-dialog-component .country-autocomplete-toolbar {
    max-width: 150px;
}

.address-dual-dialog-component .country-autocomplete-toolbar .v-field {
    background: rgba(255, 255, 255, 0.15) !important;
    border-radius: 16px !important;
}

.address-dual-dialog-component .country-autocomplete-toolbar .v-field__input {
    color: white !important;
    font-size: 13px;
    font-weight: 500;
    padding: 4px 12px !important;
    min-height: 32px !important;
}

.address-dual-dialog-component .country-autocomplete-toolbar .v-field__input::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.address-dual-dialog-component .country-autocomplete-toolbar .v-field__append-inner {
    padding: 0 8px !important;
}

/* Google search in toolbar - white background */
.address-dual-dialog-component .google-search-toolbar {
    margin-left: 4px;
    margin-right: 8px;
    max-height: 32px !important;
}

.address-dual-dialog-component .google-search-toolbar .v-input__control {
    min-height: 32px !important;
    height: 32px !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field {
    background: #fff !important;
    border-radius: 6px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    height: 32px !important;
    padding: 0 !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field__field {
    min-height: 32px !important;
    height: 32px !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field__input {
    color: #333 !important;
    font-size: 13px;
    padding: 0 4px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field__input input {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: 32px !important;
    height: 32px !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field__input::placeholder {
    color: #999 !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field__prepend-inner {
    padding-left: 8px !important;
    padding-right: 4px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-items: center;
}

.address-dual-dialog-component .google-search-toolbar .v-field__prepend-inner .v-icon {
    color: #666 !important;
    font-size: 18px !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field__clearable {
    padding-right: 6px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    height: 32px !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field__clearable .v-icon {
    color: #999 !important;
    font-size: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.address-dual-dialog-component .google-search-toolbar .v-field__append-inner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Toolbar divider styling */
.address-dual-dialog-component .address-dialog-toolbar .v-divider--vertical {
    height: 20px !important;
    align-self: center;
}

/* ======= NEW: Collapsible fields mode ======= */

/* Collapsed mode styling */
.address-dual-dialog-component .collapsed-mode {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 8px;
    background: transparent;
    border: none;
    position: relative;
}

.address-dual-dialog-component .collapsed-mode .v-text-field {
    flex-grow: 0;
}

/* Expand button - just icon, positioned right */
.address-dual-dialog-component .collapsed-mode .expand-btn {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

/* Expanded mode styling */
.address-dual-dialog-component .expanded-mode {
    padding: 8px 0;
    background: transparent;
    border: none;
}

/* Inner tabs wrapper - centered */
.address-dual-dialog-component .inner-tabs-wrapper {
    display: flex;
    justify-content: center;
    position: relative;
    margin-bottom: 12px;
}

/* Collapse button - positioned right */
.address-dual-dialog-component .collapse-btn {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

/* Inner tabs (address/contact icons) - matching app style */
.address-dual-dialog-component .inner-tabs {
    border-radius: 0 !important;
    background: transparent !important;
    min-height: 28px !important;
    height: 28px !important;
    border: none !important;
}

.address-dual-dialog-component .inner-tabs .v-slide-group__content {
    gap: 24px;
    justify-content: center;
}

.address-dual-dialog-component .inner-tabs .v-tab {
    min-width: 72px !important;
    min-height: 28px !important;
    height: 28px !important;
    padding: 0 16px !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

.address-dual-dialog-component .inner-tabs .v-tab:first-child {
    border-right: none;
}

.address-dual-dialog-component .inner-tabs .v-tab .v-icon,
.address-dual-dialog-component .inner-tabs .v-tab i {
    color: #9e9e9e !important;
    font-size: 18px !important;
    opacity: 0.5;
    transition: color 0.2s ease, opacity 0.2s ease;
}

.address-dual-dialog-component .inner-tabs .v-tab:hover .v-icon,
.address-dual-dialog-component .inner-tabs .v-tab:hover i {
    color: #777 !important;
    opacity: 0.7;
}

.address-dual-dialog-component .inner-tabs .v-tab--selected .v-icon,
.address-dual-dialog-component .inner-tabs .v-tab--selected i {
    color: #c6007e !important;
    opacity: 1;
}

.address-dual-dialog-component .inner-tabs .v-tab--selected:hover .v-icon,
.address-dual-dialog-component .inner-tabs .v-tab--selected:hover i {
    color: #c6007e !important;
    opacity: 1;
}

.address-dual-dialog-component .inner-tabs .v-tab__slider {
    display: none !important;
}

/* Inner tabs window padding */
.address-dual-dialog-component .expanded-mode .v-tabs-window {
    padding-top: 8px !important;
}

/* ======= Transitions and animations ======= */

/* Smooth tab content transitions */
.address-dual-dialog-component .v-tabs-window-item {
    transition: opacity 0.15s ease, transform 0.15s ease;
}

/* Collapse/expand button animation */
.address-dual-dialog-component .collapsed-mode .v-btn,
.address-dual-dialog-component .expanded-mode .v-btn[icon] {
    transition: transform 0.2s ease, background-color 0.2s ease;
}

.address-dual-dialog-component .collapsed-mode .v-btn:hover,
.address-dual-dialog-component .expanded-mode .v-btn[icon]:hover {
    transform: scale(1.05);
}

/* Alert styling */
.address-dual-dialog-component .v-alert {
    border-radius: 8px !important;
    font-size: 13px;
}

.address-dual-dialog-component .v-alert.v-alert--density-compact {
    padding: 8px 12px !important;
}

/* Services results list styling */
.address-dual-dialog-component .services-section {
    background: #fafafa;
    border-radius: 12px;
    padding: 12px;
    border: 1px solid #e8e8e8;
}

.address-dual-dialog-component .services-section .v-list {
    background: transparent !important;
}

.address-dual-dialog-component .service-list-item {
    border-radius: 8px !important;
    margin-bottom: 4px;
    transition: background-color 0.15s ease;
}

.address-dual-dialog-component .service-list-item:hover {
    background: rgba(35, 44, 111, 0.04);
}

.address-dual-dialog-component .service-list-item.v-list-item--active {
    background: rgba(35, 44, 111, 0.08) !important;
}

/* Progress linear styling */
.address-dual-dialog-component .v-progress-linear {
    border-radius: 2px;
}

/* Card content area */
.address-dual-dialog-component .address-dialog-content {
    background: #fff;
}

/* Dialog shadow and border radius */
.address-dual-dialog-component.v-card {
    border-radius: 16px !important;
    overflow: hidden;
}

/* Source selector (Google/Rubrica toggle) in toolbar */
.address-dual-dialog-component .address-dialog-toolbar .search-source-selector {
    height: 32px;
    flex-shrink: 0;
}

.address-dual-dialog-component .address-dialog-toolbar .source-selector-native-btn {
    background: transparent;
    height: 32px;
    min-width: 38px;
    padding: 0 4px;
    border: none;
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 0.2s ease;
}

.address-dual-dialog-component .address-dialog-toolbar .source-selector-native-btn:hover {
    background: rgba(255, 255, 255, 0.15);
}

.address-dual-dialog-component .address-dialog-toolbar .source-selector-native-btn .source-select-book-icon {
    color: #FFF;
}

.address-dual-dialog-component .address-dialog-toolbar .source-selector-native-btn .source-select-arrow {
    color: rgba(255, 255, 255, 0.7);
}

.address-dual-dialog-component .address-dialog-toolbar .source-select-icon img {
    filter: brightness(2);
}

/* Edit Both Addresses button in confirmation */
.edit-both-addresses-wrapper {
    margin: 8px 0;
}

.edit-both-addresses-wrapper .v-btn {
    text-transform: none;
    font-weight: 400;
    letter-spacing: normal;
}

/* Map Component Dialog - Toolbar Alignment */
.v-dialog--fullscreen .v-toolbar {
    background-color: #232C6F !important;
    color: white !important;
}

.v-dialog--fullscreen .v-toolbar .v-toolbar__content {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 16px !important;
}

.v-dialog--fullscreen .v-toolbar .v-toolbar-title {
    flex: 0 0 auto !important;
    margin: 0 !important;
    color: white !important;
}

.v-dialog--fullscreen .v-toolbar .v-spacer {
    flex: 1 1 auto !important;
}

.v-dialog--fullscreen .v-toolbar .v-btn {
    color: white !important;
}

/* Mobile UX Optimizations */
@media (max-width: 600px) {
    /* WCAG 2.1: Minimum touch target size 44x44px */
    .v-dialog--fullscreen .v-btn {
        min-height: 44px !important;
        min-width: 44px !important;
        padding: 8px !important;
    }

    .v-toolbar .v-btn[class*="icon"] {
        width: 48px !important;
        height: 48px !important;
    }

    /* Optimize bottom sheet for small screens */
    .v-bottom-sheet {
        max-height: 70vh !important;
    }

    /* Faster animations on mobile for better performance */
    .v-dialog--fullscreen,
    .v-bottom-sheet,
    .map-loading-overlay {
        animation-duration: 0.25s !important;
    }

    /* Remove hover effects on mobile */
    .v-btn:hover,
    .v-list-item:hover {
        transform: none !important;
        background-color: inherit !important;
    }

    /* Make map controls more accessible */
    .gm-control-active {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

/* Tablet optimizations */
@media (min-width: 601px) and (max-width: 960px) {
    .v-dialog--fullscreen .v-btn {
        min-height: 40px !important;
        min-width: 40px !important;
    }
}
.toggle-address-fields-wrapper {
    display: flex;
    justify-content: center;
}

.toggle-address-btn {
    opacity: 0.6;
}

.toggle-address-btn:hover {
    opacity: 1;
}

/* Align the autocomplete field vertically */
.search-place-component .v-field__append-inner {
    align-items: center !important;
    padding-top: 0 !important;
}

/* Wrapper del search place - flex para autocomplete + selector lado a lado */
.search-place-wrapper {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    border-radius: 4px !important;
    overflow: hidden !important;
}

.search-place-wrapper > .search-place-component {
    flex: 1 !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

/* Quitar border-radius del autocomplete — el wrapper con overflow:hidden lo gestiona */
.search-place-wrapper > .search-place-component .v-field {
    border-radius: 4px !important;
}

/* Componente selector de fuente (dentro de search-place-wrapper, junto al v-autocomplete) */
.search-source-selector {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    height: 35px;
    position: relative;
    z-index: 10;
}

/* Botón nativo selector de fuente - sin Vuetify v-btn para evitar conflictos de estilos */
.source-selector-native-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    height: 35px;
    min-width: 44px;
    padding: 0 6px;
    margin: 0 0 0 -1px !important;
    background: #FFF;
    border: none;
    border-radius: 0;
    cursor: pointer;
    outline: none;
    transition: background 0.15s;
}

.source-selector-native-btn:hover {
    background: #f5f5f5;
}

.source-selector-native-btn:active {
    background: #e8e8e8;
}

/* Ícono de Google Maps en el botón */
.source-select-icon {
    height: 22px !important;
    width: 22px !important;
}

.source-select-icon img {
    height: 22px !important;
    width: 22px !important;
}

/* Ícono de libro en el botón nativo */
.source-selector-native-btn .source-select-book-icon {
    color: rgba(198, 0, 126, 1);
    font-size: 20px;
}

/* Flecha del dropdown en el botón nativo */
.source-selector-native-btn .source-select-arrow {
    color: #999;
    font-size: 14px;
    margin-left: -2px;
}

/* Menú desplegable */
.source-selector-menu {
    min-width: 180px !important;
}

/* Alinear todos los íconos prepend en el menú al mismo ancho fijo */
.source-selector-menu .v-list-item__prepend {
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 10px !important;
    padding: 0 !important;
}

/* Quitar gap extra que Vuetify agrega al prepend */
.source-selector-menu .v-list-item__prepend > .v-list-item__spacer {
    display: none !important;
}

/* icon-external-image-component wrapper dentro del prepend */
.source-selector-menu .v-list-item__prepend .icon-image-wrapper {
    width: 20px !important;
    height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Ícono de Google Maps en el menú */
.source-selector-menu .source-menu-item-icon,
.source-selector-menu .source-menu-item-icon img,
.source-selector-menu .source-menu-item-icon .icon-image-wrapper,
.source-selector-menu .source-menu-item-icon .icon-image-wrapper img {
    height: 20px !important;
    width: 20px !important;
}

/* Ícono de libro en el menú */
.source-selector-menu .source-menu-item-book-icon {
    color: rgba(198, 0, 126, 1) !important;
    font-size: 20px !important;
    width: 20px !important;
    height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Express App Bar — country flag + ISO code */
.v-app-bar .express-country-flag-wrapper {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    margin: 0px 6px !important;
    padding-top: 0px !important;
}

.v-app-bar .express-country-iso {
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #fff !important;
    letter-spacing: 0.5px !important;
    line-height: 1 !important;
    margin-top: 2px !important;
}

.v-app-bar .express-country-divider {
    font-size: 16px !important;
    color: rgba(255,255,255,0.7) !important;
    padding-top: 4px !important;
    margin: 0px 2px !important;
}

/* ---- Registration: Accordion ---- */
.register-accordion {
    border: none !important;
    box-shadow: none !important;
    width: 100%;
    margin-bottom: 8px;
}
.register-accordion-panel {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.register-accordion-panel::after {
    display: none !important;
}
.register-accordion-title {
    padding: 0 !important;
    min-height: 36px !important;
    background: transparent !important;
    color: inherit !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}
.register-accordion-title:hover,
.register-accordion-title:focus,
.register-accordion-title:active,
.register-accordion-title--active {
    background: transparent !important;
}
.register-accordion-title .v-expansion-panel-title__overlay {
    display: none !important;
}
.register-accordion-text > .v-expansion-panel-text__wrapper {
    padding: 8px 0 0 0 !important;
}

/* ============================================
   Navigation Tabs (Bottom Bar)
   ============================================ */
.nav-tabs-wrapper {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.bttom-navigation .bottom-left-wrapper .nav-tabs-wrapper .nav-tab-icon.v-btn {
    height: 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    border-radius: 50% !important;
    color: #232c6f !important;
}

.bttom-navigation .bottom-left-wrapper .nav-tabs-wrapper .nav-tab-icon.v-btn span.v-btn__content i {
    color: #232c6f !important;
    height: 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    font-size: 24px !important;
}

.bttom-navigation .bottom-left-wrapper .nav-tabs-wrapper .nav-tab-icon.nav-tab-active.v-btn {
    color: #FFF !important;
}

.bttom-navigation .bottom-left-wrapper .nav-tabs-wrapper .nav-tab-icon.nav-tab-active.v-btn span.v-btn__content i {
    color: #FFF !important;
}

/* ============================================
   Flight Select Button
   ============================================ */
.flight-select-btn.v-btn {
    min-width: 28px !important;
    width: 28px !important;
    height: 28px !important;
    padding: 0 !important;
    margin-left: 4px !important;
    border-radius: 50% !important;
}

.flight-price-text {
    font-weight: 600;
    font-size: 14px;
    white-space: nowrap;
}

.flight-price-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

/* Hover on flight items */
.flight-list-item.item:hover {
    background-color: rgba(48, 83, 163, 0.04);
}

/* ============================================
   Express Select Button
   ============================================ */
.express-select-wrapper {
    display: flex;
    align-items: center;
    margin-left: 6px;
}

.express-select-btn.v-btn {
    min-width: 28px !important;
    width: 28px !important;
    height: 28px !important;
    padding: 0 !important;
    border-radius: 50% !important;
}

/* Hover on express items */
.advanced-service-list-component .express-item:hover {
    background-color: rgba(48, 83, 163, 0.04);
    cursor: pointer;
}

/* Adjust express item-wrapper-top to fit select button */
.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div.item-wrapper-top>div.express-price {
    width: auto;
    flex-shrink: 0;
}

.advanced-service-list-component .v-virtual-scroll__item>div.express-item>div.v-list-item__content>div.item-wrapper>div.item-wrapper-top>div.express-service-name {
    flex: 1;
    min-width: 0;
}

/* ============================================
   Realtime filter dialog (refactor 2026-05-06)
   Reset de los estilos legacy heredados de
   `.advanced-realtime-flight-list-filter-dialog-component .*`
   que peleaban con el layout nuevo + normalizacion de
   paddings uniformes en todo el modal.
   Margen estandar:
     - Header / footer: 12px
     - Body de cada tab (filters-wrapper): 16px
     - Sin padding extra en range-wrapper o filter-wrapper
   ============================================ */
.advanced-realtime-flight-list-filter-dialog-component .v-card.realtime-filter-dialog-card {
    border-radius: 8px;
    overflow: hidden;
}

/* v-card-text: anular padding heredado para que cada tab
   controle el suyo via .pa-4 (16px). */
.advanced-realtime-flight-list-filter-dialog-component .v-card.realtime-filter-dialog-card > .v-card-text {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

/* IMPORTANTE: legacy aplicaba `.filters-wrapper { padding: 0 12px }`
   que sumaba al `pa-4` del template Y la specificity (0,2,0) del legacy
   le ganaba al `.pa-4 !important` de Vuetify (0,1,0).
   Forzamos el padding correcto aqui (16px en todos los lados) con la
   misma specificity que el legacy + !important para ganar sobre ambos. */
.advanced-realtime-flight-list-filter-dialog-component .filters-wrapper {
    padding: 16px !important;
}
/* En el tab Airlines no usamos pa-4 (search bar y lista llevan su
   propio padding). Excluir ese caso para no romper la lista virtual. */
.advanced-realtime-flight-list-filter-dialog-component .filters-wrapper:has(.airline-search-wrapper) {
    padding: 0 !important;
}

/* Filter wrapper sin padding extra (el contenedor pa-4 ya da 16px).
   Range-wrapper SI necesita padding lateral interno (10px) para que el
   thumb del slider (20px diametro) no quede pegado al borde y el
   thumb-label centrado en el thumb tenga espacio para no desbordar. */
.advanced-realtime-flight-list-filter-dialog-component .filter-wrapper {
    padding: 0 !important;
    margin: 0;
}
.advanced-realtime-flight-list-filter-dialog-component .range-wrapper {
    padding: 0 10px !important;
    /* margin-top: deja respiracion vertical entre el label del filtro y el
       slider; cuando el usuario arrastra el thumb aparece el thumb-label
       flotante encima (~30px de alto) que sin este espacio quedaria
       superpuesto al label del filtro de arriba. 28px es el minimo seguro
       para acomodar el globo + un pequeño respiro visual. */
    margin: 28px 0 0 !important;
}

/* Mismo fix para el published filter dialog (mismo patron de filter-label
   + range-wrapper + slider con thumb-label flotante en interaccion).
   El v-dialog de Vuetify renderiza su contenido como overlay adjunto al body
   (teleport), por lo que el selector descendiente `.advanced-published-...`
   puede no hacer match dependiendo del modo de teleport. Usamos selector
   directo sobre `.published-filter-dialog-card` (clase propia del v-card
   interno) y `.filter-wrapper .range-wrapper` con !important para ganar
   a la regla legacy `.filter-wrapper .range-wrapper { margin-top: 30px }`.
   Aplica a TODOS los sliders del dialog (Price Range, Max Transit Days,
   Min Validity Days) que usan la clase `.range-wrapper` uniformemente. */
.advanced-published-flight-list-filter-dialog-component .range-wrapper,
.published-filter-dialog-card .range-wrapper,
.published-filter-dialog-card .filter-wrapper .range-wrapper {
    padding: 0 10px !important;
    margin-top: 28px !important;
}

/* Toolbar (header) - mismo padding que v-card-actions footer (12px). */
.advanced-realtime-flight-list-filter-dialog-component .v-toolbar {
    background: transparent !important;
    border: 0 !important;
    padding: 0 12px !important;
    height: 48px !important;
    min-height: 48px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-toolbar .v-toolbar-title {
    text-align: left !important;
    color: rgba(0, 0, 0, 0.87) !important;
    font-size: 1rem !important;
    line-height: 1.4 !important;
    padding: 0 !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-card-actions {
    padding: 12px !important;
    background: transparent !important;
    border: 0 !important;
    min-height: 0 !important;
}

/* v-tabs density="compact" da --v-tabs-height:36px PERO el v-slide-group__container
   interno crece segun el alto de los v-tab. v-tab usa --v-btn-height:48px por
   defecto (density-default heredado del v-btn), inflando el container a ~94px.
   Forzamos 36px en TODOS los niveles de la cascada (tabs > slide-group >
   container > content > tab) para garantizar la altura compacta. */
.advanced-realtime-flight-list-filter-dialog-component .v-tabs,
.advanced-realtime-flight-list-filter-dialog-component .v-tabs .v-slide-group,
.advanced-realtime-flight-list-filter-dialog-component .v-tabs .v-slide-group__container,
.advanced-realtime-flight-list-filter-dialog-component .v-tabs .v-slide-group__content {
    --v-tabs-height: 36px !important;
    --v-btn-height: 36px !important;
    min-height: 36px !important;
    height: 36px !important;
    max-height: 36px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-tabs .v-tab {
    --v-btn-height: 36px !important;
    min-height: 36px !important;
    height: 36px !important;
    max-height: 36px !important;
    padding: 0 8px !important;
    font-size: 12px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-tabs .v-tab .v-btn__content {
    height: 36px !important;
    line-height: 36px !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-tabs .v-tab .v-icon {
    font-size: 16px !important;
}

/* Range sliders: dejar que Vuetify maneje su propio padding interno.
   No forzar 0 — eso causaba que el thumb quedase pegado al borde. */
.advanced-realtime-flight-list-filter-dialog-component .v-range-slider {
    padding: 0;
}

/* Los labels min/max debajo del slider tambien necesitan el mismo padding
   lateral para alinearse con los extremos del slider. */
.advanced-realtime-flight-list-filter-dialog-component .range-wrapper > .d-flex.justify-space-between {
    padding: 0;
}

/* Thumb label estandar (azul TMWE) */
.advanced-realtime-flight-list-filter-dialog-component .v-slider-thumb__label {
    background: rgb(48, 83, 163) !important;
    color: #fff !important;
    font-size: 11px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2) !important;
}

.advanced-realtime-flight-list-filter-dialog-component .v-slider-thumb__label::before {
    color: rgb(48, 83, 163) !important;
}

/* Labels alineadas a la izquierda (anula text-align: center legacy). */
.advanced-realtime-flight-list-filter-dialog-component .filter-label,
.advanced-realtime-flight-list-filter-dialog-component .filter-label label,
.advanced-realtime-flight-list-filter-dialog-component .filter-label-row,
.advanced-realtime-flight-list-filter-dialog-component .filter-label-row label {
    text-align: left !important;
    color: rgba(0, 0, 0, 0.87);
    font-weight: 500;
}

/* Filter label row: titulo del filtro + valor actual seleccionado en la
   misma linea (space-between). Reemplaza el thumb-label="always" del
   v-range-slider que desbordaba el card. */
.advanced-realtime-flight-list-filter-dialog-component .filter-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-label-row > label {
    margin: 0;
    flex: 0 0 auto;
}

.advanced-realtime-flight-list-filter-dialog-component .filter-label-row > span {
    color: rgb(48, 83, 163);
    font-weight: 500;
    white-space: nowrap;
    flex: 0 1 auto;
}

/* Day-of-week pills: 7 chips horizontales que reemplazan los
   v-checkbox verticales del diseño anterior. */
.day-of-week-row {
    display: flex;
    justify-content: space-between;
    gap: 4px;
    width: 100%;
}

.day-of-week-pill {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    border-radius: 6px;
    border: 1px solid rgba(48, 83, 163, 0.3);
    color: rgb(48, 83, 163);
    background: #fff;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    user-select: none;
}

.day-of-week-pill input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.day-of-week-pill:hover:not(.active) {
    background-color: rgba(48, 83, 163, 0.06);
}

.day-of-week-pill.active {
    background-color: #c6007e;
    border-color: #c6007e;
    color: #fff;
}

/* Search bar dentro del tab Airlines (paralelo al tab Service) */
.airline-search-wrapper {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

/* ============================================================================
   Address from sede (my-place) — read-only card
   ============================================================================ */
.address-from-sede {
    width: 100%;
}

.address-from-sede .sede-card {
    border-radius: 8px;
    padding: 8px 4px;
}

.address-from-sede .sede-card-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1rem;
    font-weight: 500;
    padding-bottom: 4px;
}

.address-from-sede .sede-icon {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.address-from-sede .sede-icon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.address-from-sede .sede-card-text {
    padding-top: 4px;
    padding-bottom: 4px;
}

.address-from-sede .sede-line {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 0;
    font-size: 0.95rem;
    color: rgba(0, 0, 0, 0.85);
}

.address-from-sede .sede-line .v-icon {
    color: rgba(0, 0, 0, 0.55);
    flex-shrink: 0;
}

.address-from-sede .sede-name strong {
    font-weight: 600;
}

.address-from-sede .sede-flag {
    width: 20px;
    height: auto;
    border-radius: 2px;
    flex-shrink: 0;
}

.address-from-sede .sede-readonly-hint {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 6px 12px 8px;
    padding: 6px 10px;
    border-top: 1px dashed rgba(0, 0, 0, 0.12);
    font-size: 0.78rem;
    color: rgba(0, 0, 0, 0.55);
    font-style: italic;
}

/* ── Transición suave al cambiar de modo cargo<->express (navegación
   client-side). is_switching_mode se activa un frame en switch_mode()
   para hacer fade-in del contenido en vez de un salto brusco. ── */
.main-container.mode-switching {
    opacity: 0;
}
.main-container {
    transition: opacity 180ms ease-in-out;
}

/* ============================================================
   Fase 4 — Mejoras de estética y responsive (UI lists/CRM)
   Añadido al final para no interferir con reglas previas.
   ============================================================ */

/* --- Cards clicables: descubribilidad (cursor + hover) --- */
/* .crm-ticket-card ya tiene hover propio; aquí solo el item de cargo. */
.cargo-item {
    cursor: pointer;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}
.cargo-list-component div.item .v-card.cargo-item:hover {
    background-color: rgba(33, 99, 175, 0.06);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

/* --- Barra de filtros sticky en listas largas --- */
.shipment-list-header-wrapper,
.crm-status-filter {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #fff;
}

/* --- Chips de filtros activos (Fase 2): un poco de aire --- */
.shipment-list-active-filters,
.crm-active-filters {
    padding: 4px 8px;
}

/* --- Alert de error de carga (Fase 1): asegurar ancho cómodo --- */
.shipment-list-error,
.crm-list-error {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

/* --- Touch targets >= 44px en móvil (accesibilidad WCAG) --- */
@media (max-width: 600px) {
    .cargo-item .v-card-actions .v-btn,
    .crm-ticket-card .v-btn {
        min-height: 44px;
        min-width: 44px;
    }
}

/* --- Offset de la lista reducido en móvil/tablet: más espacio vertical --- */
@media (max-width: 768px) {
    .shipment-list-component .shipment-list-wrapper div.v-infinite-scroll {
        --shipment-list-offset: 200px;
    }
    .crm-list-component .crm-list-wrapper div.v-infinite-scroll {
        --crm-list-offset: 170px;
    }
}
@media (max-width: 480px) {
    .shipment-list-component .shipment-list-wrapper div.v-infinite-scroll {
        --shipment-list-offset: 170px;
    }
    .crm-list-component .crm-list-wrapper div.v-infinite-scroll {
        --crm-list-offset: 150px;
    }
}