/* ── SEARCH HERO ── */
.search-hero{background:linear-gradient(135deg,var(--navy) 0%,#00204a 100%);padding:24px 20px 0;position:relative;}
.search-hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:24px;background:var(--bg);border-radius:14px 14px 0 0;}
.hero-inner{max-width:1080px;margin:0 auto;padding:0 16px;}
.hero-tag{font-size:11px;color:rgba(255,255,255,0.5);font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px;}
.hero-h1{font-size:26px;font-weight:700;color:white;margin-bottom:3px;letter-spacing:-.02em;}
.hero-sub{font-size:13px;color:rgba(255,255,255,0.55);margin-bottom:20px;}

.search-form{background:white;border-radius:10px 10px 0 0;padding:16px 16px 0;box-shadow:0 -4px 16px rgba(0,0,0,0.12);position:relative;z-index:1;}
.sf-row{display:grid;grid-template-columns:1fr 1fr 160px 160px auto;gap:8px;align-items:end;padding-bottom:14px;}

/* Two-row form layout */
.sf-row2{display:grid;grid-template-columns:240px 32px 1fr;gap:8px;align-items:end;padding-bottom:12px;}
.sf-row3{display:grid;grid-template-columns:180px 160px 1fr;gap:8px;align-items:end;padding-bottom:14px;}
.sf-field{display:flex;flex-direction:column;}
.sf-field-pod{display:flex;flex-direction:column;flex:1;}
.sf-arrow{display:flex;align-items:flex-end;padding-bottom:10px;justify-content:center;}
.sf-search-btn-wrap{display:flex;align-items:flex-end;}

.sf-label{font-size:10px;font-weight:600;color:var(--text3);letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px;display:block;}
.sf-input,.sf-select{width:100%;background:#f0f3f7;border:1.5px solid #dde2ea;border-radius:6px;padding:9px 12px;font-family:var(--sans);font-size:13px;font-weight:500;color:var(--text);outline:none;transition:border-color .15s;appearance:none;}
.sf-input:focus,.sf-select:focus{border-color:var(--accent);background:white;box-shadow:0 0 0 3px rgba(0,113,194,0.12);}
.sf-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' stroke='%238a8a8a' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px;}
.sf-btn{background:var(--yellow);color:var(--navy);border:none;border-radius:6px;padding:10px 24px;font-family:var(--sans);font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;white-space:nowrap;height:40px;transition:background .15s;width:100%;justify-content:center;}
.sf-btn:hover{background:var(--yellow2);}
.sf-btn svg{width:15px;height:15px;}

/* POD autocomplete */
.pod-wrap{position:relative;}
.pod-input{box-sizing:border-box;}
.pod-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:white;border:1.5px solid var(--accent);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,0.15);z-index:200;max-height:280px;overflow-y:auto;}
.pod-item{display:flex;align-items:center;gap:10px;padding:9px 12px;cursor:pointer;border-bottom:1px solid var(--border);transition:background .1s;}
.pod-item:last-child{border-bottom:none;}
.pod-item:hover,.pod-item.active{background:#eaf1ff;}
.pod-item-flag{font-size:16px;flex-shrink:0;}
.pod-item-code{font-size:11px;font-family:var(--mono);font-weight:700;color:var(--navy);flex-shrink:0;min-width:46px;}
.pod-item-name{font-size:13px;font-weight:500;color:var(--text);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pod-item-country{font-size:11px;color:var(--text3);flex-shrink:0;}

/* Selected port chip */
.pod-selected{display:flex;align-items:center;gap:6px;background:#eaf1ff;border:1.5px solid var(--accent);border-radius:6px;padding:8px 12px;cursor:default;}
.pod-selected-flag{font-size:16px;}
.pod-selected-code{font-size:12px;font-family:var(--mono);font-weight:700;color:var(--navy);}
.pod-selected-name{font-size:13px;font-weight:500;color:var(--text);flex:1;}
.pod-clear{background:none;border:none;font-size:16px;color:var(--text3);cursor:pointer;padding:0 2px;line-height:1;flex-shrink:0;}
.pod-clear:hover{color:var(--red);}
.hidden{display:none!important;}

/* ── LAYOUT ── */
.page-body{max-width:1080px;margin:0 auto;padding:20px 16px;}
.body-grid{display:grid;grid-template-columns:260px 1fr;gap:18px;}

/* ── FILTER ── */
.filter-panel{background:white;border-radius:8px;border:1px solid var(--border);padding:16px;height:fit-content;position:sticky;top:56px;}
.fp-title{font-size:14px;font-weight:700;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border);}
.fp-section{margin-bottom:18px;}
.fp-section-title{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;}
.filter-option{display:flex;align-items:center;gap:8px;padding:5px 0;cursor:pointer;}
.filter-option input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent);cursor:pointer;flex-shrink:0;}
.filter-option label{font-size:13px;color:var(--text2);cursor:pointer;flex:1;}
.fo-count{font-size:11px;font-family:var(--mono);color:var(--text3);}
.fp-range{width:100%;accent-color:var(--accent);margin:6px 0;}
.fp-range-vals{display:flex;justify-content:space-between;font-size:11px;font-family:var(--mono);color:var(--text3);}
.fp-reset-row{border-top:1px solid var(--border);padding-top:12px;margin-top:4px;}
.fp-reset-btn{width:100%;padding:8px;background:transparent;border:1px solid var(--border2);border-radius:5px;font-family:var(--sans);font-size:12px;font-weight:600;cursor:pointer;color:var(--text2);}
.fp-reset-btn:hover{background:var(--bg3);}

/* ── API STRIP ── */
.api-strip{background:white;border-radius:8px;border:1px solid var(--border);padding:10px 14px;display:flex;align-items:center;gap:14px;margin-bottom:14px;flex-wrap:wrap;}
.api-strip-label{font-size:11px;font-weight:700;color:var(--text2);}
.api-source{display:flex;align-items:center;gap:6px;font-size:11px;font-family:var(--mono);}
.api-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.api-dot.live{background:var(--green);animation:blink 2s infinite;}
.api-dot.manual{background:#999;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.4}}
.api-label{color:var(--text3);}
.api-source-name{color:var(--text2);font-weight:500;}
.api-divider{width:1px;height:14px;background:var(--border);}
.api-updated{margin-left:auto;font-size:11px;font-family:var(--mono);color:var(--text3);}

/* ── RESULTS ── */
.results-header{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.results-count{font-size:15px;font-weight:700;}
.results-sort{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text2);}
.sort-btn{padding:5px 10px;border-radius:4px;border:1px solid var(--border2);background:white;font-size:12px;font-weight:500;cursor:pointer;font-family:var(--sans);transition:all .15s;}
.sort-btn.active{background:var(--navy);color:white;border-color:var(--navy);}
.sort-btn:hover:not(.active){background:var(--bg3);}

/* ── CTA ── */
.cta-banner{background:linear-gradient(90deg,var(--navy) 0%,#004b90 100%);border-radius:8px;padding:16px 20px;display:flex;align-items:center;gap:16px;margin-bottom:18px;}
.cta-text{}
.cta-title{font-size:14px;font-weight:700;color:white;margin-bottom:2px;}
.cta-sub{font-size:12px;color:rgba(255,255,255,0.6);}
.cta-btn{padding:9px 18px;background:var(--yellow);color:var(--navy);border:none;border-radius:5px;font-family:var(--sans);font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;flex-shrink:0;}
.cta-btn:hover{background:var(--yellow2);}

/* ── RESULT CARD ── */
.result-card{background:white;border-radius:8px;border:1px solid var(--border);margin-bottom:10px;overflow:hidden;transition:border-color .15s,box-shadow .15s;}
.result-card:hover{border-color:var(--accent);box-shadow:0 2px 12px rgba(0,113,194,0.12);}
.result-card.best-value{border-color:var(--yellow);border-width:2px;}
.rc-badge{background:var(--yellow);color:var(--navy);font-size:10px;font-weight:700;padding:4px 10px;letter-spacing:.04em;display:inline-block;}
.rc-body{padding:14px 16px;display:grid;grid-template-columns:200px 1fr 110px 100px 150px;gap:12px;align-items:center;}
.rc-carrier{display:flex;align-items:center;gap:10px;}
.rc-carrier-logo{width:40px;height:40px;border-radius:8px;background:#f0f3f7;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);flex-shrink:0;font-size:10px;font-family:var(--mono);font-weight:700;color:var(--text2);}
.rc-carrier-name{font-size:13px;font-weight:700;margin-bottom:2px;}
.rc-carrier-sub{font-size:11px;color:var(--text3);}
.rc-port{font-size:15px;font-weight:700;font-family:var(--mono);}
.rc-port-name{font-size:10px;color:var(--text3);margin-top:1px;}
.rc-meta-row{display:flex;justify-content:space-between;font-size:11px;padding:3px 0;}
.rc-meta-key{color:var(--text3);}
.rc-meta-val{font-weight:500;font-family:var(--mono);}
.rc-price-area{text-align:right;}
.rc-price{font-size:22px;font-weight:700;color:var(--navy);}
.rc-price-blurred{font-size:22px;font-weight:700;color:var(--navy);filter:blur(7px);user-select:none;}
.rc-price-unit{font-size:11px;color:var(--text3);margin-top:1px;}
.rc-book-btn{display:block;width:100%;margin-top:8px;padding:9px 14px;background:var(--accent);color:white;border:none;border-radius:5px;font-family:var(--sans);font-size:13px;font-weight:700;cursor:pointer;text-align:center;transition:background .15s;}
.rc-book-btn:hover{background:var(--accent2);}
.rc-book-btn.login-req{background:var(--navy);}
.rc-book-btn.login-req:hover{background:var(--navy2);}
.rc-avail{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;padding:2px 6px;border-radius:3px;margin-top:6px;}
.rc-avail.ok{background:var(--green-bg);color:var(--green);}
.rc-avail.few{background:var(--amber-bg);color:var(--amber);}
.rc-avail.full{background:var(--red-bg);color:var(--red);}
.rc-avail-dot{width:5px;height:5px;border-radius:50%;}
.ok .rc-avail-dot{background:var(--green);}
.few .rc-avail-dot{background:var(--amber);}
.full .rc-avail-dot{background:var(--red);}

/* ── EXPAND ── */
.rc-expand{background:#fafafa;border-top:1px solid var(--border);padding:12px 16px;display:none;}
.rc-expand.open{display:block;}
.rc-expand-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.re-card{background:white;border:1px solid var(--border);border-radius:6px;padding:10px 12px;}
.re-label{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;}
.re-val{font-size:13px;font-weight:600;font-family:var(--mono);}
.rc-vessel-row{display:flex;align-items:center;gap:14px;margin-top:10px;padding-top:10px;border-top:1px solid var(--border);}
.vessel-leg{flex:1;background:white;border:1px solid var(--border);border-radius:6px;padding:10px 12px;}
.vl-title{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;}
.vl-name{font-size:13px;font-weight:600;margin-bottom:2px;}
.vl-meta{font-size:11px;color:var(--text2);font-family:var(--mono);}

/* ── LOCK OVERLAY ── */
.lock-row{background:#f9f9f9;border-top:1px dashed var(--border2);padding:10px 16px;font-size:12px;color:var(--text3);text-align:center;}
.lock-row a{color:var(--accent);font-weight:600;cursor:pointer;}

/* ── LANGUAGE SWITCHER ── */
.lang-switch{display:flex;align-items:center;gap:2px;background:rgba(0,0,0,0.12);border-radius:6px;padding:2px;margin-right:4px;}
.lang-btn{padding:3px 10px;border:none;background:transparent;border-radius:4px;font-family:var(--sans);font-size:11px;font-weight:700;color:rgba(255,255,255,0.5);cursor:pointer;transition:all .15s;}
.lang-btn.active{background:white;color:var(--navy);}
.lang-btn:not(.active):hover{color:rgba(255,255,255,0.85);}

/* ── POL CUSTOM SELECT ── */
.pol-wrap{position:relative;}
.pol-selected{display:flex;align-items:center;gap:8px;background:#f0f3f7;border:1.5px solid #dde2ea;border-radius:6px;padding:9px 12px;cursor:pointer;transition:border-color .15s;user-select:none;}
.pol-selected:hover,.pol-selected.open{border-color:var(--accent);background:white;box-shadow:0 0 0 3px rgba(0,113,194,0.12);}
.pol-flag{font-size:18px;line-height:1;flex-shrink:0;}
.pol-name{font-size:13px;font-weight:500;color:var(--text);flex:1;}
.pol-chevron{color:var(--text3);flex-shrink:0;transition:transform .2s;}
.pol-selected.open .pol-chevron{transform:rotate(180deg);}
.pol-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:white;border:1.5px solid var(--accent);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,0.15);z-index:200;overflow:hidden;}
.pol-item{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;border-bottom:1px solid var(--border);transition:background .1s;}
.pol-item:last-child{border-bottom:none;}
.pol-item:hover{background:#eaf1ff;}
.pol-item-flag{font-size:18px;flex-shrink:0;}
.pol-item-code{font-size:11px;font-family:var(--mono);font-weight:700;color:var(--navy);flex-shrink:0;min-width:46px;}
.pol-item-name{font-size:13px;font-weight:500;color:var(--text);}

/* ── POD CHIP EDIT UX ── */
.pod-selected{cursor:pointer;}
.pod-selected:hover{border-color:var(--accent);box-shadow:0 0 0 2px rgba(0,113,194,0.15);}
.pod-edit-hint{font-size:10px;color:var(--accent);margin-left:auto;margin-right:4px;opacity:0;transition:opacity .15s;white-space:nowrap;}
.pod-selected:hover .pod-edit-hint{opacity:1;}

/* ── POPULAR PORTS GROUP HEADER ── */
.pod-group-header{padding:5px 12px;font-size:9px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;background:#f8f9fa;border-bottom:1px solid var(--border);}

/* ── PROMO STRIP ── */
.promo-strip{background:linear-gradient(135deg,#0a1628 0%,#00204a 100%);padding:14px 0 18px;border-bottom:1px solid rgba(255,255,255,0.06);}
.promo-inner{max-width:1080px;margin:0 auto;padding:0 16px;}
.promo-heading{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.promo-tag-label{font-size:10px;font-weight:700;color:var(--yellow);font-family:var(--mono);letter-spacing:.12em;}
.promo-tag-sub{font-size:11px;color:rgba(255,255,255,0.35);}
.promo-scroll{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;}
.promo-scroll::-webkit-scrollbar{display:none;}
.promo-card{flex-shrink:0;width:180px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.12);border-radius:8px;padding:12px 14px;cursor:pointer;transition:background .15s,border-color .15s;user-select:none;}
.promo-card:hover{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.25);}
.pc-carrier{font-size:11px;font-weight:700;margin-bottom:5px;font-family:var(--mono);letter-spacing:.02em;}
.pc-route{font-size:12px;font-weight:600;color:rgba(255,255,255,0.85);margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pc-price{font-size:20px;font-weight:800;color:white;font-family:var(--mono);line-height:1;}
.pc-unit{font-size:10px;color:rgba(255,255,255,0.35);margin-top:2px;margin-bottom:4px;}
.pc-etd{font-size:10px;color:rgba(255,255,255,0.4);font-family:var(--mono);}

/* ── RATE BREAKDOWN ── */
.rc-breakdown{background:#f4f7fb;border:1px solid #d8e4f0;border-radius:6px;padding:7px 10px;margin:6px 0;text-align:left;}
.rc-bk-row{display:flex;justify-content:space-between;align-items:center;font-size:11px;padding:2px 0;gap:6px;}
.rc-bk-row .rc-bk-label{color:var(--text2);flex:1;}
.rc-bk-row .rc-bk-val{font-family:var(--mono);font-weight:600;color:var(--text);white-space:nowrap;}
.rc-bk-row.ocean .rc-bk-label{font-weight:700;color:var(--text);}
.rc-bk-row.sc .rc-bk-label{color:var(--text3);}
.rc-bk-row.sc .rc-bk-val{color:var(--text3);}
.rc-bk-total{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700;color:var(--navy);padding-top:5px;border-top:1px solid #c8d9ec;margin-top:3px;}
.rc-bk-total-val{font-family:var(--mono);font-size:14px;}
.rc-bk-valid{font-size:10px;color:var(--text3);text-align:right;margin-top:5px;font-family:var(--mono);padding-top:4px;border-top:1px solid var(--border);}
.rc-bk-valid span{color:var(--amber);font-weight:600;}
.rc-price-total{font-size:22px;font-weight:700;color:var(--navy);}
.rc-price-tba{font-size:22px;font-weight:700;color:var(--text3);letter-spacing:.08em;}
.rc-total-label{font-size:9px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:-2px;}

/* ── RESPONSIVE ── */
@media (max-width:768px) {
  /* Hero */
  .hero-h1{font-size:20px;}
  .hero-sub{font-size:12px;margin-bottom:14px;}

  /* Search form */
  .sf-row2{grid-template-columns:1fr;gap:6px;padding-bottom:8px;}
  .sf-arrow{display:none;}
  .sf-row3{grid-template-columns:1fr 1fr;gap:6px;padding-bottom:10px;}
  .sf-search-btn-wrap{grid-column:1/-1;}

  /* Layout — hide sidebar, full-width results */
  .body-grid{grid-template-columns:1fr;}
  .filter-panel{display:none;}

  /* API strip — wrap tightly */
  .api-strip{gap:8px;padding:8px 12px;}
  .api-divider{display:none;}
  .api-updated{margin-left:0;width:100%;}

  /* Result card — 2-col: carrier | price */
  .rc-body{
    grid-template-columns:1fr auto;
    grid-template-rows:auto auto;
    gap:8px;
    padding:12px 14px;
  }
  /* Row 1: carrier (col1) + price area (col2, spans both rows) */
  .rc-body > *:nth-child(1){grid-column:1;grid-row:1;}  /* carrier */
  .rc-body > *:nth-child(2){grid-column:1;grid-row:2;}  /* ports */
  .rc-body > *:nth-child(3){display:none;}               /* vessel meta */
  .rc-body > *:nth-child(4){display:none;}               /* avail badge */
  .rc-body > *:nth-child(5){grid-column:2;grid-row:1/3;} /* price area */

  .rc-price-area{min-width:120px;}
  .rc-price,.rc-price-blurred,.rc-price-total,.rc-price-tba{font-size:18px;}

  /* Expand grid — 2 cols */
  .rc-expand-grid{grid-template-columns:repeat(2,1fr);}

  /* CTA banner — stack */
  .cta-banner{flex-direction:column;align-items:flex-start;gap:10px;}
  .cta-btn{align-self:stretch;text-align:center;}

  /* Results header */
  .results-sort{font-size:11px;}
  .sort-btn{padding:4px 8px;font-size:11px;}
}

@media (max-width:480px) {
  .hero-h1{font-size:17px;}
  .promo-card{width:150px;}
  .pc-price{font-size:17px;}
  .rc-price,.rc-price-blurred,.rc-price-total,.rc-price-tba{font-size:16px;}
  .rc-price-area{min-width:100px;}
  .rc-book-btn{font-size:12px;padding:7px 10px;}
  .rc-expand-grid{grid-template-columns:1fr 1fr;}
  .re-val{font-size:12px;}
}