/* PAYATE — SWIFT / BIC Directory & Validator. Scoped under #swf, matching the
   house style of the other tool pages (bin-lookup / iban): grey canvas, white
   rounded cards, Poppins headings with a metrics-matched fallback. */
@font-face{font-family:"PoppinsFB";src:local("Segoe UI Semibold"),local("Segoe UI"),local("Roboto Medium"),local("Roboto"),local("Helvetica Neue"),local("Arial");size-adjust:107%;ascent-override:98%;descent-override:32.7%;line-gap-override:0%}

body{margin:0;background:#f4f7fb;color:#14233c;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased}

#swf{max-width:900px;margin:0 auto;padding:10px 16px 40px}
#swf *{box-sizing:border-box}
#swf h1,#swf h2{font-family:Poppins,"PoppinsFB",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}

/* ---- banner (same pattern as bin-lookup .tool-banner) ---- */
#swf .swf-banner{display:flex;align-items:center;gap:16px;padding:18px 20px;margin:26px 0 18px;
  background:#fff;border:1px solid #e6ecf5;border-radius:14px;box-shadow:0 1px 2px rgba(15,27,45,.05)}
#swf .swf-banner-icon{width:52px;height:52px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;background:linear-gradient(135deg,#2a72e6 0%,#1a59c1 100%);color:#fff;
  box-shadow:0 6px 16px rgba(29,100,216,.32)}
#swf .swf-banner-icon svg{width:26px;height:26px;display:block}
#swf .swf-banner-text{line-height:1.2;min-width:0}
#swf .swf-banner-title{margin:0 0 5px;font-weight:700;font-size:22px;line-height:1.22;color:#0f1b2d;word-break:break-word}
#swf .swf-banner-desc{margin:0;font-weight:500;font-size:14.5px;line-height:1.5;color:#4a5b73}

/* ---- cards ---- */
#swf .swf-card,#swf .swf-dir,#swf .swf-info,#swf .swf-note{
  background:#fff;border:1px solid #e6ecf5;border-radius:14px;padding:22px;margin:0 0 16px;
  box-shadow:0 1px 2px rgba(15,27,45,.05)}
#swf .swf-note{background:#eef4ff;border-color:#d6e4ff}
#swf .swf-card h2,#swf .swf-dir h2,#swf .swf-info h2{font-size:18px;margin:0 0 14px;font-weight:700;color:#0f1b2d}

/* ---- validator input ---- */
#swf .swf-lbl{display:block;font-weight:600;font-size:12.5px;color:#5a6b83;margin:0 0 7px;text-transform:uppercase;letter-spacing:.04em}
#swf .swf-inrow{display:flex;gap:10px;flex-wrap:wrap}
#swf .swf-inrow input{flex:1 1 240px;min-width:0;
  font:700 19px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.1em;text-transform:uppercase;
  padding:14px 16px;border:1.5px solid #d7deea;border-radius:11px;color:#0f1b2d;background:#fbfcfe;outline:none}
#swf .swf-inrow input::placeholder{color:#9fb0c7;letter-spacing:.06em}
#swf .swf-inrow input:focus{border-color:#1d64d8;background:#fff;box-shadow:0 0 0 3px rgba(29,100,216,.14)}
#swf .swf-btn{flex:0 0 auto;background:#1d64d8;color:#fff;border:0;border-radius:11px;
  padding:14px 24px;font:600 15px/1 Poppins,sans-serif;cursor:pointer;transition:background .15s}
#swf .swf-btn:hover{background:#1550b4}
#swf .swf-hint{font-size:12.5px;color:#7486a0;margin:10px 0 0}
#swf .swf-out{margin-top:18px}

/* ---- validity badge ---- */
#swf .swf-vbadge{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:.02em;padding:6px 14px;border-radius:999px;margin:0}
#swf .swf-out .swf-vbadge{margin-bottom:16px}
#swf .swf-ok{background:#e7f8ef;color:#0f7a48}
#swf .swf-bad{background:#fdecec;color:#c4332e}

/* ---- code breakdown strip (labeled segments) ---- */
#swf .swf-break{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 20px}
#swf .swf-segbox{display:flex;flex-direction:column;align-items:center;gap:6px}
#swf .swf-seg{min-width:62px;text-align:center;padding:12px 14px;border-radius:10px;color:#fff;
  font:700 19px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.06em;
  box-shadow:0 4px 12px rgba(15,27,45,.12)}
#swf .swf-seglbl{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#7486a0}
#swf .swf-seg-bank{background:linear-gradient(135deg,#2a72e6,#1a59c1)}
#swf .swf-seg-country{background:linear-gradient(135deg,#1fc27a,#12a263)}
#swf .swf-seg-loc{background:linear-gradient(135deg,#f9a825,#f2820c)}
#swf .swf-seg-branch{background:linear-gradient(135deg,#8b6cff,#6d47f0)}

/* ---- key/value tables ---- */
#swf .swf-kv{width:100%;border-collapse:collapse}
#swf .swf-kv th,#swf .swf-kv td{text-align:left;padding:11px 12px;border-bottom:1px solid #eef2f8;font-size:14px;vertical-align:top}
#swf .swf-kv th{width:150px;font-weight:600;color:#5a6b83;white-space:nowrap}
#swf .swf-kv tr:last-child th,#swf .swf-kv tr:last-child td{border-bottom:0}
#swf .swf-mut{color:#7486a0;font-size:12.5px}

/* ---- directory ---- */
#swf .swf-dirhead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}
#swf .swf-dirhead h2{margin:0}
#swf .swf-stat{margin:0;display:flex;flex-wrap:wrap;gap:8px}
#swf .swf-stat span{font-size:12.5px;color:#4a5b73;background:#f1f6fc;border:1px solid #e3edf9;border-radius:999px;padding:4px 11px}
#swf .swf-stat strong{color:#1d64d8}
#swf .swf-filter{margin:0 0 14px}
#swf .swf-filter input{width:100%;padding:11px 14px;border:1.5px solid #d7deea;border-radius:10px;
  font:400 14px system-ui,sans-serif;color:#14233c;background:#fbfcfe;outline:none}
#swf .swf-filter input:focus{border-color:#1d64d8;background:#fff;box-shadow:0 0 0 3px rgba(29,100,216,.12)}

/* ---- continent blocks (index directory) — native collapsible <details> ---- */
#swf .swf-contblock{margin:0 0 12px;border:1px solid #e6ecf5;border-radius:12px;overflow:hidden;background:#fbfcfe}
#swf .swf-contblock:last-child{margin-bottom:0}
#swf .swf-conth{display:flex;align-items:center;gap:10px;padding:14px 16px;cursor:pointer;list-style:none;
  font-size:14px;font-weight:700;color:#0f1b2d;text-transform:uppercase;letter-spacing:.05em;user-select:none}
#swf .swf-conth::-webkit-details-marker{display:none}
#swf .swf-conth:hover{background:#f3f7fd}
#swf .swf-contchev{display:inline-flex;color:#1d64d8;transition:transform .18s ease}
#swf .swf-contblock[open] .swf-contchev{transform:rotate(90deg)}
#swf .swf-contname{flex:1}
#swf .swf-contn{font-size:11px;font-weight:700;color:#1d64d8;background:#eef4ff;border:1px solid #d6e4ff;border-radius:999px;padding:2px 9px}
#swf .swf-contblock .swf-tablewrap{border:0;border-top:1px solid #eef2f8;border-radius:0}

/* ---- expand arrow + inline codes (accordion on index) ---- */
#swf .swf-exp{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin-right:4px;
  vertical-align:middle;border:1px solid #e3edf9;background:#f6f9fe;color:#5a6b83;border-radius:7px;cursor:pointer;
  padding:0;transition:transform .18s ease,background .15s,color .15s}
#swf .swf-exp:hover{background:#e9f1fd;color:#1d64d8;border-color:#cfe0f7}
#swf .swf-exp svg{display:block;transition:transform .18s ease}
#swf .swf-exp.on{background:#1d64d8;color:#fff;border-color:#1d64d8}
#swf .swf-exp.on svg{transform:rotate(90deg)}
#swf .swf-sub>td{padding:0;background:#f7f9fc;border-bottom:1px solid #eef2f8}
#swf .swf-subpanel{padding:12px 14px 16px}
#swf .swf-subtablewrap{overflow-x:auto;border:1px solid #e6ecf5;border-radius:10px;background:#fff}
#swf .swf-subtable{font-size:13px;margin:0}
#swf .swf-subtable th{background:#eef3fa}
#swf .swf-subtable td,#swf .swf-subtable th{padding:9px 12px}
#swf .swf-subload{font-size:13px;color:#5a6b83;padding:6px 2px}
#swf .swf-subload a,#swf .swf-seeall{color:#1d64d8;font-weight:600;text-decoration:none}
#swf .swf-seeall{display:inline-block;margin-top:10px;font-size:13px}
#swf .swf-seeall:hover,#swf .swf-subload a:hover{text-decoration:underline}

/* ---- IBAN card (country view) ---- */
#swf .swf-iban{background:linear-gradient(135deg,#eef5ff,#f5f9ff);border:1px solid #d6e4ff;border-radius:14px;padding:18px 20px;margin:0 0 16px}
#swf .swf-ibanrow{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
#swf .swf-ibanmain{flex:1 1 300px;min-width:0}
#swf .swf-iban h2{margin:0 0 7px;font-size:16px;color:#0f1b2d}
#swf .swf-iban p{margin:0 0 5px;font-size:13.5px;color:#36465e;line-height:1.6}
#swf .swf-ibanex code{background:#fff;border:1px solid #d6e4ff;border-radius:6px;padding:3px 8px;font-size:12.5px;color:#0f1b2d;word-break:break-all}
#swf .swf-ibanbtn{flex:0 0 auto;background:#1d64d8;color:#fff;text-decoration:none;font-weight:600;font-size:13.5px;padding:11px 18px;border-radius:10px;white-space:nowrap}
#swf .swf-ibanbtn:hover{background:#1550b4}

/* ---- bank accordion (country view) ---- */
#swf .swf-bankhint{margin:0 0 12px}
#swf .swf-bank{border:1px solid #e6ecf5;border-radius:11px;margin:0 0 9px;overflow:hidden;background:#fff}
#swf .swf-bankhead{display:flex;align-items:center;gap:10px;padding:13px 15px;cursor:pointer;list-style:none;user-select:none}
#swf .swf-bankhead::-webkit-details-marker{display:none}
#swf .swf-bankhead:hover{background:#f6f9fe}
#swf .swf-bankchev{display:inline-flex;flex:0 0 auto;color:#1d64d8;transition:transform .18s ease}
#swf .swf-bank[open] .swf-bankchev{transform:rotate(90deg)}
#swf .swf-bankname{flex:1;font-weight:600;font-size:14px;color:#14233c;min-width:0}
#swf .swf-bankcode{flex:0 0 auto;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;font-weight:700;letter-spacing:.06em;
  color:#1d64d8;background:#eef4ff;border:1px solid #d6e4ff;border-radius:6px;padding:2px 7px}
#swf .swf-bankcount{flex:0 0 auto;font-size:12px;color:#5a6b83;background:#f1f6fc;border:1px solid #e3edf9;border-radius:999px;padding:3px 10px;white-space:nowrap}
#swf .swf-bank .swf-tablewrap{border:0;border-top:1px solid #eef2f8;border-radius:0}
#swf .swf-bank .swf-subtable{margin:0}

/* ---- search form (country view) ---- */
#swf .swf-searchform{display:flex;gap:10px;flex-wrap:wrap}
#swf .swf-searchform input[type=search]{flex:1 1 240px;min-width:0}
#swf .swf-searchform .swf-btn{padding:11px 20px}
#swf .swf-count{margin:0 0 12px;font-size:13px;color:#5a6b83}
#swf .swf-count strong{color:#0f1b2d}

/* ---- pagination ---- */
#swf .swf-pager{display:flex;align-items:center;justify-content:center;gap:14px;margin:18px 0 0;flex-wrap:wrap}
#swf .swf-pg{text-decoration:none;font-weight:600;font-size:14px;color:#1d64d8;background:#f1f6fc;border:1px solid #d6e4ff;border-radius:9px;padding:9px 16px}
#swf .swf-pg:hover{background:#e4eeff}
#swf .swf-pginfo{font-size:13px;color:#5a6b83}

/* ---- data tables ---- */
#swf .swf-tablewrap{overflow-x:auto;border:1px solid #eef2f8;border-radius:11px}
#swf .swf-table{width:100%;border-collapse:collapse;font-size:14px}
#swf .swf-table th,#swf .swf-table td{text-align:left;padding:12px 14px;border-bottom:1px solid #eef2f8}
#swf .swf-table thead th{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#7486a0;font-weight:700;background:#f7f9fc}
#swf .swf-table tbody tr:last-child td{border-bottom:0}
#swf .swf-table tbody tr:hover{background:#f6f9fe}
#swf .swf-table a{color:#1d64d8;text-decoration:none;font-weight:600}
#swf .swf-table a:hover{text-decoration:underline}
#swf .swf-codelink{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em}
#swf .swf-natcode{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;font-weight:600;color:#0f7a48;background:#e7f8ef;border:1px solid #bfe8cf;border-radius:5px;padding:1px 7px}
html[data-theme="dark"] #swf .swf-natcode{color:#4ade80;background:rgba(23,178,106,.15);border-color:#1f6b45}
#swf .swf-cc{display:inline-block;margin-left:8px;font-size:10.5px;font-weight:700;color:#5a6b83;background:#eef2f8;border-radius:5px;padding:2px 6px;vertical-align:middle}
#swf .swf-empty{color:#7486a0;font-size:14px;padding:16px 4px;margin:0}
#swf .swf-back{margin:16px 0 0;font-size:14px}
#swf .swf-back a{color:#1d64d8;text-decoration:none;font-weight:600}
#swf .swf-back a:hover{text-decoration:underline}
#swf .swf-crsep{margin:0 8px;color:#c3cedd}

/* ---- info ---- */
#swf .swf-info ul{margin:8px 0;padding-left:20px}
#swf .swf-info li{margin:5px 0;font-size:14.5px;color:#36465e}
#swf .swf-info code,#swf .swf-note code{background:#eef2f8;border-radius:5px;padding:1px 6px;font-size:13px;font-family:ui-monospace,Menlo,Consolas,monospace}
#swf .swf-info a,#swf .swf-note a{color:#1550b4}

/* ---- FAQ ---- */
#swf .swf-faq{background:#fff;border:1px solid #e6ecf5;border-radius:14px;padding:20px 22px;margin:0 0 16px;box-shadow:0 1px 2px rgba(15,27,45,.05)}
#swf .swf-faq h2{margin:0 0 10px;font-size:19px;color:#0f1b2d}
#swf .swf-faq details{border-top:1px solid #eef2f8;padding:2px 0}
#swf .swf-faq details:first-of-type{border-top:0}
#swf .swf-faq summary{cursor:pointer;list-style:none;padding:13px 26px 13px 2px;position:relative;font-weight:600;font-size:14.5px;color:#14233c}
#swf .swf-faq summary::-webkit-details-marker{display:none}
#swf .swf-faq summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:18px;color:#7486a0}
#swf .swf-faq details[open] summary::after{content:"\2212"}
#swf .swf-faq details p{margin:0 2px 13px;font-size:13.5px;line-height:1.7;color:#4a5b73}
#swf .swf-faq details p a{color:#1550b4}

/* ---- Shared "More PAYATE tools" related section (each page styles its own) ---- */
.pyt-rel{max-width:900px;margin:16px auto;padding:20px 22px;background:#fff;border:1px solid #e6ecf5;border-radius:14px;box-shadow:0 1px 2px rgba(15,27,45,.05);font-family:Poppins,"PoppinsFB",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:#14233c}
.pyt-rel h2{margin:0 0 12px;font-size:18px;color:#0f1b2d}
.pyt-rel .prg{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.pyt-rel a{display:block;text-decoration:none;border:1px solid #e6ecf5;border-radius:10px;padding:12px 14px;background:#fbfcfe;transition:border-color .15s,background .15s}
.pyt-rel a:hover{border-color:#1d64d8;background:#f2f7ff}
.pyt-rel .prt{display:block;font-weight:600;font-size:14px;color:#14233c;margin-bottom:2px}
.pyt-rel .prd{display:block;font-size:12px;line-height:1.4;color:#5a6782}

@media (max-width:640px){
  #swf .swf-banner{padding:16px}
  #swf .swf-banner-title{font-size:19px}
  #swf .swf-banner-desc{font-size:13.5px}
  #swf .swf-kv th{width:112px}
  #swf .swf-btn{flex:1 1 100%}
  #swf .swf-seg{min-width:54px;font-size:16px;padding:10px}
}

/* ---- dark mode (site flips data-theme on <html>) ---- */
html[data-theme="dark"] body{background:#0f1620;color:#dbe4f0}
html[data-theme="dark"] #swf .swf-banner,
html[data-theme="dark"] #swf .swf-card,
html[data-theme="dark"] #swf .swf-dir,
html[data-theme="dark"] #swf .swf-info,
html[data-theme="dark"] #swf .swf-faq,
html[data-theme="dark"] .pyt-rel{background:#172231;border-color:#26344a;box-shadow:none}
html[data-theme="dark"] #swf .swf-note{background:#13233c;border-color:#1d3a63}
html[data-theme="dark"] #swf .swf-banner-title,
html[data-theme="dark"] #swf .swf-card h2,
html[data-theme="dark"] #swf .swf-dir h2,
html[data-theme="dark"] #swf .swf-info h2,
html[data-theme="dark"] #swf .swf-faq h2,
html[data-theme="dark"] .pyt-rel h2,
html[data-theme="dark"] .pyt-rel .prt{color:#f1f6fc}
html[data-theme="dark"] #swf .swf-banner-desc,
html[data-theme="dark"] #swf .swf-mut,
html[data-theme="dark"] #swf .swf-info li,
html[data-theme="dark"] #swf .swf-faq details p,
html[data-theme="dark"] .pyt-rel .prd{color:#93a4bd}
html[data-theme="dark"] #swf .swf-faq summary{color:#dbe4f0}
html[data-theme="dark"] #swf .swf-kv th{color:#93a4bd}
html[data-theme="dark"] #swf .swf-kv th,html[data-theme="dark"] #swf .swf-kv td,
html[data-theme="dark"] #swf .swf-table th,html[data-theme="dark"] #swf .swf-table td,
html[data-theme="dark"] #swf .swf-faq details{border-color:#26344a}
html[data-theme="dark"] #swf .swf-table thead th{background:#1d2b40;color:#a9bcd6}
html[data-theme="dark"] #swf .swf-tablewrap{border-color:#26344a}
html[data-theme="dark"] #swf .swf-table tbody tr:hover{background:#1d2b40}
html[data-theme="dark"] #swf .swf-inrow input,
html[data-theme="dark"] #swf .swf-filter input{background:#0f1620;border-color:#33445e;color:#eaf1fb}
html[data-theme="dark"] #swf .swf-stat span{background:#1d2b40;border-color:#2b3b52;color:#a9bcd6}
html[data-theme="dark"] #swf .swf-cc{background:#1d2b40;color:#a9bcd6}
html[data-theme="dark"] .pyt-rel a{background:#1e2b3d;border-color:#2b3b52}
html[data-theme="dark"] .pyt-rel a:hover{background:#243449;border-color:#3a4c68}
html[data-theme="dark"] #swf .swf-info code,html[data-theme="dark"] #swf .swf-note code{background:#0f1620;color:#dbe4f0}
html[data-theme="dark"] #swf .swf-ok{background:rgba(23,178,106,.18);color:#4ade80}
html[data-theme="dark"] #swf .swf-bad{background:rgba(229,72,77,.18);color:#f87171}
html[data-theme="dark"] #swf .swf-conth{color:#f1f6fc}
html[data-theme="dark"] #swf .swf-contn{background:#1d2b40;border-color:#2b3b52;color:#8fb3ff}
html[data-theme="dark"] #swf .swf-count{color:#93a4bd}
html[data-theme="dark"] #swf .swf-count strong{color:#eaf1fb}
html[data-theme="dark"] #swf .swf-pg{background:#1d2b40;border-color:#2b3b52;color:#8fb3ff}
html[data-theme="dark"] #swf .swf-pg:hover{background:#243449}
html[data-theme="dark"] #swf .swf-pginfo{color:#93a4bd}
html[data-theme="dark"] #swf .swf-exp{background:#1d2b40;border-color:#2b3b52;color:#a9bcd6}
html[data-theme="dark"] #swf .swf-exp:hover{background:#243449;color:#8fb3ff}
html[data-theme="dark"] #swf .swf-exp.on{background:#1d64d8;border-color:#1d64d8;color:#fff}
html[data-theme="dark"] #swf .swf-sub>td{background:#121b28;border-color:#26344a}
html[data-theme="dark"] #swf .swf-subtablewrap{background:#172231;border-color:#26344a}
html[data-theme="dark"] #swf .swf-subtable th{background:#1d2b40}
html[data-theme="dark"] #swf .swf-subload{color:#93a4bd}
html[data-theme="dark"] #swf .swf-contblock{background:#141e2b;border-color:#26344a}
html[data-theme="dark"] #swf .swf-conth{color:#f1f6fc}
html[data-theme="dark"] #swf .swf-conth:hover{background:#1b2838}
html[data-theme="dark"] #swf .swf-contchev{color:#8fb3ff}
html[data-theme="dark"] #swf .swf-contblock .swf-tablewrap{border-top-color:#26344a}
html[data-theme="dark"] #swf .swf-iban{background:#13233c;border-color:#1d3a63}
html[data-theme="dark"] #swf .swf-iban h2{color:#eaf1fb}
html[data-theme="dark"] #swf .swf-iban p{color:#a9bcd6}
html[data-theme="dark"] #swf .swf-ibanex code{background:#0f1620;border-color:#1d3a63;color:#eaf1fb}
html[data-theme="dark"] #swf .swf-bank{background:#172231;border-color:#26344a}
html[data-theme="dark"] #swf .swf-bankhead:hover{background:#1d2b40}
html[data-theme="dark"] #swf .swf-bankname{color:#eaf1fb}
html[data-theme="dark"] #swf .swf-bankchev{color:#8fb3ff}
html[data-theme="dark"] #swf .swf-bankcode{background:#1d2b40;border-color:#2b3b52;color:#8fb3ff}
html[data-theme="dark"] #swf .swf-bankcount{background:#1d2b40;border-color:#2b3b52;color:#a9bcd6}
html[data-theme="dark"] #swf .swf-bank .swf-tablewrap{border-top-color:#26344a}