* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, sans-serif; background: #f5f7fb; color: #222; }
header { background: #183153; color: white; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { font-weight: bold; font-size: 20px; }
nav a { color: white; text-decoration: none; margin-left: 14px; }
main { max-width: 96vw; margin: 24px auto; padding: 0 16px; }
.card { background: white; border-radius: 12px; padding: 20px; box-shadow: 0 4px 16px rgba(0,0,0,.07); margin-bottom: 20px; }
h1, h2 { margin-top: 0; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.stat { background: white; border-radius: 12px; padding: 20px; box-shadow: 0 4px 16px rgba(0,0,0,.07); }
.stat strong { display: block; font-size: 30px; margin-top: 8px; }
label { display: block; margin: 12px 0 6px; font-weight: bold; }
input, select, textarea { width: 100%; padding: 10px; border: 1px solid #ccd3dd; border-radius: 8px; font-size: 15px; }
textarea { min-height: 90px; }
button, .btn { display: inline-block; border: 0; background: #1f6feb; color: white; padding: 10px 14px; border-radius: 8px; text-decoration: none; cursor: pointer; font-size: 14px; }
.btn.secondary { background: #667085; }
.btn.danger { background: #c0392b; }
.btn.success { background: #198754; }
.btn.warning { background: #b7791f; }
table { width: 100%; border-collapse: collapse; background: white; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 16px rgba(0,0,0,.07); }
th, td { padding: 11px; border-bottom: 1px solid #e6e9ef; text-align: left; vertical-align: top; }
th { background: #eef2f7; }
.badge { padding: 4px 8px; border-radius: 999px; font-size: 12px; display: inline-block; }
.badge.nowe { background: #e7f0ff; }
.badge.przyjete { background: #fff4d6; }
.badge.zrealizowane { background: #dff5e7; }
.badge.niezrealizowane { background: #fde2e1; }
.badge.odwolany { background: #eeeeee; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.error { color: #b42318; margin-bottom: 12px; }
.success-msg { color: #146c43; margin-bottom: 12px; }
.login { max-width: 420px; margin: 70px auto; }
.success-box { color: #146c43; background: #dff5e7; border: 1px solid #a7e0bb; border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; }
.inline-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.inline-form input { min-width: 160px; }
button.danger { background: #c0392b; }
button.success { background: #198754; }
button.warning { background: #b7791f; }
.brand { display:flex; align-items:center; gap:14px; }
.logo { height:52px; width:auto; max-width:280px; object-fit:contain; background:white; border-radius:6px; padding:4px; }
nav { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
nav a { margin-left:0; }
.bell { position:relative; font-size:20px; padding:6px 8px; }
.bell span { position:absolute; top:-4px; right:-8px; background:#c0392b; color:white; border-radius:999px; padding:1px 6px; font-size:12px; }
td, th { overflow-wrap: break-word; word-break: normal; }
table { table-layout: auto; }
.wide { grid-column:1 / -1; }
.pagination { margin:12px 0; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.focused-row { outline:3px solid #1f6feb; animation: flash 2s ease-in-out 1; }
.unread { font-weight:bold; background:#fff9e6; }
@keyframes flash { 0%{background:#fff4d6;} 100%{background:white;} }
input[maxlength], textarea[maxlength] { }
@media (max-width: 900px) { header { align-items:flex-start; flex-direction:column; } .logo { max-width:220px; } }
.inline-form select { width: auto; min-width: 90px; }
.transport-form .cycle-fields { transition: opacity .15s ease; }

.cycle-day-row {
    display: grid;
    grid-template-columns: 90px minmax(160px, 1fr) minmax(120px, 160px);
    gap: 10px;
    align-items: center;
    margin-bottom: 8px;
}
@media (max-width: 700px) {
    .cycle-day-row { grid-template-columns: 1fr; }
}

/* Uniwersalny wybór daty/godziny - działa także w Firefox bez natywnych ikon */
.picker-trigger{
    width:auto;
    min-width:42px;
    margin-left:6px;
    padding:8px 10px;
    vertical-align:middle;
}
.picker-popover{
    background:#fff;
    border:1px solid #ccd3dc;
    border-radius:10px;
    box-shadow:0 10px 30px rgba(0,0,0,.18);
    padding:10px;
    max-width:320px;
}
.picker-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:8px;
}
.picker-header button,
.picker-footer button{
    width:auto;
    padding:6px 10px;
}
.date-grid{
    display:grid;
    grid-template-columns:repeat(7, 1fr);
    gap:4px;
}
.date-weekdays{
    font-size:12px;
    font-weight:700;
    color:#526070;
    text-align:center;
    margin-bottom:4px;
}
.date-grid button{
    width:36px;
    min-width:36px;
    padding:7px 0;
    border-radius:7px;
    background:#f4f6f8;
    color:#1c2733;
}
.date-grid button.selected{
    outline:2px solid #1f5f99;
    font-weight:700;
}
.picker-footer{
    display:flex;
    justify-content:flex-end;
    gap:6px;
    margin-top:10px;
}
.time-picker-box{
    display:flex;
    gap:10px;
    align-items:end;
}
.time-picker-box label{
    margin:0;
}
.time-picker-box select{
    min-width:90px;
}
input.date-picker,
input.time-picker{
    max-width:220px;
    background:#fff;
    cursor:pointer;
}

.cycle-count-row { display:flex; gap:8px; align-items:center; }
.cycle-count-row input { max-width:160px; }
.small-btn { width:auto; padding:8px 12px; }

/* v9.9 - porządek na podstronie Nowe zgłoszenie */
.transport-form {
    align-items: start;
}
.transport-form > div {
    min-width: 0;
}
.transport-form label {
    min-height: 20px;
}
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    margin: 12px 0 0;
    font-weight: bold;
}
.checkbox-label input[type="checkbox"] {
    width: auto;
    flex: 0 0 auto;
}
.single-transport-fields.single-disabled {
    opacity: .45;
}
.single-transport-fields.single-disabled::after {
    content: "Wyłączone przy zleceniu cyklicznym";
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #667085;
}
.cycle-toggle {
    padding: 12px 14px;
    border: 1px solid #d9e0ea;
    border-radius: 10px;
    background: #f8fafc;
}
.cycle-toggle small {
    display: block;
    margin-top: 4px;
    color: #667085;
}
.cycle-panel {
    padding: 14px;
    border: 1px solid #d9e0ea;
    border-radius: 10px;
    background: #fbfcfe;
}
.cycle-count-row {
    display: grid;
    grid-template-columns: minmax(170px, 220px) minmax(120px, 180px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.cycle-count-row label {
    margin: 0 0 6px;
}
.cycle-count-row input {
    max-width: 180px;
}
.cycle-days-header,
.cycle-day-row {
    display: grid;
    grid-template-columns: 110px minmax(240px, 1fr) minmax(210px, 280px);
    gap: 12px;
    align-items: center;
}
.cycle-days-header {
    padding: 8px 10px;
    background: #eef2f7;
    border-radius: 8px;
    font-weight: bold;
    color: #344054;
    margin-bottom: 8px;
}
.cycle-day-row {
    padding: 10px;
    border: 1px solid #edf0f5;
    border-radius: 8px;
    background: #fff;
    margin-bottom: 8px;
}
.cycle-day-index {
    font-weight: bold;
    color: #183153;
}
.picker-field {
    display: flex;
    align-items: center;
    gap: 6px;
}
.picker-field input.date-picker,
.picker-field input.time-picker,
.single-transport-fields input.date-picker,
.single-transport-fields input.time-picker {
    max-width: none;
    flex: 1 1 auto;
}
@media (max-width: 800px) {
    .cycle-count-row,
    .cycle-days-header,
    .cycle-day-row {
        grid-template-columns: 1fr;
    }
    .cycle-days-header { display: none; }
}


/* v9.10 - lepsze wyrównanie pól zlecenia cyklicznego na stronie Nowe zgłoszenie */
.cycle-days-header,
.cycle-day-row {
    grid-template-columns: 90px minmax(260px, 1fr) minmax(220px, 1fr);
    column-gap: 14px;
    align-items: center;
}
.cycle-day-row {
    min-height: 64px;
}
.cycle-day-row .picker-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    gap: 8px;
    align-items: center;
    min-width: 0;
}
.cycle-day-row .picker-field input.date-picker,
.cycle-day-row .picker-field input.time-picker {
    width: 100%;
    max-width: none;
    min-width: 0;
    height: 42px;
}
.picker-trigger {
    width: 42px;
    height: 42px;
    min-width: 42px;
    max-width: 42px;
    padding: 0;
    margin-left: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-size: 18px;
    border-radius: 8px;
    flex: 0 0 42px;
}
.single-transport-fields .picker-trigger,
.grid .picker-trigger,
.card .picker-trigger {
    width: 42px;
    height: 42px;
    min-width: 42px;
    max-width: 42px;
}
.single-transport-fields {
    min-width: 0;
}
@media (max-width: 800px) {
    .cycle-days-header,
    .cycle-day-row {
        grid-template-columns: 1fr;
    }
    .cycle-day-row .picker-field {
        grid-template-columns: minmax(0, 1fr) 42px;
    }
}

/* v9.11 - teleporada */
.teleconsultation-box {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 12px;
    background: #f9fafb;
}
.teleconsultation-file-field {
    margin-top: 10px;
    display: none;
}
.teleconsultation-file-field.is-visible {
    display: block;
}
.teleconsultation-file-field input[type="file"] {
    width: 100%;
    max-width: 520px;
    background: #fff;
}
.small-note {
    margin: 6px 0 8px;
    font-size: 13px;
    color: #4b5563;
}




/* Korekta tabeli transportów: stabilne szerokości bez nachodzenia nagłówków */
.table-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0,0,0,.07);
    background: white;
}
.table-scroll table {
    box-shadow: none;
    border-radius: 0;
}
.transports-table {
    width: 100%;
    min-width: 1500px;
    table-layout: fixed;
    font-size: 13px;
}
.transports-table th,
.transports-table td {
    padding: 9px 8px;
    line-height: 1.28;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
    vertical-align: top;
}
.transports-table th {
    white-space: normal;
    line-height: 1.18;
}
.transports-table td {
    white-space: normal;
}
.transports-table .nowrap,
.transports-table .status-date,
.transports-table .badge {
    white-space: nowrap;
}
.transports-table col.col-date { width: 7%; }
.transports-table col.col-clinic { width: 9%; }
.transports-table col.col-patient { width: 12%; }
.transports-table col.col-doctor { width: 12%; }
.transports-table col.col-route { width: 11%; }
.transports-table col.col-payment { width: 10%; }
.transports-table col.col-status { width: 9%; }
.transports-table col.col-ambulance { width: 8%; }
.transports-table col.col-tele { width: 8%; }
.transports-table col.col-notes { width: 6%; }
.transports-table col.col-actions { width: 8%; }
.transports-table td.date-cell {
    white-space: nowrap;
}
.transports-table td.status-cell {
    overflow-wrap: normal;
    word-break: normal;
}
.status-cell .badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 94px;
    text-align: center;
    margin-bottom: 6px;
}
.status-date-label {
    display: inline-block;
    font-size: 12px;
    font-weight: bold;
    color: #475467;
    margin-top: 2px;
}
.status-date {
    display: inline-block;
    font-size: 12px;
    line-height: 1.25;
}
.transports-table td.actions {
    overflow-wrap: normal;
    word-break: normal;
}
.transports-table .actions form {
    margin-bottom: 6px;
}
.transports-table .actions button,
.transports-table .actions .btn {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    font-size: 13px;
    line-height: 1.15;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    text-align: center;
}
.transports-table .actions textarea,
.transports-table .actions select {
    width: 100%;
    box-sizing: border-box;
}
.transports-table td:nth-child(9),
.transports-table td:nth-child(10) {
    overflow-wrap: break-word;
    word-break: normal;
}
@media (max-width: 1100px) {
    main { max-width: 100%; padding: 0 8px; }
    .transports-table { font-size: 12px; min-width: 1420px; }
    .transports-table th,
    .transports-table td { padding: 7px 6px; }
}


.patient-lookup-suggestion {
    margin-top: 8px;
    padding: 10px 12px;
    border: 1px solid #bcd7ff;
    background: #f2f7ff;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.35;
}
.patient-lookup-suggestion span {
    color: #374151;
}
.patient-lookup-actions {
    margin-top: 8px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.patient-lookup-actions button {
    padding: 6px 10px;
    font-size: 13px;
}


/* Korekta formularza: wybór daty/godziny po kliknięciu w pole, bez ikon, oraz równe rzędy pól */
.picker-trigger {
    display: none !important;
}
.transport-form {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 18px 16px;
    align-items: start;
}
.transport-form > div:not(.wide) {
    display: flex;
    flex-direction: column;
    min-height: 86px;
}
.transport-form > div:not(.wide) > label:not(.checkbox-label) {
    min-height: 42px;
    display: flex;
    align-items: flex-end;
    margin: 0 0 6px;
    line-height: 1.15;
}
.transport-form input,
.transport-form select {
    min-height: 40px;
}
.transport-form .single-transport-fields input.date-picker,
.transport-form .single-transport-fields input.time-picker,
.transport-form .picker-field input.date-picker,
.transport-form .picker-field input.time-picker {
    width: 100%;
    max-width: none;
    flex: none;
}
.transport-form .single-transport-fields {
    display: flex;
    flex-direction: column;
}
.transport-form .picker-field {
    display: block;
}
.transport-form .checkbox-label {
    min-height: 42px;
    margin: 42px 0 0;
    display: flex;
    align-items: center;
}
.transport-form .cycle-toggle .checkbox-label,
.transport-form .teleconsultation-box .checkbox-label {
    margin: 0;
    min-height: 32px;
}
.cycle-day-row .picker-field {
    display: block;
}
.cycle-days-header,
.cycle-day-row {
    grid-template-columns: 90px minmax(220px, 1fr) minmax(180px, 1fr);
}
.cycle-day-row .picker-field input.date-picker,
.cycle-day-row .picker-field input.time-picker {
    height: 40px;
}
@media (max-width: 800px) {
    .transport-form > div:not(.wide) > label:not(.checkbox-label) {
        min-height: auto;
    }
    .transport-form .checkbox-label {
        margin-top: 0;
    }
}

/* Układ nowego zlecenia po zmianie kolejności pól */
.transport-form .form-section {
    min-height: auto !important;
    font-weight: 700;
    font-size: 16px;
    padding: 8px 0 2px;
    border-bottom: 1px solid #e5e7eb;
    color: #111827;
}
.optional-label {
    font-weight: 400;
    color: #6b7280;
    font-size: 12px;
}


/* 2026-05-29 BUTTONS INLINE REAL FINAL */
.transport-form .transport-submit-row {
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    margin-top: 12px !important;
}

.transport-form .transport-submit-row button,
.transport-form .transport-submit-row .btn {
    width: auto !important;
    min-width: 170px !important;
    max-width: 220px !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

/* awaryjnie: gdyby hosting miał stary transports.php z dawnym divem */
.transport-form > div:last-child:has(button) {
    grid-column: 1 / -1 !important;
}

@media (max-width: 420px) {
    .transport-form .transport-submit-row {
        flex-wrap: wrap !important;
    }
}
