*{box-sizing:border-box}html,body,#map,#app{margin:0;width:100%;height:100%;font-family:Arial}#login{height:100%;display:grid;place-items:center;background:#eef2f5}.login{width:350px;max-width:92%;padding:25px;background:white;border-radius:12px;box-shadow:0 8px 30px #0002}.login input,.login button{width:100%;padding:11px;margin:7px 0}.login button{background:#1976d2;color:white;border:0;border-radius:6px;font-weight:bold}#err{color:#b00020;min-height:20px}.hide{display:none!important}header{height:58px;padding:9px 12px;display:flex;gap:7px;align-items:center;background:white;box-shadow:0 2px 7px #0003;position:relative;z-index:1000}header input{margin-left:auto;width:240px;padding:8px}header select,header button{padding:8px}#map{height:calc(100% - 58px)}.panel{position:absolute;right:15px;top:73px;width:410px;max-width:calc(100% - 30px);max-height:calc(100% - 90px);overflow:auto;background:white;padding:18px;border-radius:10px;box-shadow:0 5px 25px #0004;z-index:1100}.panel input,.panel textarea,.panel select{width:100%;padding:8px;margin:5px 0 10px}.panel button{padding:8px;margin:3px}#who{color:#777;font-size:12px}@media(max-width:700px){header{height:auto;flex-wrap:wrap}header input{margin-left:0;width:100%}#map{height:calc(100% - 100px)}}
#map{position:relative;overflow:hidden;background:#ddd;cursor:grab}
#map:active{cursor:grabbing}
.osm-layer{position:absolute;inset:0;overflow:hidden}
.osm-tile{position:absolute;width:256px;height:256px;user-select:none}
.pin{position:absolute;transform:translate(-50%,-100%);width:26px;height:34px;border:2px solid white;border-radius:50% 50% 50% 0;color:white;font-size:18px;line-height:20px;box-shadow:0 2px 6px #0007;cursor:pointer;z-index:5}
.map-controls{position:absolute;right:12px;top:12px;z-index:20;display:flex;flex-direction:column}
.map-controls button{width:38px;height:38px;margin:2px;border:1px solid #aaa;background:#fff;font-size:22px;border-radius:5px}

/* v13: real pointer-based map controls */
#map{touch-action:none;user-select:none;-webkit-user-select:none;overscroll-behavior:contain}
#map.panning{cursor:grabbing}
.pin{
 width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;
 padding:0!important;margin:-20px 0 0 -10px!important;
 border:2px solid #fff!important;border-radius:50% 50% 50% 0!important;
 transform:rotate(-45deg);box-shadow:0 1px 4px rgba(0,0,0,.45);
 cursor:grab;touch-action:none;z-index:10
}
.pin span{display:block;width:6px;height:6px;margin:5px auto 0;background:#fff;border-radius:50%}
.pin.dragging{cursor:grabbing}

/* v14: pointer based pan/pinch */
#map{touch-action:none!important;overflow:hidden!important}
#map .osm-layer{touch-action:none!important}

/* v15: map is a dedicated gesture surface */
#map{position:relative;overflow:hidden;touch-action:none!important;user-select:none;-webkit-user-select:none}
#map .map-world{position:absolute;transform:translate(0,0);will-change:transform;touch-action:none}
#map .osm-tile{position:absolute;width:256px;height:256px;max-width:none}
#map .pin{touch-action:none}
#map.panning{cursor:grabbing}

/* v16: Android touch is handled by touchstart/touchmove/touchend */
#map,#map .map-world{touch-action:none!important;-webkit-touch-callout:none}

/* v17 Android */
#map{touch-action:none!important;overflow:hidden!important}
#map .pin{touch-action:none!important;-webkit-tap-highlight-color:transparent}

.touch-gesture-layer{display:none;position:absolute;inset:0;z-index:5;background:transparent;touch-action:none}
@media (pointer:coarse){
 #map .touch-gesture-layer{display:block}
 #map .pin{z-index:20}
 #map .map-controls{z-index:30}
}
#map{touch-action:none!important;overflow:hidden!important}

/* v19: keep pins above the touch gesture surface */
#map .map-world{z-index:10}
#map .touch-gesture-layer{z-index:5}
#map .pin{z-index:20!important;pointer-events:auto!important}
#map .map-controls{z-index:30}

/* v20 pinch: gesture layer receives touch events */
#map{touch-action:none!important}
#map .touch-gesture-layer{z-index:5;touch-action:none!important;pointer-events:auto}
#map .map-world{z-index:10}
#map .pin{z-index:20!important}
#map .map-controls{z-index:30}

/* v21: native two-finger pinch */
#map{touch-action:none!important;-webkit-user-select:none;user-select:none}
#map .touch-gesture-layer{display:none!important}

#map{touch-action:none!important}
#map .touch-gesture-layer{display:block!important;position:absolute;inset:0;z-index:5;touch-action:none!important;pointer-events:auto}
#map .map-world{z-index:10}
#map .pin{z-index:20!important}
#map .map-controls{z-index:30}

/* v23: gesture surface ABOVE map, BELOW pins and controls */
#map{touch-action:none!important}
#map .map-world{z-index:10}
#map .touch-gesture-layer{
 display:block!important;
 position:absolute;
 inset:0;
 z-index:15!important;
 touch-action:none!important;
 pointer-events:auto!important;
 background:transparent;
}
#map .pin{z-index:20!important;pointer-events:auto!important}
#map .map-controls{z-index:30!important;pointer-events:auto!important}
/* v25 - Leaflet */
#map{position:relative;overflow:hidden;background:#ddd;cursor:grab;touch-action:auto!important}
#map:active{cursor:grabbing}
.leaflet-container{width:100%;height:100%;font-family:Arial;touch-action:pan-x pan-y pinch-zoom}
.client-marker{background:transparent!important;border:0!important}
.client-pin{width:22px;height:22px;border:2px solid #fff;border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:0 2px 5px #0007;display:flex;align-items:center;justify-content:center}
.client-pin span{width:6px;height:6px;background:#fff;border-radius:50%;display:block}
.leaflet-marker-icon.dragging .client-pin{transform:rotate(-45deg) scale(1.12);box-shadow:0 3px 8px #0008}

/* v26 - Leaflet / mobile fixes */
html,body,#app{width:100%;height:100%;margin:0}
#app{display:flex;flex-direction:column;min-height:0}
header{flex:0 0 auto}
#map{flex:1 1 auto;width:100%;height:auto!important;min-height:0;position:relative;overflow:hidden}
.leaflet-container{width:100%;height:100%;background:#ddd}
.leaflet-control-zoom a{width:34px!important;height:34px!important;line-height:34px!important;font-size:22px!important}
.leaflet-control-home{width:34px!important;height:34px!important;line-height:32px!important;text-align:center;font-size:23px!important;font-weight:bold;cursor:pointer}
.leaflet-control-home:hover{background:#f4f4f4}
.leaflet-control-attribution{font-size:10px}
@media(max-width:700px){
  header{height:auto;min-height:0;padding:10px 12px;flex-wrap:wrap}
  header b{font-size:24px}
  header input{margin-left:0;width:100%;height:44px;font-size:18px}
  header select,header button{height:44px;font-size:18px}
  #map{height:auto!important}
}

/* v27 */
.group-info{display:inline-flex;align-items:center;gap:7px;font-weight:600}
.group-info i{display:inline-block;width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.2)}

/* v29 - group manager */
.group-manager{width:440px}
.group-list{display:flex;flex-direction:column;gap:6px;margin-bottom:18px}
.group-row{display:flex;align-items:center;gap:8px;padding:9px;border:1px solid #ddd;border-radius:7px;background:#fafafa}
.group-swatch{width:18px;height:18px;border-radius:50%;border:1px solid #999;flex:0 0 auto}
.group-name{flex:1;font-weight:600}
.group-row button{margin:0}
.group-row .danger{color:#b00020}
.group-editor{border-top:1px solid #ddd;padding-top:14px}
.group-editor h3{margin:0 0 10px}
.color-line{display:flex;align-items:center;gap:10px;margin:5px 0 14px}
.color-line input[type=color]{width:52px;height:38px;padding:2px}
.color-line span{font-family:monospace;font-weight:600}
@media(max-width:700px){.group-manager{width:calc(100% - 30px);right:15px;left:15px}}

/* v29 - import/export and map capture */
#map{position:relative}
@media(max-width:900px){
  header{gap:6px}
  header button{font-size:14px}
}

.user-list{display:grid;gap:8px;margin:10px 0 18px}.user-row{display:flex;align-items:center;gap:8px;border:1px solid #ddd;border-radius:10px;padding:10px;background:#fafafa}.user-row>div{flex:1}.muted{display:block;color:#777;font-size:12px;margin-top:2px}.user-editor{border-top:1px solid #ddd;padding-top:14px}.user-editor h3{margin:0 0 10px}.check{display:flex;align-items:center;gap:8px;margin:10px 0}.check input{width:auto;margin:0}
.field-history-link{display:inline;padding:0;border:0;background:transparent;color:#174c83;font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.field-history-link:hover{color:#c93640}
.history-entry{padding:12px;margin:12px 0;border:1px solid #d4dde7;border-radius:8px;background:#f7f9fc;overflow-wrap:anywhere}
.history-entry pre{white-space:pre-wrap;font:inherit;margin:6px 0 0;padding:8px;background:#fff;border-radius:5px;max-height:180px;overflow:auto}
.danger{background:#b4232d!important;color:#fff!important;border-color:#b4232d!important}
.muted{color:#64748b;font-size:.9em}

/* v37: szersze okno pełnej bazy klientów */
#databasePanel{width:min(820px,calc(100% - 30px));max-width:calc(100% - 30px)}
#databasePanel .db-table{min-width:740px}
#databasePanel .db-table th,#databasePanel .db-table td{padding:8px 7px;text-align:left;border-bottom:1px solid #e5e7eb;vertical-align:top}
#databasePanel .db-table th{position:sticky;top:0;background:#f8fafc;z-index:1}
@media(max-width:700px){#databasePanel{width:calc(100% - 20px);max-width:calc(100% - 20px);right:10px;left:10px}}

/* Pola wielowierszowe można zmieniać tylko w pionie; szerokość pozostaje stała. */
.panel textarea{resize:vertical;max-width:100%;}

/* v39 — stylistyka inspirowana growo.pl: niebieski, czerwone akcenty, prostota */
:root{
  --brand-blue:#075b96;
  --brand-blue-dark:#064775;
  --brand-blue-light:#eaf4fb;
  --brand-red:#d52b3f;
  --brand-red-dark:#b91f32;
  --ink:#1d2935;
  --muted:#617182;
  --line:#d6e0e8;
  --surface:#fff;
  --surface-soft:#f4f7fa;
  --shadow:0 12px 34px rgba(18,48,75,.18);
}
html,body{color:var(--ink);font-family:Arial,Helvetica,sans-serif;background:#f4f7fa}
#login{background:linear-gradient(135deg,#eaf4fb 0%,#f5f8fb 70%,#fceff1 100%)}
.login{width:390px;padding:32px;border:1px solid var(--line);border-top:5px solid var(--brand-blue);border-radius:8px;box-shadow:var(--shadow)}
.login h1{margin:0 0 22px;color:var(--brand-blue);font-size:26px;letter-spacing:-.4px}
.login input,.panel input,.panel textarea,.panel select,header input,header select{border:1px solid #c7d3de;border-radius:5px;background:#fff;color:var(--ink);font:inherit;outline:none;transition:border-color .15s,box-shadow .15s}
.login input:focus,.panel input:focus,.panel textarea:focus,.panel select:focus,header input:focus,header select:focus{border-color:var(--brand-blue);box-shadow:0 0 0 3px rgba(7,91,150,.12)}
.login input{padding:12px;margin:7px 0;width:100%}
button{font-family:inherit;cursor:pointer;transition:background-color .15s,border-color .15s,box-shadow .15s,transform .08s}
button:active{transform:translateY(1px)}
button,.panel button,header button{border:1px solid #c7d3de;border-radius:5px;background:#fff;color:var(--brand-blue-dark);font-weight:600}
button:hover,.panel button:hover,header button:hover{background:var(--brand-blue-light);border-color:#8fb6d1}
.login button,button.primary,#add{background:var(--brand-blue);border-color:var(--brand-blue);color:#fff}
.login button:hover,button.primary:hover,#add:hover{background:var(--brand-blue-dark);border-color:var(--brand-blue-dark)}
button.danger,.panel button.danger{background:var(--brand-red)!important;border-color:var(--brand-red)!important;color:#fff!important}
button.danger:hover,.panel button.danger:hover{background:var(--brand-red-dark)!important;border-color:var(--brand-red-dark)!important}
header{min-height:64px;height:auto;padding:10px 16px;gap:8px;flex-wrap:wrap;background:#fff;border-bottom:3px solid var(--brand-blue);box-shadow:0 3px 12px rgba(16,49,77,.12)}
header b{color:var(--brand-blue);font-size:21px;letter-spacing:-.35px;white-space:nowrap}
#who{color:var(--muted);font-size:12px}
header input{margin-left:auto;min-width:150px;padding:9px 11px}
header select,header button{padding:9px 11px;min-height:36px}
#databaseBtn{border-color:#efb2b9;color:var(--brand-red-dark)}
#databaseBtn:hover{background:#fff0f2;border-color:var(--brand-red)}
#map{background:#e9eef2}
.panel{background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--brand-blue);border-radius:7px;padding:20px;box-shadow:var(--shadow);color:var(--ink)}
.panel h2{margin:0;font-size:20px;line-height:1.3;color:var(--brand-blue);font-weight:700}
.panel h3{color:var(--brand-blue-dark)}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-2px 0 16px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.panel-head button{min-width:34px;height:32px;padding:4px 9px;font-size:16px}
.panel label{font-size:13px;font-weight:700;color:#33485a}
.panel input,.panel textarea,.panel select{padding:10px;margin:5px 0 12px}
.panel button{padding:9px 12px;margin:3px}
.panel button.primary{background:var(--brand-blue);border-color:var(--brand-blue);color:#fff}
.panel button.primary:hover{background:var(--brand-blue-dark)}
.group-row,.user-row{border:1px solid var(--line);border-radius:6px;background:var(--surface-soft)}
.group-editor,.user-editor{border-top:1px solid var(--line)}
.history-entry{border:1px solid var(--line);border-left:3px solid var(--brand-blue);border-radius:5px;background:var(--surface-soft)}
.history-entry pre{border:1px solid #e3eaf0}
.field-history-link{color:var(--brand-blue)}
.field-history-link:hover{color:var(--brand-red)}
#databasePanel .db-table{border-collapse:collapse;font-size:13px}
#databasePanel .db-table th{background:var(--brand-blue);color:#fff;border-color:var(--brand-blue-dark);font-weight:700}
#databasePanel .db-table td{border-color:#e1e8ee}
#databasePanel .db-table tbody tr:nth-child(even){background:#f5f8fb}
#databasePanel .db-table tbody tr:hover{background:#eaf4fb}
.leaflet-bar a,.leaflet-control-home{color:var(--brand-blue-dark)!important;background:#fff!important;border-color:#d2dce5!important}
.leaflet-bar a:hover,.leaflet-control-home:hover{background:var(--brand-blue-light)!important}
#err{color:var(--brand-red-dark)}
@media(max-width:700px){
  header{padding:10px;border-bottom-width:3px;gap:6px}
  header b{font-size:20px}
  header input{margin-left:0;width:100%;flex:1 0 100%}
  header select,header button{font-size:14px;min-height:40px;padding:8px}
  .panel{padding:15px;right:10px;left:10px;max-width:calc(100% - 20px);width:auto}
  .panel h2{font-size:18px}
}

/* Dymek informacyjny pinezki klienta */
.client-tooltip.leaflet-tooltip{white-space:normal;min-width:230px;max-width:340px;padding:10px 12px;border:1px solid #cbd5e1;border-radius:9px;background:#fff;color:#1e293b;box-shadow:0 5px 18px #0f172a2b;font-size:12px;line-height:1.45;pointer-events:auto}
.client-tooltip.leaflet-tooltip:before{border-top-color:#fff}
.client-tooltip.leaflet-tooltip a{color:#075fc7;text-decoration:underline;pointer-events:auto;position:relative;z-index:1000;overflow-wrap:anywhere}.client-tooltip.leaflet-tooltip a:hover{color:#c62828}
.client-tip-title{font-size:14px;font-weight:700;color:#1565c0;border-bottom:1px solid #e2e8f0;padding-bottom:5px;margin-bottom:5px;overflow-wrap:anywhere}
.client-tip-row{display:grid;grid-template-columns:66px minmax(0,1fr);gap:5px;padding:2px 0;overflow-wrap:anywhere;white-space:pre-wrap}
.client-tip-row b{color:#334155}
.client-tip-row span{min-width:0}

/* Informacje klienta w popupie otwieranym kliknięciem pinezki */
.client-info-popup .leaflet-popup-content-wrapper{border-radius:10px;box-shadow:0 6px 22px #0f172a30}
.client-info-popup .leaflet-popup-content{margin:12px 14px;min-width:220px;max-width:340px;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.client-info-popup .client-tip-title{font-size:15px;font-weight:700;color:#174ea6;border-bottom:1px solid #dbe4f0;padding-bottom:7px;margin-bottom:7px}
.client-info-popup .client-tip-row{margin:4px 0;white-space:normal;overflow-wrap:anywhere}
.client-info-popup .client-tip-row b{color:#334155}
.client-info-popup a{color:#075fc7;text-decoration:underline;overflow-wrap:anywhere;pointer-events:auto}
.client-info-popup a:hover{color:#c62828}
@media(max-width:600px){.client-info-popup .leaflet-popup-content{max-width:min(72vw,300px);min-width:180px;font-size:13px}}

/* v45: tryb ciemny interfejsu i mapy */
#themeBtn{white-space:nowrap}
body.dark-theme{background:#111827;color:#e5e7eb;color-scheme:dark}
body.dark-theme #app{background:#111827;color:#e5e7eb}
body.dark-theme header{background:#172033;color:#f3f4f6;border-bottom:1px solid #334155;box-shadow:0 2px 8px #0008}
body.dark-theme header input,body.dark-theme header select,body.dark-theme input,body.dark-theme textarea,body.dark-theme select{background:#1f2937;color:#f3f4f6;border-color:#475569}
body.dark-theme header button,body.dark-theme .panel button{background:#263449;color:#e5e7eb;border-color:#475569}
body.dark-theme .panel{background:#172033;color:#e5e7eb;border:1px solid #334155;box-shadow:0 5px 25px #0008}
body.dark-theme .panel h2,body.dark-theme .panel h3,body.dark-theme .panel label,body.dark-theme .panel b{color:#e5e7eb}
body.dark-theme .panel-head{border-bottom-color:#334155}
body.dark-theme .panel p,body.dark-theme .muted,body.dark-theme #who{color:#aab7ca}
body.dark-theme .group-row,body.dark-theme .user-row,body.dark-theme .history-entry,body.dark-theme .user-editor,body.dark-theme .group-editor{background:#1f2937;border-color:#374151;color:#e5e7eb}
body.dark-theme #databasePanel .db-table th{background:#1d4ed8;color:#fff}
body.dark-theme #databasePanel .db-table td{border-color:#374151;color:#e5e7eb}
body.dark-theme #databasePanel .db-table tbody tr:nth-child(even){background:#1f2937}
body.dark-theme #databasePanel .db-table tbody tr:hover{background:#263449}
body.dark-theme .client-info-popup .leaflet-popup-content-wrapper,body.dark-theme .client-info-popup .leaflet-popup-tip{background:#172033;color:#e5e7eb}
body.dark-theme .client-info-popup .client-tip-title,body.dark-theme .client-info-popup .client-tip-row b{color:#bfdbfe;border-color:#334155}
body.dark-theme .client-info-popup a{color:#93c5fd}
body.dark-theme .leaflet-bar a,body.dark-theme .leaflet-control-home{background:#172033!important;color:#e5e7eb!important;border-color:#475569!important}
body.dark-theme #login{background:#111827}
body.dark-theme .login{background:#172033;color:#e5e7eb}
body.dark-theme .login input{background:#1f2937;color:#f3f4f6;border-color:#475569}


/* Tryb ciemny bez zewnętrznego API: przyciemnienie standardowych kafelków OpenStreetMap. */
body.dark-theme .map-tiles-dark { filter: invert(100%) hue-rotate(180deg) brightness(.82) contrast(.92) saturate(.78); }

/* Popup navigation action */
.client-info-popup .client-tip-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;align-items:center}
.client-info-popup .client-tip-actions .popup-nav-btn{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;border:1px solid var(--brand-blue,#1976d2);border-radius:6px;padding:6px 9px;background:var(--brand-blue,#1976d2);color:#fff;text-decoration:none;font-weight:600;line-height:1.25;cursor:pointer}
.client-info-popup .client-tip-actions .popup-nav-btn:hover{background:var(--brand-blue-dark,#1259a7);color:#fff}
body.dark-theme .client-info-popup .client-tip-actions .popup-nav-btn{color:#fff}

/* Przełącznik trybu przesuwania pinezek */
header button.pin-move-toggle{background:var(--brand-blue);border-color:var(--brand-blue);color:#fff;min-width:42px;font-size:19px;padding:7px 11px}
header button.pin-move-toggle:hover{background:var(--brand-blue-dark);border-color:var(--brand-blue-dark)}
header button.pin-move-toggle.pin-move-active,body.dark-theme header button.pin-move-toggle.pin-move-active{background:#d71920!important;border-color:#b51219!important;color:#fff!important;box-shadow:0 0 0 2px #d7192040}
#databasePanel .db-sort{appearance:none;background:transparent;border:0;color:inherit;font:inherit;font-weight:700;padding:2px 0;text-align:left;cursor:pointer;white-space:nowrap}
#databasePanel .db-sort:hover{text-decoration:underline;opacity:.9}
#databasePanel .db-sort:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:2px}


/* v55 — dopasowywanie okna Bazy klientów; przywrócono pierwotny rozmiar nagłówków sortowania */
#databasePanel{
  resize:both;
  overflow:auto;
  height:min(75vh,700px);
  min-width:min(500px,calc(100vw - 20px));
  min-height:300px;
  max-width:calc(100vw - 20px);
  max-height:calc(100vh - 80px);
  display:flex;
  flex-direction:column;
}
#databasePanel .panel-head,
#databasePanel>div:first-of-type,
#databasePanel>#dbSearch{flex:0 0 auto}
#databasePanel .db-table-wrap{flex:1 1 auto;min-height:80px;max-height:none!important;overflow:auto}
@media(max-width:700px){
  #databasePanel{left:10px;right:auto;width:calc(100% - 20px);min-width:0;height:75vh;min-height:260px;max-height:calc(100% - 20px);resize:both}
}

/* v56 — przesuwanie okna Bazy klientów za pasek nagłówka */
#databasePanel .panel-head{cursor:move;touch-action:none;user-select:none}
#databasePanel .panel-head button{cursor:pointer;touch-action:manipulation}
#databasePanel.db-dragging{transition:none!important;opacity:.98}

/* v57: pole wyszukiwania z przyciskiem czyszczenia */
header .search-box{position:relative;display:flex;align-items:center;margin-left:auto;width:240px;min-width:130px}
header .search-box input{width:100%;min-width:0;margin-left:0;padding-right:34px}
header #clearSearch{display:none;position:absolute;right:4px;top:50%;transform:translateY(-50%);width:28px;height:28px;min-height:0;padding:0;margin:0;border:0;border-radius:50%;font-size:23px;line-height:25px;color:#64748b;background:transparent;cursor:pointer}
header #clearSearch.visible{display:block}
header #clearSearch:hover{background:#e2e8f0;color:#b91c1c}
@media(max-width:700px){
 header .search-box{order:2;width:100%;margin-left:0;flex:1 0 100%}
 header select,header button{height:35px;min-height:35px;font-size:18px;padding-top:5px;padding-bottom:5px}
 header #clearSearch{height:28px;min-height:28px;padding:0;font-size:23px}
}
.client-info-popup .leaflet-popup-content-wrapper{touch-action:none;user-select:none;-webkit-user-select:none}

/* v58: przycisk czyszczenia zawsze wewnątrz pola Szukaj, również na telefonach */
header .search-box{position:relative;min-width:0}
header .search-box input{flex:1 1 auto!important;width:100%;min-width:0;padding-right:48px!important}
header .search-box #clearSearch{position:absolute!important;right:6px!important;top:50%!important;transform:translateY(-50%)!important;z-index:5;width:32px!important;height:32px!important;min-height:32px!important;min-width:32px!important;padding:0!important;margin:0!important;flex:none!important;display:none;border:0!important;border-radius:50%!important;font-size:25px!important;line-height:30px!important;background:transparent!important;box-shadow:none!important}
header .search-box #clearSearch.visible{display:block!important}
@media(max-width:700px){header .search-box{order:2;width:100%;margin-left:0;flex:1 0 100%;display:flex;position:relative}header .search-box input{flex:1 1 auto!important;width:100%!important;height:44px;min-height:44px}header .search-box #clearSearch{height:32px!important;min-height:32px!important;width:32px!important;min-width:32px!important}}

/* v59: mocne wymuszenie osadzenia X wewnątrz pola wyszukiwania */
header .search-box{position:relative!important;display:flex!important;align-items:center!important;flex:0 1 240px;min-width:0!important;margin-left:auto!important;order:0}
header .search-box input#search{display:block!important;position:relative!important;flex:1 1 auto!important;width:100%!important;min-width:0!important;margin:0!important;padding-right:48px!important;box-sizing:border-box!important}
header .search-box button#clearSearch{position:absolute!important;right:6px!important;left:auto!important;top:50%!important;bottom:auto!important;transform:translateY(-50%)!important;z-index:10!important;display:none;width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;padding:0!important;margin:0!important;border:0!important;border-radius:50%!important;font-size:25px!important;line-height:30px!important;background:transparent!important;box-shadow:none!important;flex:none!important}
header .search-box button#clearSearch.visible{display:block!important}
@media(max-width:700px){header .search-box{order:2!important;flex:1 0 100%!important;width:100%!important;margin:0!important}header .search-box input#search{height:44px!important;min-height:44px!important}header .search-box button#clearSearch{right:8px!important;top:50%!important}}

/* v60: przycisk X widoczny zawsze, także gdy pole wyszukiwania jest puste */
header .search-box button#clearSearch{display:block!important;color:#e85b55!important;cursor:pointer!important;visibility:visible!important;opacity:1!important}
header .search-box button#clearSearch:hover{background:rgba(232,91,85,.12)!important;color:#c93636!important}

/* v61: wymuszenie widocznego X w polu wyszukiwania, niezależnie od pustej wartości */
header .search-box{position:relative!important;display:flex!important;align-items:center!important;min-width:0!important}
header .search-box input#search{box-sizing:border-box!important;padding-right:54px!important}
header .search-box button#clearSearch,header .search-box button#clearSearch.visible{display:inline-flex!important;align-items:center!important;justify-content:center!important;visibility:visible!important;opacity:1!important;position:absolute!important;right:6px!important;left:auto!important;top:50%!important;bottom:auto!important;transform:translateY(-50%)!important;z-index:1000!important;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important;margin:0!important;border:0!important;background:transparent!important;box-shadow:none!important;color:#e85b55!important;font-family:Arial,sans-serif!important;font-size:30px!important;font-weight:700!important;line-height:1!important;cursor:pointer!important;pointer-events:auto!important}


/* v64: zwijane menu przycisków na smartfonach */
#mobileMenuBtn{display:none;white-space:nowrap}
.mobile-menu-items{display:contents}
@media(max-width:700px){
  #app>header{align-content:flex-start;gap:8px}
  #app>header>b,#app>header>#who{display:none}
  #app>header .search-box{order:1!important;flex:1 1 calc(100% - 105px)!important;width:auto!important;min-width:0!important;margin:0!important}
  #app>header #mobileMenuBtn{display:inline-flex;order:2;align-items:center;justify-content:center;flex:0 0 92px;height:44px;margin:0;padding:0 8px;font-size:16px}
  #app>header .mobile-menu-items{display:none;order:3;flex:1 0 100%;width:100%;flex-wrap:wrap;gap:8px;align-items:center}
  #app>header.mobile-menu-open .mobile-menu-items{display:flex}
  #app>header .mobile-menu-items select,#app>header .mobile-menu-items button,#app>header .mobile-menu-items form{max-width:100%;margin:0}
  #app>header .mobile-menu-items form{display:inline-flex}
}

/* v65: przycisk menu tylko jako ikona; pewne rozwijanie na telefonach */
@media(max-width:700px){
 #app>header #mobileMenuBtn{display:inline-flex!important;flex:0 0 48px!important;width:48px!important;min-width:48px!important;padding:0!important;font-size:27px!important;line-height:1!important;position:relative;z-index:20;cursor:pointer}
 #app>header #mobileMenuItems{display:none!important}
 #app>header.mobile-menu-open #mobileMenuItems{display:flex!important}
}

/* Zdjęcia i wizytówki klienta */
.client-photos{margin:14px 0;padding:12px;border:1px solid var(--line);border-radius:7px;background:var(--surface-soft)}
.client-photos h3{margin:0 0 8px;font-size:16px}
.client-photos input[type=file]{width:100%;max-width:100%;box-sizing:border-box}
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:10px;margin:10px 0}
.photo-item{min-width:0;border:1px solid var(--line);border-radius:6px;padding:6px;background:var(--surface)}
.photo-item img{width:100%;height:100px;object-fit:contain;display:block;background:#fff;border-radius:4px}
.photo-name{font-size:11px;overflow-wrap:anywhere;margin:5px 0;color:var(--ink)}
.photo-item button{font-size:11px;padding:5px 7px;margin:0}


/* v68: ukryj techniczne pole wyboru pliku aparatu; aparat uruchamia przycisk „Zrób zdjęcie”. */
.camera-file-input{display:none!important}

/* Mała ikonka aparatu przy grupie w popupie, gdy klient ma zdjęcia */
.client-info-popup .popup-photos-icon{display:inline-flex;align-items:center;justify-content:center;margin-left:5px;padding:0 3px;border:0;background:transparent;color:inherit;font-size:16px;line-height:1.2;cursor:pointer;vertical-align:middle}
.client-info-popup .popup-photos-icon:hover{transform:scale(1.08)}

/* v73: Android — unikaj wymuszania osobnej warstwy GPU dla panelu ze zdjęciami.
   Na części urządzeń transform: translateZ(0) może powodować migotanie podczas dekodowania obrazów. */
#panel, #panel * { animation: none !important; transition: none !important; }
#panel { transform: none !important; backface-visibility: visible; contain: none; }
.photo-grid { align-items: start; }
.photo-item img { width: 100%; height: 100px; min-height: 100px; max-height: 100px; object-fit: contain; aspect-ratio: auto; }

/* v74: ogranicz reflow galerii zdjęć na mobilnym Chrome. */
.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.photo-item{min-height:150px;}
.photo-item img{display:block;width:100%;height:100px;min-height:100px;max-height:100px;object-fit:contain;background:#fff;}
.client-photos{overflow-anchor:none;}

/* v78: kompaktowy, kwadratowy przycisk eksportu bazy */
#dbExportFilteredBtn.db-export-icon{width:44px;height:44px;min-width:44px;padding:0;margin:0;display:inline-flex;align-items:center;justify-content:center;font-size:27px;line-height:1;border:1px solid #c7d3de;border-radius:6px;background:#fff;color:var(--brand-blue-dark);flex:0 0 44px}
#dbExportFilteredBtn.db-export-icon:active{transform:translateY(1px)}
/* v80 — wielokrotny wybór grup na mapie */
.group-picker{position:relative;flex:0 0 auto}
.group-picker>button{white-space:nowrap;min-height:36px}
.group-picker-menu{position:absolute;top:calc(100% + 5px);left:0;min-width:210px;max-width:280px;max-height:60vh;overflow:auto;background:var(--panel,#fff);color:var(--ink,#24313d);border:1px solid #c7d3de;border-radius:8px;box-shadow:0 6px 22px #0003;padding:5px;z-index:3000}
.group-pick-row{display:flex;align-items:center;gap:9px;width:100%;text-align:left;border:0;background:transparent;color:inherit;padding:9px 10px;border-radius:5px;min-height:38px}
.group-pick-row:hover{background:#eaf2f8}
.group-pick-dot{display:inline-block;width:15px;height:15px;border-radius:50%;background:var(--group-color);border:2px solid var(--group-color);flex:0 0 15px}
.group-pick-dot.is-off{opacity:.22;filter:grayscale(1);background:transparent}
.group-pick-dot.is-on{opacity:1;box-shadow:0 0 0 2px color-mix(in srgb,var(--group-color) 25%,transparent)}
.group-pick-check{margin-left:auto;font-weight:bold;color:var(--group-color,#1976d2)}
@media(max-width:700px){.group-picker{width:100%}.group-picker>button{width:100%;text-align:left}.group-picker-menu{left:0;right:0;max-width:none}}

/* v80 — akcje zaznaczania grup; menu pozostaje otwarte przy wyborze */
.group-pick-actions{display:flex;gap:7px;padding:4px 5px 8px;margin-bottom:4px;border-bottom:1px solid var(--line,#d5dde5);position:sticky;top:-5px;background:var(--panel,#fff);z-index:1}
.group-pick-actions button{width:36px;height:34px;min-width:36px;padding:0;margin:0;border:1px solid #c7d3de;border-radius:6px;background:transparent;font-size:24px;font-weight:800;line-height:1;display:inline-flex;align-items:center;justify-content:center}
#groupPickAll{color:#16833b}
#groupPickNone{color:#d52b35}
.group-pick-actions button:hover{background:var(--surface-soft,#eef3f7)}