/* =========================
HISTORIA — STABILNA + CZYTELNA 🔥
========================= */

.historia_item{
    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:16px 18px;
    border:1px solid #e5e7eb;
    border-radius:12px;
    margin-bottom:12px;

    background:white;
    transition:0.2s;

    cursor:pointer;
}

.historia_item:hover{
    background:#f8fafc;
    border-color:#dbe1ea;
}

/* LEWA */

.historia_left{
    display:flex;
    gap:16px;
    align-items:flex-start;
    flex:1;
}

/* DATA */

#historia_data_filter{
    flex-shrink:0;              /* 🔥 FIX */
    width:160px;
    height:32px;
    padding:6px 10px;
    border-radius:6px;
    border:1px solid #d1d5db;
    font-size:13px;
    background:white;
}

/* DATA (ważniejsza) */
.data_dzien{
    font-size:15px;
    font-weight:600;
    line-height:1.2;
}

/* GODZINA */
.data_godzina{
    font-size:13px;
    color:#6b7280;
    line-height:1;
}

/* ŚRODEK */

.historia_main{
    display:flex;
    flex-direction:column;
    gap:5px;
}

/* TAG */

.modul{
    display:inline-block;
    padding:4px 10px;
    border-radius:8px;
    font-size:12px;
    font-weight:600;
    width:fit-content;
}

.modul.kalkulator{
    background:var(--green-soft);
    color:var(--green);
}

.modul.rozcienczenia{
    background:var(--green-soft);
    color:var(--green-strong);
}

.modul.ceny{
    background:#fef3c7;
    color:#92400e;
}

/* TYTUŁ */

.historia_tytul{
    font-size:16px;
    font-weight:600;
}

/* OPIS */

.historia_opis{
    font-size:14px;
    color:#6b7280;
}

/* PRAWA */

.historia_action{
    flex-shrink:0;
}

.historia_action button{
    background:var(--green);
    color:white;
    padding:6px 12px;
    border-radius:6px;
    border:none;
    font-size:13px;
    cursor:pointer;
}

.historia_action button:hover{
    background:var(--green-strong);
}

/* =========================
SZCZEGÓŁY
========================= */

.historia_details{
    display:none;
    width:100%;
    margin-top:12px;

    padding:12px;
    border-radius:10px;
    background:#f1f5f9;
    font-size:14px;
    line-height:1.5;
}

.historia_item.open{
    flex-wrap:wrap;
}

.historia_item.open .historia_details{
    display:block;
}

/* =========================
FILTRY
========================= */

.historia_filtry{
    display:flex;
    gap:8px;
}

.filtr_btn{
    background:#eef2f7;
    border:none;
    padding:6px 14px;
    border-radius:8px;
    font-size:13px;
    cursor:pointer;
    color:#333;
    transition:0.2s;
}

.filtr_btn:hover{
    background:var(--green-soft);
}

.filtr_btn.aktywny{
    background:var(--green);
    color:white;
}

/* =========================
TOPBAR (🔥 NOWE)
========================= */

.historia_topbar{
    display:flex;
    gap:10px;
    align-items:center;
    margin:8px 0 10px 0;
}

.search_wrapper{
    position:relative;
    flex:1;
    display:flex;
}

/* SEARCH FIX */

.search_box{
    width:100%;
    padding:10px 12px;
    border-radius:8px;
    border:1px solid #d1d5db;
    background:#ffffff;
    box-shadow:0 1px 2px rgba(15, 23, 42, 0.06);
    font-size:14px;
    box-sizing:border-box;
}

.historia_search{
    width:100%;
    margin:0;                      /* 🔥 FIX */
    padding:6px 34px 6px 10px;
    border-radius:6px;
    border:1px solid #d1d5db;
    font-size:13px;
    height:32px;                  /* 🔥 dopasowanie */
    box-sizing:border-box;
}

/* X FIX */

#clear_search {
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    cursor:pointer;
    font-size:13px;
    display:none;
    color:#888;
}

/* =========================
RESPONSIVE
========================= */

@media (max-width:700px){

    .historia_left{
        flex-direction:column;
        gap:6px;
    }

    .historia_action{
        margin-top:10px;
    }

}

/* =========================
RESZTA — NIE RUSZANA
========================= */

.sticky_panel {
position: sticky;
bottom: 0;
background: var(--bg-elevated);
padding: 14px 20px;
border-top: 1px solid var(--border);
display: flex;
justify-content: space-between;
align-items: center;
gap: 10px;
z-index: 20;
}

.sekcja_naglowek {
display: flex;
align-items: baseline;
justify-content: flex-start;
gap: 10px;
flex-wrap: wrap;
}

.sekcja_naglowek .mini_btn {
display: inline-flex !important;
align-items: center;
width: auto !important;
min-width: 0;
background: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0;
font-size: 12px;
line-height: 1;
font-weight: 500;
color: #6b7280 !important;
cursor: pointer;
appearance: none;
}

.sekcja_naglowek .mini_btn:hover {
background: transparent !important;
color: #111827 !important;
text-decoration: underline;
}

.sticky_panel button {
background: var(--green);
color: white;
padding: 10px 18px;
border-radius: 8px;
border: none;
cursor: pointer;
font-weight: 600;
}

.sticky_panel button:hover {
background: var(--green-strong);
}

.container {
padding-bottom: 80px;
}

.wynik_box {
display: flex;
align-items: center;
gap: 15px;
}

.copy_btn {
background: #10b981;
color: white;
border: none;
padding: 8px 14px;
border-radius: 6px;
cursor: pointer;
font-weight: 600;
}

.copy_btn:hover {
background: #059669;
}.copy_btn {
transition: all 0.2s ease;
}
.reset_box {
margin-top: 20px;
}
.reset_box button {
width: 100%;
background: var(--green);
color: white;
padding: 12px;
border-radius: 8px;
border: none;
cursor: pointer;
font-weight: 600;
}
.reset_box button:hover {
background: var(--green-strong);
}
#parametry_box{
margin-top:10px;
}
.param_btn{
margin:5px;
padding:8px 12px;
border:1px solid #ccc;
background:#f5f5f5;
cursor:pointer;
width:auto;
}
.param_btn.active{
background:#4CAF50 !important;
color:white !important;
border-color:#4CAF50;
}
#parametry_box button{
width:auto !important;
background:#f5f5f5 !important;
color:#000 !important;
}
#parametry_box button.active{
background:#4CAF50 !important;
color:white !important;
}
#btn_parametry.hide {
background:#e74c3c !important;
color:white !important;
}
#btn_parametry.hide:hover {
background:#c0392b !important;
}
.profil_lista {
border: 1px solid var(--border);
border-radius: 8px;
margin-top: 6px;
background: var(--bg-elevated);
max-height: 150px;
overflow-y: auto;
}
.profil_option {
padding: 10px 12px;
cursor: pointer;
}
.profil_option:hover {
background: var(--green-soft);
}
/* =========================
PROFIL SELECT (jak kalkulator)
========================= */
#profil_box{
position: relative;
width: 100%;
}
#profil_input{
width: 100%;
padding: 10px 12px;
border-radius: 8px;
border: 1px solid #ccc;
font-size: 14px;
}
/* 🔥 LISTA */
.profil_lista{
position: absolute;
top: 100%;
left: 0;
width: 100%;
max-height: 180px;
overflow-y: auto;
background: var(--bg-elevated); border: 1px solid var(--border); border-top: none; border-radius: 0 0 8px 8px; box-shadow: 0 4px 10px rgba(0,0,0,0.05); z-index: 50; 
}
/* 🔥 OPCJA */
.profil_option{
padding: 10px 12px;
cursor: pointer;
font-size: 14px;
}
.profil_option:hover{
background: var(--green-soft);
}
/* =========================
TOP CONTROLS (profil + morfologia)
========================= */
.top_controls {
display: flex;
flex-direction: column;
gap: 12px;
margin-bottom: 20px;
}
.profil_wrapper {
margin-bottom: 5px;
}
.morfologia_wrapper {
margin-top: 4px;
}
/* =========================
SWITCH MORFOLOGIA (NOWY)
========================= */
.switch_morfologia {
display: inline-flex;
gap: 6px;
margin-top: -10px;
background: var(--bg-muted);
padding: 4px;
border-radius: 10px;
width: fit-content;
}
.switch_morfologia button {
border: none;
padding: 6px 14px;
border-radius: 8px;
background: transparent;
cursor: pointer;
font-size: 13px;
color: #555;
transition: all 0.2s ease;
}
/* hover */
.switch_morfologia button:hover {
background: var(--green-soft);
}
/* active */
.switch_morfologia button.active {
background: var(--green);
color: white;
}

.hil_toolbar {
display: flex;
flex-direction: column;
gap: 14px;
margin-bottom: 18px;
}

.hil_group {
display: flex;
align-items: center;
gap: 16px;
flex-wrap: wrap;
}

.hil_group label {
font-size: 13px;
font-weight: 600;
color: #334155;
margin: 0;
min-width: 150px;
}

.hil_switch {
display: inline-flex;
gap: 6px;
background: var(--bg-muted);
padding: 4px;
border-radius: 10px;
width: auto;
flex-wrap: wrap;
}

.hil_switch button {
border: none !important;
padding: 6px 14px !important;
border-radius: 8px !important;
background: transparent !important;
cursor: pointer;
font-size: 13px;
font-weight: 600;
color: #475569 !important;
width: auto !important;
min-width: 0 !important;
display: inline-flex !important;
align-items: center;
justify-content: center;
transition: all 0.2s ease;
}

.hil_switch button:hover {
background: var(--green-soft) !important;
}

.hil_switch button.active {
background: var(--green) !important;
color: white !important;
box-shadow: 0 2px 6px color-mix(in srgb, var(--green) 22%, transparent);
}

@media (max-width: 900px) {
.hil_toolbar {
gap: 12px;
}

.hil_group {
align-items: flex-start;
gap: 8px;
}

.hil_group label {
min-width: 0;
}

.hil_switch {
width: 100%;
}

.hil_switch button {
flex: 1 1 auto;
}
}
/* =========================
SEKCJA BADANIA
========================= */
.sekcja_badania {
margin-top: 20px;
}

/*=========================
FIX DATA/GODZINA
=========================*/

.historia_data{
    display:block !important;
}

.historia_data .data_dzien,
.historia_data .data_godzina{
    display:block;
}

/* =========================
PARAMETRY BUTTONY
========================= */

.param_btn {
    padding: 10px 16px;
    border-radius: 10px;
    border: 1px solid #ddd;
    background: #f5f5f5;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 14px;
    margin: 4px;
}

/* hover */
.param_btn:hover {
    background: var(--green-soft);
    border-color: var(--green-border);
}

/* aktywny */
.param_btn.active {
    background: var(--green);
    color: white;
    border-color: var(--green-strong);
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}


