@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');



/* div.row > [class *= "col"]{
  background: lightblue;
  /* border: 1px solid black; */
  /* text-align: center; */
  /* border border-danger */

 /* }   */


 
 /* [class *= "row*"]{
  border: 0.1rem solid blue;
}   

[class *= "col*"]{
  border: 0.1rem solid rgb(255, 0, 0);
} */

/* *, ::after, ::before {
  box-sizing: border-box;
} */


body[data-bs-theme="light"]
{
  --bs-border-color:  #7c7c7c; 
  /* --bs-body-color-rgb : 206, 212, 218; */
  --bs-body-color-rgb : 192, 192, 192;
  /* --bs-body-color-rgb : 140, 140, 145; */

  /* --bs-body-color-rgb: var(--bs-primary-rgb)  ; */
  /* --bs-card-cap: rgba(var(--bs-primary-rgb), 0.35); */

  /* --bs-body-menu: rgba(var(--bs-secondary-rgb), 0.30); */
  /* --bs-body-menu: rgba(var(--bs-tertiary-color-rgb), 0.60); */
  /* --bs-body-menu: rgba(var(--bs-dark-bg-subtle), 0.6); */
  --bs-body-menu: rgba(var(--bs-body-color-rgb), 0.60);


  --bg-fees-table-overdue: #c6c7c8;

}

body[data-bs-theme="dark"]
{
  --bs-body-color-rgb : 26, 29, 32;
  /* --bs-body-color-rgb : 45, 85, 215; */
  --bs-card-cap: rgba(var(--bs-body-color-rgb), 0.03);

  --bs-body-menu: rgba(var(--bs-tertiary-bg-rgb), 0.60);
  /* --bs-body-menu: rgba(var(--bs-body-color-rgb), 0.60); */

  --bg-fees-table-overdue: rgba(0, 0, 0, 0.80);

}


.bg-body-menu{ background-color: var(--bs-body-menu); }



body {
  margin: 0;
  font-family: var(--bs-body-font-family);
  /* font-family: 'DejaVu Sans', 'Verdana', 'Arial', 'Georgia', 'Times New Roman', 'Courier New', sans-serif !important; */
  /* font-size: var(--bs-body-font-size); */
  font-size: 12px;
  font-style: normal;
  font-optical-sizing: auto;
   /* font-weight: 30px; */

  /* font-size: small; */
  font-weight: var(--bs-body-font-weight);
  line-height: var(--bs-body-line-height);
  color: var(--bs-body-color);
  text-align: var(--bs-body-text-align);
  background-color: var(--bs-body-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(13, 26, 169, 0);

}


body[data-bs-theme="light"] .card {
    --bs-card-cap-bg: rgba(var(--bs-primary-rgb), 0.35);
    /* --bs-card-cap-bg: var(--bs-card-cap); */
  }

body[data-bs-theme="dark"] .card {
  --bs-card-cap-bg: rgba(var(--bs-primary-rgb), 0.06);
  
  /* --bs-card-cap-bg: rgba(var(--bs-body-color-rgb), 0.03); */
  /* --bs-card-cap-bg: var(--bs-card-cap); */
}


html {
  height: 100%;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  /* płynne przewijanie na iOS */
}

/* Rozciągamy stronę na cały widok */
html, body {
  margin: 0;
  padding: 2px;
  /* width: 100%; */
  /* height: 100%; */
  overflow: visible;
  /* blokada scrolla */

  position: relative;
}

/* .page-wrapper {
    overflow-y: auto;
    overflow-x: auto;
    min-height: 100vh;
} */


.page-title {
	/* font-size: calc(1.375rem + 1.5vw); */
	font-family: monospace;
	font-size: 2.0rem;
	font-weight: bolder;
	text-align: center;
	margin-bottom: 0.5rem;
	margin-top: 0.5rem;
	color: var(--bs-info-text-emphasis);
}

.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}


.material-icons-outlined {
  font-size: 24px; /* Rozmiar ikony */
 /* color: black; /* Kolor konturu ikony */
}

.material-icons-outlined1 {
  font-family: 'Material Icons';
  font-weight: lighter;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}

.logowanie{
  z-index: 9999;
 }
 .logowanie nav{
   position: absolute;
   width: 100%;
 }

.clickable-value {
  /* cursor: pointer; */
  cursor: cell; 
  /* cursor: zoom-in; */
}


.iconapp, .iconapp2 {
  display: inline-block;
  width: 24px;
  height: 24px;
  fill: var(--bs-body-color);
  background-size: contain;

  /* background-color: #0087fc; */
}


.iconapp path {
  /* stroke:rgb(42, 9, 230) */
  fill: none;
  /* fill: var(--bs-body-bg); */

  stroke: var(--bs-body-color);
  /* stroke: red; */
  stroke-width: 1.5;
}

.iconapp.power {
  background: url('../images/icon/power.svg') no-repeat center center;
}

.btnDark {
  background-color:  #212529;
  align-self: center;
  margin-left: 10px;
  border: solid 2px gray;
  border-radius: 50px;
  cursor: pointer;
  height: 20px;
  outline-width: 1px;
  position: relative;
  width: 40px;

}


.icon {
  background-color: grey;
  border-radius: 100%;
  content: "";
  display: block;
  height: 14px;
  margin: -6px -3px;
  position: relative;
  width: 15px;
  transition: background-color 0.5s, transform .5s;   /* transformacja - zmiana koloru przez 0.5 sek. i zmiana położenia przez 0.5sek*/
}

body.dark .icon {
  background: yellow;
 transform: translateX(16px); /* zmiana położenia */
}

body.dark .icon::after {
  content: "";
  background: #212529;
  border-radius: 100%;
  display: block;
  left: -5px;
  height: 12px;
  top: 1px;
  width: 15px;
  position: absolute;
}




.navbar-top {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000; /* Zapewnia, że navbar będzie na wierzchu innych elementów */
}



.tblq{
  margin-bottom: q;

  /* --tbl-padding: 1rem; */
  position: relative;
  padding: 3rem;
  /* margin: 0 -1.5rem 1rem; */
  margin-bottom: 1rem;
  border: solid #0087fc;
  /* border-width: 1px 0; */
  /* border-style: solid; */

}

/* tbody, td, tfoot, th, thead, tr {
  border-color: inherit;
  border-style: solid;
  border-width: 1px;
} */

/* --bs-body-color */


  
  .math {
    font-family: math;
  
  }

  /* Kontener na tekst */
  .namerod-text {
    /* position: absolute; uniesione ponad tło */
    position: initial; /* uniesione ponad tło */
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    /* left: 50%; */
    /* transform: translate(-50%, -50%); */
    /* transform: translate(0%, -25%); */
    /* color: #fff; */
    /* color: #71deec87; */
    /* color: rgb(147 234 153 / 73%); */
    color: rgb(28 140 13 / 80%);
    /* Możesz ustawić większą czcionkę itp. */
    font-family: cursive;
    font-variant: petite-caps;
    font-size: xx-large;
    padding: 25px;
    text-align: center; 
    
    white-space: pre-wrap; 
    /* white-space: pre-line; */
    /* ^ To powoduje zachowanie \n jako nowa linia */
  }

  
.menu-poz {
  top: -2px;
}

/* color: #c8c8c8e3; */

.menu-poz 
.nav-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  /* text-align: center; */
}

/* .menuLeft{
  background: #e81500;
}

.menuLeft .dropdown-menu{
  background: rgba(var(--bs-emphasis-color-rgb), 0.3);
}

.menuLeft .nav-link{
  /* color: var(--bs-light-text-emphasis); * /
  color: red;
} */

.menuTop .ms-2{
  margin-left: 0px !important;
  text-align: center;
}

.menuTop .nav-link:hover { 
  color: var(--bs-primary);
}

.menuTop .nav-link.show { 
  color: var(--bs-info);
}

.menuLeft .ms-2{
  margin-left: 1rem !important;
  text-align: left;
  font-size: larger;
}

/* d-flex flex-column align-items-center */

.layout-container {
     min-height: 100%; 
     display: block;
    /* background-color: rgb(168, 165, 165); */
  }

[data-bs-theme="dark"] .menuLeft .nav-link { 
  color: rgba(var(--bs-emphasis-color-rgb), 0.55); 
}

[data-bs-theme="dark"] .menuLeft .nav-link:hover { 
  color: var(--bs-primary);
}

[data-bs-theme="dark"] .menuLeft .nav-link.show { 
  color: var(--bs-info);
}




.avatar {
    display: inline-flex;
    height: 2.5rem;
    width: 2.5rem;
    border-radius: 50%;
    position: relative;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  .avatar .avatar-img {
    border-radius: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    height: 2rem;
    width: auto;
  }
  
  .avatar-xs {
    height: 1.25rem;
    width: 1.25rem;
  }
  .avatar-xs .avatar-img {
    height: 1rem;
  }
  
  .avatar-sm {
    height: 1.75rem;
    width: 1.75rem;
  }
  .avatar-sm .avatar-img {
    height: 1.5rem;
  }
  
  .avatar-lg {
    height: 2.5rem;
    width: 2.5rem;
  }
  .avatar-lg .avatar-img {
    height: 2.5rem;
  }
  
  .avatar-xl {
    height: 3rem;
    width: 3rem;
  }
  .avatar-xl .avatar-img {
    height: 3rem;
  }
  
  .avatar-xxl {
    height: 3.75rem;
    width: 3.75rem;
  }
  .avatar-xxl .avatar-img {
    height: 3.75rem;
  }
  
  .avatar-busy::before,
  .avatar-idle::before,
  .avatar-offline::before,
  .avatar-online::before {
    content: "";
    position: absolute;
    bottom: 10%;
    right: 20%;
    width: 20%;
    height: 20%;
    border-radius: 50%;
    background-color: #d4dae3;
    border: 0.0625rem solid #fff;
  }
  
  .avatar-busy::before {
    background-color: #e81500;
  }
  
  .avatar-idle::before {
    background-color: #f4a100;
  }
  
  .avatar-offline::before {
    /* background-color: #d4dae3; */
    background-color: red;
  }
  
  .avatar-online::before {
    background-color: #00ac69;
  }

/* Icons */
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}



.darkenPage {
  height: 100%;
  width: 100%;
  position:fixed;
  top: 0px;
  left: 0px;
  background-color: rgb(0, 0, 0);
}

.darkenPage1 {
  background: rgba(0, 0, 0, 0.3);
}


/* body.dark */
/* .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { */
  /* color: #ff0000; */
  /* background-color: #4d42a27d; */
  /* 96c2ec7d */
  /* border-color: var(--bs-nav-tabs-link-active-border-color); */
/* } */




.nav-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: var(--bs-nav-link-font-weight);
  /* color: #c8c8c8e3; */
  text-decoration: none;
  background: 0 0;
  border: 0;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}


body .user-dane{
  /* --bs-text-opacity: 2;
  color: rgba(var(--bs-warning-rgb),var(--bs-text-opacity))!important; */
  color:rgba(12, 1, 68, 0.764);
  text-align: center;
}

.user-dane-e{
    color:rgba(0, 6, 44, 0.764);
    text-align: center;
}

body.dark .user-dane{
  /* --bs-text-opacity: 2;
  color: rgba(var(--bs-warning-rgb),var(--bs-text-opacity))!important; */
  color:rgba(243, 236, 21, 0.764);
  text-align: center;
}

body.dark .user-dane-e{
  --bs-text-opacity: 1;
    color: rgba(var(--bs-info-rgb),var(--bs-text-opacity));
    text-align: center;
}

body.light .user-dane{
  /* --bs-text-opacity: 2;
  color: rgba(var(--bs-warning-rgb),var(--bs-text-opacity))!important; */
  color:rgba(255, 6, 6, 0.764);
  text-align: center;
}

 #user-opl-pane{
   font-size: 14px;

 }

.authentication {
  /* position: absolute; */
  /* top: 50%; */
  /* left: 50%; */
  transform: translate(0%, 50%);
  /* transform: translate(-50%, -50%); */
}

/* .form-control::placeholder {
  color: #ff0606;
  opacity: 1;
} */


.form-control2 {
  display: block;
  width: 100%;
  text-align: end;
  padding: 0.15rem 0.7rem;
  font-size: 0.8rem;
  font-weight: 400;
  line-height: 1.6;
  color: var(--bs-body-color);
  /* color: var(--bs-secondary-bg); */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--bs-body-bg);
  background-clip: padding-box;
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control2:disabled {
  background-color: var(--bs-secondary-bg);
  opacity: 1;
}

.eye-icon {
  cursor: pointer;
  /* position: absolute; */
  display: flex;
  justify-content: center;
  /* width: 20%; */
  /* height: 20%; */
  top: 0;

  
}


/* input.form-control */
/* body.light  .input-group
{
  border: groove;

} */

.popover {
  max-width: none; /* Allow popover to be as wide as needed */
  white-space: nowrap; /* Prevent line breaks */
}

.autorize-popover {
  /* --bs-popover-max-width: 200px; */
  --bs-popover-border-color: var(--bs-danger-border-subtle);
  --bs-popover-header-bg: var(--bs-danger-border-subtle);
  --bs-popover-header-color: var(--bs-white);
  --bs-popover-body-padding-x: 1rem;
  --bs-popover-body-padding-y: .5rem;
}


.btn-group-vertical .btn[first] {
  border-bottom-left-radius: 0rem;
  border-bottom-right-radius: 0rem;
}

 .btn-group-vertical .btn[last] {
  border-top-left-radius: 0rem;
  border-top-right-radius: 0rem;
} 

.btn-group .btn[first] {
  border-top-right-radius: 0rem;
  border-bottom-right-radius: 0rem;
}

 .btn-group .btn[middle],
 .btn-group-vertical .btn[middle]  {
  border-top-left-radius: 0rem;
  border-top-right-radius: 0rem;
  border-bottom-left-radius: 0rem;
  border-bottom-right-radius: 0rem;
} 

.btn-group .btn[last]  {
  border-top-left-radius: 0rem;
  border-bottom-left-radius: 0rem;
} 


/* .btn[disabled] {
  pointer-events: none;
} */

/* .spinner-border,
.htmx-indicator {
    display: none;
}

button .htmx-request .label-text {
    display: none;
}

button .htmx-request.spinner-border,
button .htmx-request.htmx-indicator {
    display: inline-block;
} */


/* .htmx-indicator{
  display:none;
} */

fieldset:disabled {
  opacity: 0.4;
}


.htmx-request .htmx-indicator,
.htmx-request .htmx-indicator.d-none {
  display: block !important;
}
.htmx-request.htmx-indicator{
  display: inline !important;
}

.htmx-request .label-text{
  display: none !important;
}




/* .label-text{
  display: block !important;
} */

.table-hover tbody tr:hover {
  /* background-color: #f5f5f5; */
  cursor: pointer;
}

.table {
  vertical-align: middle;

} 

.table td, .table thx {
  /* font-size: 12px; Dostosuj rozmiar czcionki */
  white-space: nowrap; /* Zapobiega zawijaniu tekstu */
  overflow: hidden; /* Ukrywa tekst, który wychodzi poza komórkę */
  text-overflow: ellipsis; /* Dodaje "..." jeśli tekst jest za długi */
}


.table tr.text-danger-emphasis td,
.table tr.text-danger-emphasis th {
  color: inherit;
}

.table tr.bg-danger-subtle td,
.table tr.bg-danger-subtle th {
  background: inherit;
}
    

.popover {
  max-width: none; /* Allow popover to be as wide as needed */
  white-space: nowrap; /* Prevent line breaks */
}
.popover-body {
  font-size: 12px; /* Adjust the font size as needed */
}
.popover-header {
  font-size: 14px; /* Adjust the font size as needed */
}

/* .card-body.dzdod{
  
} */

.card-text .text-dz{
  color: var(--bs-primary-text-emphasis);
  font-size: medium;
  font-weight: bold;
}

input[type=number].no-spinners::-webkit-outer-spin-button,
input[type=number].no-spinners::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* input[type=number].no-spinners {
    -moz-appearance: textfield;
} */

.x8 {
  transform: scale(0.8); /* Adjust the scale percentage as needed */
  /* transform-origin: top ; */
  /* transform-origin: top left; */
}

.x9 {
  transform: scale(0.9); /* Adjust the scale percentage as needed */
  transform-origin: top ;
  /* transform-origin: top left; */
}


.dropdown-submenu {
  position: relative;
}

.dropdown-submenu .dropdown-menu {
  top: 40;
  left: -70px;
  margin-top: -1px;
}


.responsive-table {
  width: 100%;
  /* background-color: #141ff1; */
  table-layout: fixed;
}

.responsive-table th,
.responsive-table td {
  /* overflow: hidden; */
  text-overflow: ellipsis;
  white-space: nowrap;
}


.icon-link-PDF,
.icon-link-CSV,
.icon-link-PRINT,
.icon-link-EDIT,
.icon-link-DELETE {
	display: inline-block;
	border: none;
	background: none;
	padding: 5px;
	text-decoration: none;
	line-height: 1;
	cursor: pointer;
	transition: opacity 0.15s, transform 0.15s;
	font-size: 48px;
}

.icon-link-PDF:hover,
.icon-link-CSV:hover,
.icon-link-PRINT:hover,
.icon-link-EDIT:hover,
.icon-link-DELETE:hover {
	opacity: 0.75;
	transform: scale(1.3);
	text-decoration: none;
}

/* ===== Konkretne ikony (Font Awesome 6) ===== */
.icon-link-PDF::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f1c1";  /* fa-file-pdf */
	font-size: 48px;
	color: red;
}

.icon-link-CSV::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f6dd"; /* fa-file-csv */
	font-size: 48px;
	color: yellowgreen;
}

.icon-link-PRINT::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f02f"; /* fa-print */
	font-size: 48px;
}

.icon-link-EDIT::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f044"; /* fa-pen-to-square */
	font-size: 48px;
}

.icon-link-DELETE::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f2ed"; /* fa-trash */
	font-size: 48px;
}