/* MRTB Fuel Dashboard — colours matched to murrayregionaltourism.com.au */

:root {
  --mfd-navy:      #1B3D72;
  --mfd-blue:      #2563AE;
  --mfd-blue-lt:   #3A8DC5;
  --mfd-blue-pale: #EBF3FB;
  --mfd-white:     #FFFFFF;
  --mfd-bg:        #F3F5F8;
  --mfd-border:    #DEE3EB;
  --mfd-border-md: #C4CEDC;
  --mfd-text:      #1A2333;
  --mfd-text-mid:  #495A6E;
  --mfd-text-lt:   #7A8FA0;
  --mfd-danger:    #C0392B;
  --mfd-danger-lt: #FDECEA;
  --mfd-warn:      #D68910;
  --mfd-warn-lt:   #FEF6E4;
  --mfd-safe:      #1A7A5E;
  --mfd-safe-lt:   #E6F5F1;
  --mfd-r:  8px;
  --mfd-r2: 12px;
  --mfd-r3: 18px;
  --mfd-sh: 0 1px 6px rgba(27,61,114,.07), 0 2px 16px rgba(27,61,114,.05);
  --mfd-sh2:0 4px 20px rgba(27,61,114,.12);
}

.mrtb-fuel-wrap * { box-sizing: border-box; margin: 0; padding: 0; font-family: Arial, sans-serif; }
.mrtb-fuel-wrap { background: var(--mfd-bg); color: var(--mfd-text); font-size: 14px; line-height: 1.55; border-radius: var(--mfd-r2); overflow: hidden; }

/* HEADER */
.mfd-header { background: var(--mfd-navy); padding: 0 24px; display: flex; align-items: center; justify-content: space-between; height: 60px; gap: 12px; flex-wrap: wrap; }
.mfd-brand  { display: flex; align-items: center; gap: 12px; }
.mfd-logo   { height: 30px; filter: brightness(0) invert(1); opacity: .92; }
.mfd-sep    { width: 1px; height: 24px; background: rgba(255,255,255,.2); }
.mfd-title  { font-size: 15px; font-weight: 700; color: #fff; }
.mfd-sub    { font-size: 10px; color: rgba(255,255,255,.45); text-transform: uppercase; letter-spacing: .04em; margin-top: 2px; }
.mfd-header-right { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }

.mfd-pill { font-size: 10px; font-weight: 600; padding: 3px 10px; border-radius: 99px; border: 1px solid; letter-spacing: .03em; }
.mfd-pill-live  { background: rgba(26,122,94,.25); border-color: rgba(26,122,94,.5); color: #5dd5b2; }
.mfd-pill-date  { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); color: rgba(255,255,255,.5); }
.mfd-pill-alert { background: rgba(192,57,43,.25); border-color: rgba(192,57,43,.5); color: #f5a49a; }

.mfd-refresh-badge { display: flex; align-items: center; gap: 6px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.15); border-radius: 99px; padding: 3px 11px; font-size: 10px; color: rgba(255,255,255,.5); }
.mfd-rdot { width: 6px; height: 6px; border-radius: 50%; background: #5dd5b2; animation: mfd-pulse 2s infinite; }
@keyframes mfd-pulse { 0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(93,213,178,.5)}60%{opacity:.6;box-shadow:0 0 0 5px rgba(93,213,178,0)} }
.mfd-rcd { font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }

/* HERO */
.mfd-hero { background: var(--mfd-navy); padding: 28px 24px 26px; border-bottom: 4px solid var(--mfd-blue); }
.mfd-hero-eyebrow { font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--mfd-blue-lt); margin-bottom: 8px; }
.mfd-hero-h1 { font-size: 32px; font-weight: 800; color: #fff; line-height: 1; margin-bottom: 8px; }
.mfd-hero-h1 span { color: var(--mfd-blue-lt); }
.mfd-hero-desc { font-size: 12px; color: rgba(255,255,255,.6); max-width: 520px; line-height: 1.6; }

/* LOADING / ERROR */
.mfd-loading { text-align: center; padding: 60px 20px; color: var(--mfd-text-mid); }
.mfd-spinner { width: 36px; height: 36px; border: 3px solid var(--mfd-border); border-top-color: var(--mfd-blue); border-radius: 50%; animation: mfd-spin .8s linear infinite; margin: 0 auto 16px; }
@keyframes mfd-spin { to { transform: rotate(360deg); } }
.mfd-error { background: var(--mfd-danger-lt); border: 1px solid rgba(192,57,43,.3); border-radius: var(--mfd-r); padding: 14px 18px; margin: 20px; color: var(--mfd-danger); font-size: 13px; }

/* TABS */
.mfd-tab-wrap { display: flex; gap: 3px; background: var(--mfd-white); border: 1px solid var(--mfd-border); border-radius: var(--mfd-r2); padding: 4px; width: fit-content; margin: 20px 20px 0; box-shadow: var(--mfd-sh); }
.mfd-tab { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 8px 20px; border-radius: var(--mfd-r); border: none; cursor: pointer; color: var(--mfd-text-mid); background: transparent; transition: all .18s; }
.mfd-tab:hover  { color: var(--mfd-blue); background: var(--mfd-blue-pale); }
.mfd-tab.active { background: var(--mfd-blue); color: #fff; box-shadow: 0 2px 10px rgba(37,99,174,.3); }

/* MAIN CONTENT AREA */
.mfd-view { padding: 20px; }
.mfd-g3  { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.mfd-g2  { display: grid; grid-template-columns: 1fr 1fr;       gap: 14px; margin-bottom: 14px; }
.mfd-g3b { display: grid; grid-template-columns: 1fr 1fr 1fr;   gap: 14px; margin-bottom: 14px; }
@media(max-width:1100px) { .mfd-g3,.mfd-g3b{grid-template-columns:1fr 1fr} }
@media(max-width:720px)  { .mfd-g3,.mfd-g2,.mfd-g3b{grid-template-columns:1fr} }

/* CARDS */
.mfd-card { background: var(--mfd-white); border: 1px solid var(--mfd-border); border-radius: var(--mfd-r2); padding: 18px 20px; box-shadow: var(--mfd-sh); }
.mfd-card-title { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--mfd-navy); display: flex; align-items: center; gap: 7px; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--mfd-border); }
.mfd-ct-tag { margin-left: auto; font-size: 9px; font-weight: 600; padding: 2px 7px; border-radius: 99px; text-transform: uppercase; letter-spacing: .04em; border: 1px solid; }
.mfd-tag-danger { background: var(--mfd-danger-lt); color: var(--mfd-danger); border-color: rgba(192,57,43,.3); }
.mfd-tag-warn   { background: var(--mfd-warn-lt);   color: var(--mfd-warn);   border-color: rgba(214,137,16,.3); }
.mfd-tag-safe   { background: var(--mfd-safe-lt);   color: var(--mfd-safe);   border-color: rgba(26,122,94,.3); }
.mfd-tag-blue   { background: var(--mfd-blue-pale); color: var(--mfd-blue);   border-color: rgba(37,99,174,.25); }
.mfd-tag-navy   { background: rgba(27,61,114,.08);  color: var(--mfd-navy);   border-color: rgba(27,61,114,.2); }

/* KPI STRIP */
.mfd-kpi-strip { display: grid; grid-template-columns: repeat(6,1fr); gap: 10px; margin-bottom: 16px; }
@media(max-width:1100px){ .mfd-kpi-strip{grid-template-columns:repeat(3,1fr)} }
@media(max-width:720px) { .mfd-kpi-strip{grid-template-columns:1fr 1fr} }
.mfd-kpi { background: var(--mfd-white); border: 1px solid var(--mfd-border); border-radius: var(--mfd-r2); padding: 14px 16px; box-shadow: var(--mfd-sh); border-top: 3px solid var(--mfd-border-md); }
.mfd-kpi.k-danger { border-top-color: var(--mfd-danger); }
.mfd-kpi.k-warn   { border-top-color: var(--mfd-warn); }
.mfd-kpi.k-safe   { border-top-color: var(--mfd-safe); }
.mfd-kpi.k-blue   { border-top-color: var(--mfd-blue); }
.mfd-kpi.k-navy   { border-top-color: var(--mfd-navy); }
.mfd-kpi.k-blt    { border-top-color: var(--mfd-blue-lt); }
.mfd-kpi-lbl { font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--mfd-text-lt); margin-bottom: 6px; }
.mfd-kpi-val { font-size: 28px; font-weight: 800; line-height: 1; color: var(--mfd-text); }
.mfd-kpi-val.danger { color: var(--mfd-danger); }
.mfd-kpi-val.warn   { color: var(--mfd-warn); }
.mfd-kpi-val.safe   { color: var(--mfd-safe); }
.mfd-kpi-val.blue   { color: var(--mfd-blue); }
.mfd-kpi-sub { font-size: 10px; color: var(--mfd-text-lt); margin-top: 4px; line-height: 1.4; }

/* ALERTS */
.mfd-alert { border-radius: var(--mfd-r); padding: 11px 14px; display: flex; align-items: flex-start; gap: 9px; margin-bottom: 12px; font-size: 12px; line-height: 1.65; color: var(--mfd-text-mid); border-left: 3px solid; }
.mfd-alert.mfd-alert-danger { background: var(--mfd-danger-lt); border-color: var(--mfd-danger); }
.mfd-alert.mfd-alert-warn   { background: var(--mfd-warn-lt);   border-color: var(--mfd-warn); }
.mfd-alert.mfd-alert-info   { background: var(--mfd-blue-pale); border-color: var(--mfd-blue); }
.mfd-alert strong { font-weight: 600; color: var(--mfd-text); }

/* SUPPLY TABLE */
.mfd-supply-tbl { width: 100%; border-collapse: collapse; font-size: 12px; }
.mfd-supply-tbl th { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--mfd-text-lt); padding: 0 8px 9px; border-bottom: 1px solid var(--mfd-border); text-align: left; }
.mfd-supply-tbl td { padding: 7px 8px; border-bottom: 1px solid rgba(27,61,114,.05); vertical-align: middle; }
.mfd-supply-tbl tr:last-child td { border: none; }
.mfd-supply-tbl tbody tr:hover td { background: var(--mfd-bg); }
.mfd-lga-cell { font-weight: 600; color: var(--mfd-navy); }
.mfd-chip { display: inline-block; font-size: 8px; font-weight: 700; padding: 1px 5px; border-radius: 3px; margin-left: 4px; }
.mfd-chip-nsw { background: var(--mfd-blue-pale); color: var(--mfd-blue); }
.mfd-chip-vic { background: rgba(27,61,114,.1); color: var(--mfd-navy); }
.mfd-price-high { font-weight: 700; font-size: 13px; color: var(--mfd-danger); }
.mfd-price-mid  { font-weight: 700; font-size: 13px; color: var(--mfd-warn); }
.mfd-price-ok   { font-weight: 700; font-size: 13px; color: var(--mfd-safe); }
.mfd-sp-out { display:inline-block;font-size:9px;font-weight:700;padding:2px 7px;border-radius:99px;background:var(--mfd-danger-lt);color:var(--mfd-danger);border:1px solid rgba(192,57,43,.3);text-transform:uppercase; }
.mfd-sp-low { display:inline-block;font-size:9px;font-weight:700;padding:2px 7px;border-radius:99px;background:var(--mfd-warn-lt);color:var(--mfd-warn);border:1px solid rgba(214,137,16,.3);text-transform:uppercase; }
.mfd-sp-ok  { display:inline-block;font-size:9px;font-weight:700;padding:2px 7px;border-radius:99px;background:var(--mfd-safe-lt);color:var(--mfd-safe);border:1px solid rgba(26,122,94,.3);text-transform:uppercase; }
.mfd-mini-spark { display:flex;align-items:flex-end;gap:1.5px;height:18px; }
.mfd-ms-bar { width:4px;border-radius:1px; }
.mfd-chg-up   { font-size:11px;font-weight:600;color:var(--mfd-danger);text-align:right; }
.mfd-chg-dn   { font-size:11px;font-weight:600;color:var(--mfd-safe);text-align:right; }
.mfd-chg-flat { font-size:11px;font-weight:600;color:var(--mfd-text-lt);text-align:right; }

/* RISK BARS */
.mfd-risk-row  { display:flex;align-items:center;gap:9px;margin-bottom:8px; }
.mfd-risk-row:last-child { margin:0; }
.mfd-risk-name { font-size:11px;color:var(--mfd-text-mid);min-width:105px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mfd-risk-track{ flex:1;height:6px;background:var(--mfd-bg);border-radius:99px;overflow:hidden;border:1px solid var(--mfd-border); }
.mfd-risk-fill { height:100%;border-radius:99px; }
.mfd-risk-num  { font-size:11px;font-weight:700;min-width:26px;text-align:right; }

/* DONUT LEGEND */
.mfd-donut-legend { display:flex;gap:12px;justify-content:center;margin-top:9px;flex-wrap:wrap; }
.mfd-dl-item { display:flex;align-items:center;gap:5px;font-size:11px;color:var(--mfd-text-mid); }
.mfd-dl-dot  { width:9px;height:9px;border-radius:50%; }

/* SOURCES */
.mfd-sources { display:flex;flex-direction:column;gap:8px; }
.mfd-src { display:flex;align-items:center;gap:7px;font-size:11px;color:var(--mfd-text-mid); }
.mfd-src-dot { width:7px;height:7px;border-radius:50%;flex-shrink:0; }
.mfd-src a { color:var(--mfd-blue);text-decoration:none; }
.mfd-src a:hover { text-decoration:underline; }

/* LGA PICKER */
.mfd-lga-picker { display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px; }
.mfd-lga-btn { font-size:11px;font-weight:600;padding:5px 13px;border-radius:99px;border:1px solid var(--mfd-border-md);background:var(--mfd-white);color:var(--mfd-text-mid);cursor:pointer;display:flex;align-items:center;gap:5px;box-shadow:var(--mfd-sh);transition:all .15s; }
.mfd-lga-btn:hover  { border-color:var(--mfd-blue);color:var(--mfd-blue);background:var(--mfd-blue-pale); }
.mfd-lga-btn.active { background:var(--mfd-blue);border-color:var(--mfd-blue);color:#fff;box-shadow:0 2px 10px rgba(37,99,174,.3); }
.mfd-lga-sdot { width:7px;height:7px;border-radius:50%;flex-shrink:0; }

/* LGA HERO */
.mfd-lga-hero { background:var(--mfd-navy);border-radius:var(--mfd-r3);padding:22px 26px;margin-bottom:14px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;box-shadow:var(--mfd-sh2);border-left:5px solid var(--mfd-blue); }
.mfd-lga-hero.h-out { border-left-color:var(--mfd-danger); }
.mfd-lga-hero.h-low { border-left-color:var(--mfd-warn); }
.mfd-lga-hero.h-ok  { border-left-color:var(--mfd-safe); }
.mfd-lh-name { font-size:26px;font-weight:800;color:#fff;line-height:1; }
.mfd-lh-sub  { font-size:11px;color:rgba(255,255,255,.45);margin-top:3px; }
.mfd-lh-status { font-weight:600; }
.mfd-lh-status.out { color:#f5a49a; }
.mfd-lh-status.low { color:#f7d070; }
.mfd-lh-status.ok  { color:#5dd5b2; }
.mfd-lh-kpis { display:flex;gap:9px;flex-wrap:wrap; }
.mfd-lh-kpi  { text-align:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:var(--mfd-r2);padding:10px 16px;min-width:95px; }
.mfd-lh-val  { font-size:22px;font-weight:800;line-height:1;color:#fff; }
.mfd-lh-val.warn   { color:#f7d070; }
.mfd-lh-val.danger { color:#f5a49a; }
.mfd-lh-val.safe   { color:#5dd5b2; }
.mfd-lh-val.blue   { color:var(--mfd-blue-lt); }
.mfd-lh-lbl { font-size:9px;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:.07em;margin-top:3px; }

/* LGA DETAIL GRIDS */
.mfd-lga-g2 { display:grid;grid-template-columns:1.5fr 1fr;gap:14px;margin-bottom:14px; }
.mfd-lga-g3 { display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px; }
@media(max-width:1000px){ .mfd-lga-g2{grid-template-columns:1fr} .mfd-lga-g3{grid-template-columns:1fr 1fr} }
@media(max-width:600px) { .mfd-lga-g3{grid-template-columns:1fr} }

/* FUEL TYPE TABLE */
.mfd-ft-tbl { width:100%;border-collapse:collapse;margin-top:11px; }
.mfd-ft-tbl th { font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--mfd-text-lt);padding:0 0 7px;border-bottom:1px solid var(--mfd-border);text-align:left; }
.mfd-ft-tbl td { padding:7px 0;border-bottom:1px solid rgba(27,61,114,.05);font-size:12px; }
.mfd-ft-tbl tr:last-child td { border:none; }
.mfd-ft-name  { font-weight:600;color:var(--mfd-navy); }
.mfd-ft-price { font-weight:700;font-size:14px;color:var(--mfd-blue); }
.mfd-ft-hi { font-size:10px;font-weight:600;color:var(--mfd-danger); }
.mfd-ft-lo { font-size:10px;font-weight:600;color:var(--mfd-safe); }
.mfd-ft-eq { font-size:10px;font-weight:600;color:var(--mfd-text-lt); }

/* COMPARE BARS */
.mfd-cmp-item  { display:flex;align-items:center;gap:7px;margin-bottom:5px; }
.mfd-cmp-name  { font-size:10px;color:var(--mfd-text-mid);min-width:78px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mfd-cmp-track { flex:1;height:4px;background:var(--mfd-bg);border-radius:99px;overflow:hidden;border:1px solid var(--mfd-border); }
.mfd-cmp-fill  { height:100%;border-radius:99px; }
.mfd-cmp-price { font-size:10px;font-weight:700;min-width:30px;text-align:right; }

/* STALE DATA BANNER */
.mfd-stale-banner { background:var(--mfd-warn-lt);border:1px solid rgba(214,137,16,.3);border-radius:var(--mfd-r);padding:9px 14px;font-size:12px;color:var(--mfd-warn);margin-bottom:14px;font-weight:600; }