/* Fiji Bank Suite Pro – premium UI */
:root{
  --fbs-ink:#0e2336;
  --fbs-bg:#f6f8fb;
  --fbs-accent:#0fb4a9;
  --fbs-accent-2:#0b6ef3;
  --fbs-card:#ffffff;
  --fbs-line:#e6edf5;
}
.fbs-portal{display:grid;place-items:center;padding:32px;background:linear-gradient(135deg,var(--fbs-bg),#eef3f9)}
.fbs-card{width:100%;max-width:420px;background:var(--fbs-card);border:1px solid var(--fbs-line);border-radius:18px;box-shadow:0 10px 30px rgba(20,35,50,.08);padding:22px}
.fbs-card__title{margin:0 0 6px;font:800 22px/1.2 system-ui,Segoe UI,Inter,Roboto,sans-serif;color:#0b2840}
.fbs-form label{display:block;font-size:13px;color:#5b6a62;margin-top:10px}
.fbs-form input, .fbs-form textarea, .fbs-form select{width:100%;padding:12px 14px;border:1px solid var(--fbs-line);border-radius:12px;background:#fff;outline:none}
.fbs-form input:focus{border-color:var(--fbs-accent);box-shadow:0 0 0 3px rgba(15,180,169,.2)}
.fbs-btn{display:inline-block;padding:12px 16px;border:0;border-radius:12px;background:#0e2336;color:#fff;font-weight:700;cursor:pointer;transition:transform .15s ease, box-shadow .2s}
.fbs-btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(14,35,54,.18)}
.fbs-btn--primary{background:var(--fbs-accent)}
.fbs-small{font-size:12px;margin-top:6px}
.fbs-badges{display:flex;gap:10px;align-items:center;margin-top:14px;opacity:.92}
.fbs-badges img{height:26px;filter:grayscale(20%)}
.fbs-msg{margin-top:8px;font-size:12px;color:#0b6ef3}

/* App */
.fbs-app__bar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 18px;background:#0b2840;color:#fff;position:sticky;top:0;z-index:10}
.fbs-app__brand{font-weight:900;letter-spacing:.08em}
.fbs-app__nav{display:flex;flex-wrap:wrap;gap:12px}
.fbs-app__nav a{color:#dce7f5;text-decoration:none;font-weight:700}
.fbs-app__nav a:hover{color:#fff;text-decoration:underline}
.fbs-app__main{padding:22px;background:var(--fbs-bg)}
.fbs-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:center}
.fbs-hero__title{color:#fff;background:#0b2840;padding:10px 14px;border-radius:12px;display:inline-block}
.fbs-cardcard{position:relative;height:210px;border-radius:20px;background:linear-gradient(135deg,#1f2a44,#0fb4a9);box-shadow:0 12px 28px rgba(3,20,38,.25);padding:18px;color:#fff;overflow:hidden}
.fbs-card-shine{position:absolute;top:-40%;left:-40%;width:80%;height:180%;background:linear-gradient(60deg, transparent, rgba(255,255,255,.25), transparent);transform:rotate(15deg);animation:shine 4s ease-in-out infinite}
@keyframes shine{0%{transform:translateX(-120%) rotate(15deg)}50%{transform:translateX(30%) rotate(15deg)}100%{transform:translateX(130%) rotate(15deg)}}
.fbs-chip{width:44px;height:34px;border-radius:6px;background:linear-gradient(135deg,#ffd36a,#ff9c4a)}
.fbs-digits{position:absolute;bottom:48px;left:18px;letter-spacing:.08em;font-weight:800}
.fbs-name{position:absolute;bottom:16px;left:18px;opacity:.9;font-weight:700}
.fbs-balances{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}
.fbs-balance{background:#fff;border:1px solid var(--fbs-line);border-radius:16px;padding:14px;box-shadow:0 6px 18px rgba(0,0,0,.05)}
.fbs-balance .amt{font:900 22px/1 system-ui,Inter,Segoe UI}
.fbs-tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:16px}
.fbs-tile{background:#fff;border:1px solid var(--fbs-line);border-radius:16px;padding:14px;text-decoration:none;color:#0e2336;display:flex;align-items:center;gap:10px;box-shadow:0 6px 16px rgba(0,0,0,.05);transition:transform .15s}
.fbs-tile:hover{transform:translateY(-2px)}
.fbs-tile .dot{width:10px;height:10px;border-radius:50%;background:var(--fbs-accent)}
.fbs-badges-row{display:flex;gap:16px;align-items:center;justify-content:center;margin-top:18px}
.fbs-badges-row img{height:28px;filter:grayscale(15%)}

/* Pages */
.fbs-page{background:#fff;border:1px solid var(--fbs-line);border-radius:18px;padding:18px;box-shadow:0 10px 26px rgba(10,25,40,.06)}
.fbs-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.fbs-cardx{display:block;background:linear-gradient(135deg,#ffffff,#f1f7ff);border:1px solid var(--fbs-line);border-radius:16px;padding:16px;color:#0e2336;text-decoration:none;box-shadow:0 8px 22px rgba(20,35,50,.06);transition:transform .15s, box-shadow .2s}
.fbs-cardx:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(20,35,50,.12)}
.fbs-cards--motion .fbs-cardx{position:relative;overflow:hidden}
.fbs-cards--motion .fbs-cardx::after{content:"";position:absolute;inset:-60%;background:radial-gradient(160px 160px at var(--mx,20%) var(--my,30%), rgba(15,180,169,.20), transparent 60%);transition:opacity .2s;opacity:.0}
.fbs-cards--motion .fbs-cardx:hover::after{opacity:1}

.fbs-table{width:100%;border-collapse:separate;border-spacing:0 10px;margin-top:12px}
.fbs-table th, .fbs-table td{padding:12px 14px;background:#fff}
.fbs-table thead th{font-size:12px;color:#5b6a62;background:#f0f4fa}
.fbs-table tbody tr{border-radius:10px;box-shadow:0 6px 14px rgba(0,0,0,.04)}
.credit{color:#0a7b50;font-weight:800}
.debit{color:#a11616;font-weight:800}
.fbs-pill{padding:8px 12px;border-radius:999px;background:#eef3fb;border:1px solid var(--fbs-line);cursor:pointer}
.fbs-toolbar{display:flex;justify-content:flex-end;gap:8px}

.fbs-open{padding:22px;background:linear-gradient(135deg,#0b2840,#0e3d58);border-radius:18px;color:#fff}
.fbs-open__title{margin:0 0 10px;color:#fff}

@media (max-width:980px){
  .fbs-hero{grid-template-columns:1fr}
  .fbs-tiles{grid-template-columns:repeat(2,1fr)}
  .fbs-balances{grid-template-columns:1fr}
  .fbs-cards{grid-template-columns:1fr}
}

/* Breadcrumb + brand tweaks */
.fbs-app__brand{color:#f5f5f5}
.fbs-breadcrumb{font:600 12px/1.6 system-ui,Segoe UI,Inter,Roboto,sans-serif;color:#4c6b80;margin:0 0 10px}
.fbs-breadcrumb a{color:#1b5f8a;text-decoration:none}
.fbs-breadcrumb a:hover{text-decoration:underline}
.fbs-page__hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.fbs-page__hdr .fbs-logout{margin-left:10px}
