/***********************
 UTILITY CLASSES
***********************/
.d-none { display: none; }
.flex-center-between { display: flex; align-items: center; justify-content: space-between !important; margin: 0px 7px;}
.m-4 { margin: 4px !important; }
.m-0 { margin: 0 !important; }
.pointer { cursor: pointer !important; }
.inline-center { display: inline-block !important; text-align: center !important; }
.no-decoration { text-decoration: none !important; }
.dark { color: var(--pd) !important; }
.dark::after { background-color: lightblue!important; }
.fs-12 { font-size: 1.05rem !important; font-weight: normal !important;}
.br-4 { border-radius: 4px !important; }

/***********************
 RESET & BASE
***********************/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
:root {
    --p: #ff6600;
    --pd: #e65c00;
    --pl: #ff9933;
    --pi: #ffe6d5;
    --a: #e65c00;
    --t: #002147;
    --tl: #333;
    --b: #ffffff;
    --s: #ffffff;
    --bd: #e0e0e0;
    --sh: 0 4px 12px rgba(0,0,0,0.1);
    --ob: #002147;
}
html { scroll-padding-top: 80px; }
body {
    background: var(--b);
    color: var(--ob);
    line-height: 1.6;
}

/***********************
 LAYOUT & COMPONENTS
***********************/


.custom-table {
  display: table;
  width: 100%;
  border-collapse: collapse;
}
.row {
  display: table-row;
  border-bottom: 1px solid #333; /* ciemne podkreślenie */
}
.last-row {
  border-bottom: none !important; /* usunięcie podkreślenia w ostatnim wierszu */
}
.cell {
  display: table-cell;
  padding: 8px 12px;
  vertical-align: top;
}
.left {
  text-align: right;
  width: 50%;
  padding-right: 20px;
}
.right {
  text-align: left;
  font-weight: bold;
  width: 50%;
  padding-left: 20px;
}


header {
    background: var(--s);
    box-shadow: var(--sh);
    padding: 12px 0px 6px 0px;
    position: sticky;
    top: 0;
    z-index: 100;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.header-left { display: flex; align-items: center; margin-left: 4%; }
.menu-tog {
    display: flex; flex-direction: column; justify-content: space-around;
    width: 30px; height: 25px; background: transparent; border: none;
    cursor: pointer; padding: 0; z-index: 10; margin-right: 4%; order: 2;
}
.menu-tog span {
    width: 30px; height: 3px; background: linear-gradient(45deg, var(--ob) 0%, var(--pd) 100%); border-radius: 3px; transition: all .3s;
}
.logo-container { display: flex; align-items: center; margin-right: auto; }
.logo { width: 130px; height: auto; }

.nav-menu {
    position: fixed; top: 0; right: -100%; left: auto; width: 80%; max-width: 320px; height: 100vh;
    background: var(--s); box-shadow: -5px 0 15px rgba(0,0,0,0.1);
    padding: 80px 20px 20px; transition: right .3s; z-index: 99;
}
.nav-menu.active { right: 0; left: auto; }
.nav-menu ul { list-style: none; }
.nav-menu li { margin-bottom: 15px; }
.nav-menu a {
    display: block; padding: 12px 15px; background: transparent; border-radius: 8px;
    text-decoration: none; color: var(--t); font-weight: 600; transition: all .3s;
    border: 1px solid var(--bd);
}
.nav-menu a:hover { background: var(--p); color: #fff; border-color: var(--p); }
.menu-ov {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5);
    opacity: 0; visibility: hidden; transition: all .3s; z-index: 98;
}
.menu-ov.active { opacity: 1; visibility: visible; }

.cont { max-width: 1400px; margin: 0 auto; padding: 15px 0; }
.s-title {
    position: relative; display: inline-block; margin: 20px 4% 15px; padding-bottom: 0;
    color: var(--t); font-size: 1.4rem; z-index: 1; font-weight: bold;
}
.s-title::after {
    content: ""; position: absolute; left: 0; bottom: 0.15em; height: 3px; width: 100%;
    background-color: var(--pi); z-index: -1;
}
.intro { background: var(--s); padding: 20px; margin: 0 4% 20px; }

.intro li {
	margin-left:20px;
}

.intro p
{
	margin-bottom:10px;
}

.intro h1 {
display: inline-flex;
  align-items: center;
}

.intro h1::before {
  content: "";
  width: 8px;
  height: 1em; /* wysokość czcionki */
  background-color: var(--p);
  margin-right: 8px;

}
.t-cont {
    overflow-x: auto; margin-bottom: 30px; background: var(--s); box-shadow: var(--sh);
    border-radius: 2px; border: 1px solid var(--bd); max-width: 1200px; margin: 0 auto;
}

/***********************
 TABLES & BUTTONS
***********************/
.r-tab { width: 100%; min-width: 100%; border-collapse: collapse; table-layout: fixed; }
.r-tab th {
    background: var(--s); color: var(--t); font-weight: 600; padding: 12px 10px; text-align: left;
    position: relative; cursor: pointer; user-select: none; border: 1px solid var(--bd);
}
.r-tab th.sort::after { content: "↕"; position: absolute; right: 8px; opacity: .7; font-size: .8em; }
.r-tab th.s-asc::after { content: "↑"; opacity: 1; }
.r-tab th.s-desc::after { content: "↓"; opacity: 1; }
.r-tab th:first-child { border-radius: 8px 0 0 0; }
.r-tab th:last-child { border-radius: 0 8px 0 0; }
.r-tab td { padding: 10px; border-bottom: 1px solid var(--ob); vertical-align: middle; }
.r-tab tr:last-child td { border-bottom: none; }
.r-tab tr:nth-child(even) { background: #f9f9f9; }
.lender-cell { display: flex; align-items: center; gap: 10px; }
.lender-logo { width: auto; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; overflow: hidden; flex-shrink: 0; box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;}
.lender-logo img { max-width: 34px; height: auto; object-fit: cover; }
.lender-num { font-size: calc(1.4rem + 4px); font-weight: bold; margin-right: 6px; color: var(--t); line-height: 1; display: inline-block; }
.lender-name {
    position: relative; display: inline-block; font-weight: 600; white-space: nowrap; overflow: hidden;
    text-overflow: ellipsis; font-size: 1.4rem; color: var(--ob); z-index: 1;
}
.lender-name::after {
    content: ""; position: absolute; left: 0; bottom: 0.35em; width: 100%; height: 4px; background-color: var(--pi); z-index: -1;
}
.lender-name {
  cursor: pointer;
  transition: color 0.2s, text-shadow 0.2s;
}
.lender-name:hover {
  color: var(--p);
  text-shadow: 0 2px 8px #ff660033;
}
.r-tab th[data-sort="lender"] { font-size: 1.4rem !important; }
.ac { padding: 6px 8px; display: flex; flex-direction: column; gap: 5px; }
.btn {
    display: block; background: var(--ob); color: var(--b); text-align: center; padding: 8px 10px;
    border-radius: 5px; text-decoration: none; font-weight: 600; transition: all .3s; ;
    cursor: pointer; font-size: 0.85rem; white-space: nowrap;
}
.btn:hover { background: var(--p); color: #fff; }
.btn-sm {
    padding: 5px 8px; font-size: .75rem; background: transparent; color: var(--t); margin-top: 4px;
    white-space: nowrap; border: 1px solid var(--ob);
}
.btn-sm:hover { background: var(--p); color: #fff; border-color: var(--p); }

/***********************
 TOGGLE, ACCORDION, FOOTER, ETC.
***********************/
.lr { display: none; }
.lr.active { display: table-row; }
.lnc {
    padding: 15px; background: var(--s); border-radius: 0; font-size: 0.85rem; overflow-wrap: break-word;
    max-width: 100%; box-sizing: border-box; white-space: normal; word-break: break-word;
}
.lnc p
{
margin-bottom:20px;
}
.lnc h4 { margin-bottom: 8px; color: var(--t); font-size: 1rem; }
.h4-style { margin-bottom: 8px; color: var(--t); font-size: 1.2rem; font-weight: bold; display: block; text-align:center; }
.i-sec { margin: 30px 0; }
.acc { margin-top: 15px; }
.acc-i {
    background: var(--s); border-radius: 6px; margin-bottom: 8px; box-shadow: var(--sh); overflow: hidden; border: 1px solid var(--bd);
}
.acc-h {
    padding: 15px; background: var(--s); font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center; transition: all .3s; font-size: 1rem;
}
.acc-h:hover { background: var(--p); color: #fff; }
.acc-h::after { content: "+"; font-size: 1.1rem; transition: transform .3s; color: var(--p); }
.acc-h.active::after { transform: rotate(45deg); color: #fff; }
.acc-c { padding: 0 15px; max-height: 0; overflow: hidden; transition: max-height .3s, padding .3s; font-size: 0.9rem; }
.acc-c.active { padding: 0 15px 15px; max-height: 1000px; }
.f-cat { margin-top: 20px; padding-bottom: 8px; border-bottom: 1px solid var(--bd); color: var(--t); font-size: 1.2rem; margin-left: 4%; }

footer {
    background: #fff; color: #000; padding: 25px 0; margin-top: 40px; width: 100%; border-top: 1px solid var(--bd);
}
.f-cont { max-width: 1400px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 20px; padding: 0 4%; }
.f-sec { flex: 1; min-width: 220px; }
.f-sec h3 { margin-bottom: 15px; font-size: 1.1rem; color: #000; }
.f-links { list-style: none; }
.f-links li { margin-bottom: 8px; }
.f-links a { color: #06c; text-decoration: none; transition: color .3s; font-size: 0.9rem; display: flex; align-items: center; gap: 8px; }
.f-links a:hover { color: #049; text-decoration: underline; }
.aff-note { background: rgba(0,0,0,0.05); padding: 12px; border-radius: 6px; margin-top: 15px; font-size: .85rem; color: #000; }
.copy { text-align: center; padding-top: 20px; margin-top: 20px; border-top: 1px solid var(--bd); font-size: .85rem; color: #000; padding: 0 4%; }

/***********************
 MEDIA QUERIES
***********************/
@media (min-width: 768px) {
    .s-title { font-size: 1.6rem; }
    .lender-logo { width: 42px; height: 42px; }
    .btn { font-size: 0.9rem; padding: 8px 12px; }
}
@media (max-width: 480px) {
    .r-tab { width: 100%; }
    .r-tab th, .r-tab td { padding: 8px 6px; font-size: 0.85rem; }
    .lender-cell { flex-direction: column; align-items: center; gap: 5px; }
    .lender-logo { margin: 0; flex-shrink: 0; }
    .btn { padding: 6px 8px; font-size: 0.8rem; }
    .s-title { margin: 15px 4% 10px; font-size: 1.5rem; }
    .intro { padding: 10px; margin: 0 2% 15px; }
    .intro h1 {  line-height: 1.3; }
    .lr { position: relative; }
    .lnc { position: static; width: 100%; max-width: 100%; box-sizing: border-box; overflow-wrap: break-word; }
    .f-cont { flex-direction: column; gap: 15px; }
}
@media (max-width: 360px) {
    .lender-name { font-size: 1rem; }
    .btn { font-size: 0.75rem; }
    .intro h1 { font-size: 1.3rem; }
}
@media (max-width: 767px) {
    .r-tab, .r-tab tbody, .r-tab tr, .r-tab td { display: block; width: 100%; }
    .r-tab thead { display: none; }
    .r-tab tr { margin-bottom: 22px; box-shadow: 0 2px 10px rgba(0,0,0,0.08); border-radius: 12px; background: #fff; border: 1.5px solid #ececec; overflow: hidden; border-bottom: 2.5px solid var(--ob)}
    .r-tab td { padding: 4px 15px; position: relative; border: none; border-bottom: 1px solid var(--bd); display: flex; justify-content: space-between; align-items: center; font-size: 0.95em; background: none; }
    .r-tab td:not([data-label="Dostawca"]) { flex-direction: row; background: none; gap: 0; }
    .r-tab td[data-label="Dostawca"] { display: block; background: none; padding-bottom: 0; }
    .r-tab td[data-label="Dostawca"] .lender-cell { flex-direction: row; align-items: center; justify-content: flex-start; text-align: left; gap: 8px; margin-bottom: 8px; }
    .lender-name { margin: 0; }
    .r-tab td::before { content: attr(data-label); font-weight: 500; letter-spacing:1px; color: var(--t); flex: 1; padding-right: 10px; text-align: left; min-width: 90px; max-width: 50%; display: block; font-size: 1rem!important; }
    .r-tab td[data-label="Dostawca"]::before { display: none; }
    .r-tab td:last-child { border-bottom: none; }
    .r-tab td.ac { flex-direction: row-reverse; gap: 27px; padding: 15px 15px 10px 25px; border-bottom: none; }
    .r-tab td.ac::before { display: none; }
    .ac { flex-direction: row-reverse; justify-content: space-between; width: 100%; gap: 10px; }
    .btn, .btn-sm { min-width: 48%; width: 100%; max-width: 100%; box-sizing: border-box; font-size: 0.95em; margin: 0; }
    .btn-sm { margin-top: 0; }
    .lender-name { font-size: 1.5rem; font-weight: 700; margin-top: 2px; margin-bottom: 0; }
    .lr { display: none !important; }
    .lr.active { display: block !important; border-top: 1px solid var(--bd); }
    .lnc { border-top: none; background: #fff !important; box-shadow: none !important; border-radius: 0 !important; margin: 0 !important; padding: 15px 10px 10px 10px; width: 100% !important; max-width: 100% !important; box-sizing: border-box; text-align: left; }
    .r-tab tr, .r-tab td { border-radius: 0 !important; }
    tr.lr { box-shadow: none !important; border: none !important; background: transparent !important; }
    tr.lr.active { border-top: none !important; }
    tr.lr .lnc { background: transparent !important; border: none !important; box-shadow: none !important; border-radius: 0 !important; margin: 0 !important; }
    .r-tab tr:not(.lr):has(+ tr.lr.active) { box-shadow: none !important; border-bottom: 0px !important; }
    .r-tab tr:not(.lr):has(+ tr.lr.active) td.ac { border-bottom: none !important; }
    tr.lr.active { border-bottom: 2.5px solid var(--ob)!important; border-left: 1.5px solid #ececec !important; border-right: 1.5px solid #ececec !important; border-top: none !important; margin-top: -22px !important; }
    tr.lr.active .lnc { border-bottom: none !important; border-top: none !important; margin-top: 0 !important; border-left: none !important; border-right: none !important; border-radius: 0 !important; }
    .lr .lnc, .lr.active .lnc { background: #fff !important; border: none !important; box-shadow: none !important; border-radius: 0 !important; margin: 0 !important; padding: 15px 10px 10px 10px !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box; text-align: left !important; display: block; }
    .r-tab td[colspan], .r-tab td[colspan]::before, .lr .lnc, .lr.active .lnc { width: 100% !important; max-width: 100% !important; display: block !important; padding: 15px 10px 10px 10px !important; margin: 0 !important; background: #fff !important; box-sizing: border-box !important; text-align: left !important; }
    .r-tab td[colspan]::before { display: none !important; content: none !important; }
    .r-tab td[data-label="Koszty"] { display: flex; flex-direction: row; align-items: flex-start; }
    .r-tab td[data-label="Koszty"]::before { min-width: 90px; margin-right: 10px; flex-shrink: 0; align-self: flex-start; }
    .r-tab td[data-label="Koszty"] .cost-values {  flex-direction: column; gap: 0; }
}
@media (min-width: 768px) {
  .r-tab {
    table-layout: auto;
  }
  .r-tab th,
  .r-tab td {
    white-space: nowrap;
  }
  .r-tab th[data-sort="lender"],
  .r-tab td[data-label="Dostawca"] {
    min-width: 170px;
  }
  .r-tab th[data-sort="term"],
  .r-tab td[data-label="Termin"] {
    min-width: 110px;
  }
  .r-tab th[data-sort="amount"],
  .r-tab td[data-label="Kwota"] {
    min-width: 110px;
  }
  .r-tab th[data-sort="cost"],
  .r-tab td[data-label="Koszty"] {
    min-width: 130px;
    font-size: 0.9rem;
    font-weight: 600;
  }
  .r-tab th:last-child,
  .r-tab td.ac {
    min-width: 180px;
    max-width: 200px;
    width: 1%;
    white-space: nowrap;
  }
}

/***********************
 MISC
***********************/
.mobile-sort-bar {
    display: none; gap: 8px; margin: 10px 0 15px 0; justify-content: space-between; background: var(--s); padding: 8px 4px; border-radius: 8px; box-shadow: var(--sh);
}
@media (max-width: 767px) { .mobile-sort-bar { display: flex; } }
.sort-btn {
    flex: 1; background: transparent; border: 1px solid var(--bd); border-radius: 6px; padding: 7px 4px; font-size: 0.95em; color: var(--t); font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 4px; cursor: pointer; transition: background 0.2s, color 0.2s;
}
.sort-btn.active, .sort-btn:hover { background: var(--p); color: #fff; border-color: var(--p); }
.sort-arrow { font-size: 1em; opacity: 0.7; }
@media (max-width: 480px) {
    .intro-desc { font-size: 0.85rem !important; position: relative; display: flex; align-items: flex-end; padding-right: 0; margin-top: 1.1em; }
    .intro-desc.expanded { -webkit-line-clamp: unset; max-height: 100vh; overflow: visible; display: block; margin-top: 1.1em; }
    .intro-desc-short { flex: 1 1 auto; min-width: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; white-space: normal; }
    .intro-desc.expanded .intro-desc-short { -webkit-line-clamp: unset; overflow: visible; text-overflow: unset; }
    .intro-expand-btn { display: inline-block; background: linear-gradient(to left, var(--b) 60%, transparent); color: var(--p); border: none; font-size: 0.9em; font-weight: 600; cursor: pointer; padding: 0 0 0.2em 0.5em; margin: 0 0 0 0.2em; outline: none; transition: color 0.2s; position: relative; z-index: 2; }
    .intro-expand-btn[aria-expanded="true"]::after { content: " ▲"; font-size: 0.9em; }
    .intro-expand-btn[aria-expanded="false"]::after { content: " ▼"; font-size: 0.9em; }
}
.second-line { font-size: calc(100% - 2px); color: #333; }
.s-title-btn { width: auto; display: inline-block; position: relative; }
.s-title-btn::after { content: ""; position: absolute; left: 0; right: 0; margin: 0 auto; bottom: 0.15em; height: 3px; width: 100%; background-color: var(--pi); z-index: -1; display: block; } 

/* Większy tekst tylko dla komórek z danymi: Termin, Kwota, Koszty */
.r-tab td[data-label="Termin"],
.r-tab td[data-label="Kwota"]
 {
    font-size: 1.2rem !important;
    font-weight: 700 !important;
} 
.r-tab td[data-label="Koszty"] {
    font-size: 0.9rem;
    font-weight: 600;
}
@font-face {
  font-family: 'Segoe UI';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Segoe UI'), local('SegoeUI'), url('https://fonts.gstatic.com/s/segoeui/v1/9k-RPmcnxYEPm8CNFsH2gg.woff2') format('woff2');
}