/* Hevrati task 12 — heavy logistics + moving on the website order card.
   ClickUp https://app.clickup.com/t/123mehfuz0g — used by IL/assets/js/freight.js.
   Only adds rules for new elements (pp-ff-*); the delivery form keeps its own look. */

/* ── the page's freight links and texts (menu, sections, FAQ): only once freight.js found the feature on
      (FreightEnabled = 1) and built the tabs - off, nothing on the page offers a job it cannot take ── */
body:not(.pp-freight-avail) .pp-freight-only {
    display: none !important;
}

/* ── the three tabs, in the card's existing title row ── */
.order_form_title.pp-ff-title {
    padding: 0 !important;
    font-size: 17px;
}

.pp-ff-tabs {
    display: flex;
    direction: rtl;
    height: 76px;
}

.pp-ff-tabs .pp-ff-tab {
    flex: 1 1 0;
    min-width: 0;
    height: 76px !important;
    margin: 0;
    padding: 0 6px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: #707070;
    font-family: 'Varela Round', 'Open Sans', sans-serif;
    font-size: 17px;
    line-height: 1.2;
    cursor: pointer;
    transition: background-color 150ms, color 150ms, border-color 150ms;
}

/* square bottom corners: the underline of the active tab stays straight */
.pp-ff-tabs .pp-ff-tab { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.pp-ff-tabs .pp-ff-tab:first-child { border-top-right-radius: 35px; }
.pp-ff-tabs .pp-ff-tab:last-child { border-top-left-radius: 35px; }

.pp-ff-tabs .pp-ff-tab:hover { color: #272626; }

.pp-ff-tabs .pp-ff-tab.active {
    background: #ffffff;
    color: #272626;
    border-bottom-color: #00fcff;
}

.pp-ff-tabs .pp-ff-tab:focus { outline: none; }
.pp-ff-tabs .pp-ff-tab:focus-visible { outline: 2px solid #272626; outline-offset: -5px; }

/* ── freight mode: the card grows with its content (delivery mode is untouched) ── */
.order-form-container.pp-ff-mode { height: auto !important; min-height: 720px; padding-bottom: 18px; }
.order-form-container.pp-ff-mode .order-form-container-height { height: auto !important; }
/* in the flow the bootstrap .row needs its normal width (the inline width:100% was for position:absolute) - centred like the delivery button */
.order-form-container.pp-ff-mode .pp-ff-submit-row { position: static !important; width: auto !important; margin-top: 8px; }

.pp-ff-fields .order_form_row { padding-top: 10px; }

.pp-ff-fields input[type="date"].new_input {
    padding-right: 72px;
    text-align: right;
}

/* the two hour boxes share one row: no icon, so no icon gutter */
.pp-ff-hours { padding-top: 0 !important; }
.pp-ff-hours .bootstrap-select .filter-option,
.pp-ff-hours .bootstrap-select .filter-option-inner-inner { padding-right: 18px !important; text-align: right; }
.pp-ff-hours .order_form_col:first-child { border-left: 1px solid #efeeee; }

.pp-ff-help {
    padding: 6px 14px 0 14px;
    color: #555555;
    font-family: 'Varela Round', 'Open Sans', sans-serif;
    font-size: 13px;
    line-height: 1.45;
    text-align: right;
}

.pp-ff-help b { color: #272626; font-weight: normal; }

/* the submit button keeps its delivery label (the site keeps updating #lblAmount in it);
   freight mode hides that label and shows its own */
#btnSubmit > .pp-ff-btn-label { display: none; }
/* "פרסום לנהגים ₪1,500" is longer than "הזמן שליחות": one line, a little smaller */
body.pp-ff-on #btnSubmit > .pp-ff-btn-label { display: inline; font-size: .75em; white-space: nowrap; }
body.pp-ff-on #btnSubmit > :not(.pp-ff-btn-label) { display: none !important; }

/* the permanent-routes list next to the card belongs to deliveries */
body.pp-ff-on #lstcouriers { display: none !important; }

/* ── the grey tag shown before a freight job (customer page) ── */
.pp-ff-chip {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 12px;
    background: #efeeee;
    color: #272626;
    font-family: 'Varela Round', 'Open Sans', sans-serif;
    font-size: 13px;
    line-height: 1.4;
}

/* ── the customer's page (link from SMS / email) ── */
#ppFreightModal { max-width: calc(100% - 24px); border-radius: 24px !important; overflow: hidden; border: 0; direction: rtl; text-align: right; }
#ppFreightModal .modal-header { background: #efeeee; border: 0; padding: 18px 22px; }
#ppFreightModal .modal-title { font-family: 'Varela Round', 'Open Sans', sans-serif; font-size: 22px; color: #272626; }
#ppFreightModal .modal-header .close { float: left; margin: 0; font-size: 28px; }
#ppFreightModal .modal-header .pp-ff-chip { background: #ffffff; }   /* stands out from the grey header */
#ppFreightModal .modal-body { padding: 18px 22px 22px; font-family: 'Varela Round', 'Open Sans', sans-serif; color: #272626; }

.pp-ff-status { margin: 4px 0 14px; padding: 12px 14px; border-radius: 12px; font-size: 16px; line-height: 1.45; }
.pp-ff-status.searching { background: #e6fbfb; }
.pp-ff-status.assigned, .pp-ff-status.on_the_way, .pp-ff-status.done { background: #eaf6e4; }
.pp-ff-status.expired, .pp-ff-status.canceled, .pp-ff-status.problem { background: #fbeee6; }

.pp-ff-details { width: 100%; margin-bottom: 14px; border-collapse: collapse; font-size: 15px; }
.pp-ff-details td { padding: 6px 0; border-bottom: 1px solid #efeeee; vertical-align: top; }
.pp-ff-details td:first-child { width: 34%; color: #707070; padding-left: 10px; }

.pp-ff-price-now { font-size: 15px; margin-bottom: 14px; }
.pp-ff-price-now b { font-size: 22px; font-weight: normal; }

.pp-ff-section-title { margin: 14px 0 8px; font-size: 17px; }

.pp-ff-bid {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    margin-bottom: 8px;
    border: 1px solid #e3e1e1;
    border-radius: 14px;
    background: #ffffff;
}

.pp-ff-bid .pp-ff-bid-who { flex: 1 1 auto; min-width: 0; font-size: 15px; line-height: 1.4; }
.pp-ff-bid .pp-ff-bid-who small { display: block; color: #707070; font-size: 13px; }
.pp-ff-bid .pp-ff-bid-price { font-size: 20px; white-space: nowrap; }

.pp-ff-btn {
    height: 44px !important;
    padding: 0 18px;
    border: 0;
    border-radius: 22px !important;
    background: #00fcff;
    color: #272626;
    font-family: 'Varela Round', 'Open Sans', sans-serif;
    font-size: 16px;
    cursor: pointer;
    white-space: nowrap;
}

.pp-ff-btn:hover { background: #04e9ec; }
.pp-ff-btn:active { background: #03d9dc; }
.pp-ff-btn[disabled] { opacity: .5; cursor: default; }

.pp-ff-raise { display: flex; gap: 10px; align-items: center; margin-top: 6px; }
.pp-ff-raise input {
    flex: 1 1 auto;
    min-width: 0;
    height: 44px;
    padding: 0 14px;
    border: 1px solid #d9d7d7;
    border-radius: 22px;
    font-family: 'Varela Round', 'Open Sans', sans-serif;
    font-size: 16px;
    direction: rtl;
}

.pp-ff-error { display: none; margin-top: 8px; color: #b3261e; font-size: 14px; }

/* an English customer (link with &lang=en) on the Hebrew page */
#ppFreightModal.pp-ff-ltr { direction: ltr; text-align: left; }
#ppFreightModal.pp-ff-ltr .modal-header .close { float: right; }
#ppFreightModal.pp-ff-ltr .pp-ff-details td:first-child { padding-left: 0; padding-right: 10px; }
#ppFreightModal.pp-ff-ltr .pp-ff-raise input { direction: ltr; }
#ppFreightModal.pp-ff-ltr .pp-ff-help { text-align: left; }

@media (max-width: 480px) {
    .pp-ff-tabs .pp-ff-tab { font-size: 15px; }
    .pp-ff-bid { flex-wrap: wrap; }
    .pp-ff-bid .pp-ff-btn { width: 100%; }
}