/* DriveMap 2.0 – Soukromí (privátní zóny, režim Duch) na webové mapě.
   Stejné „pasti“ jako v tracker.css: Astra má globální styly pro <button>,
   <input> a SVG, proto ID selektory + !important tam, kde to bylo potřeba. */

/* hidden atribut musí vyhrát nad display:flex !important u .dzt-btn (Astra/tracker.css) */
.dzt-privacy-modal [hidden], .dzt-live-privacy-hint [hidden] { display: none !important; }

/* ─── FAB ─── */
#dzt-privacy-toggle.dzt-privacy-fab {
    position: relative;
    width: 46px !important; height: 46px !important; border-radius: 50% !important;
    padding: 0 !important; margin: 0 auto !important;
    background: #2b2e33 !important; color: #fff !important;
    border: none !important; box-shadow: 0 2px 8px rgba(0,0,0,0.35) !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    cursor: pointer; transition: background .15s, box-shadow .15s;
}
#dzt-privacy-toggle svg { width: 22px !important; height: 22px !important; max-width: none !important; display: block !important; flex-shrink: 0 !important; }
#dzt-privacy-toggle:hover, #dzt-privacy-toggle:focus-visible { background: #3a3d44 !important; }
#dzt-privacy-toggle.active {
    background: #0088ff !important;
    box-shadow: 0 0 0 3px rgba(0,136,255,0.35), 0 0 16px rgba(0,136,255,0.55) !important;
}

/* ─── Hint v live modalu ─── */
.dzt-live-privacy-hint {
    /* ikona vlevo, text vedle ní na stejném řádku, odkaz pod textem
       (dřív flex-wrap: dlouhý text spadl celý pod ikonu) */
    display: grid; grid-template-columns: 14px 1fr; column-gap: 7px; row-gap: 3px; align-items: start;
    font-size: 12px; color: #777 !important; margin: -2px 0 12px; line-height: 1.4;
}
.dzt-live-privacy-hint > span { grid-column: 2; }
.dzt-live-privacy-hint > .dzt-linkbtn { grid-column: 2; justify-self: start; }
.dzt-live-privacy-hint svg { grid-column: 1; grid-row: 1; color: #0088ff; width: 14px !important; height: 14px !important; margin-top: 1px; display: block !important; }
html.dark .dzt-live-privacy-hint { color: #999 !important; }

.dzt-linkbtn {
    background: none !important; border: none !important; padding: 0 !important; margin: 0 !important;
    color: #0088ff !important; font: inherit !important; font-weight: 600 !important; cursor: pointer;
    text-decoration: underline; text-underline-offset: 2px; box-shadow: none !important; min-height: 0 !important;
}

/* ─── Modal ─── */
.dzt-privacy-backdrop {
    position: absolute; inset: 0; z-index: 1100;
    display: flex; align-items: center; justify-content: center;
    background: rgba(0,0,0,0.5); padding: 16px; box-sizing: border-box;
}
.dzt-privacy-backdrop[hidden] { display: none !important; }
.dzt-privacy-modal {
    position: relative; width: 100%; max-width: 380px; max-height: 100%; overflow-y: auto;
    background: #fff !important; color: #222 !important;
    border-radius: 14px; padding: 20px; box-sizing: border-box;
    box-shadow: 0 10px 40px rgba(0,0,0,0.35);
}
.dzt-privacy-modal h3 { margin: 0 0 4px !important; font-size: 18px !important; font-weight: 800 !important; color: #222 !important; letter-spacing: .01em; }
.dzt-pv-sub { font-size: 12.5px; color: #777 !important; margin: 0 0 14px; }
.dzt-pv-view[hidden] { display: none !important; }

/* Duch přepínač */
.dzt-pv-ghost {
    display: flex; align-items: center; gap: 12px; cursor: pointer;
    padding: 12px; border-radius: 10px; margin-bottom: 16px;
    background: #f4f6f9; border: 1px solid #e6e9ef;
}
.dzt-pv-ghost-text { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.dzt-pv-ghost-text b { font-size: 14px; }
.dzt-pv-ghost-text small { font-size: 12px; color: #777; line-height: 1.35; }
.dzt-pv-ghost input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.dzt-pv-switch {
    position: relative; width: 44px; height: 26px; border-radius: 13px; flex-shrink: 0;
    background: #c9ced6; transition: background .2s;
}
.dzt-pv-switch::after {
    content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%;
    background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: transform .2s;
}
.dzt-pv-ghost input:checked + .dzt-pv-switch { background: #0088ff; box-shadow: 0 0 12px rgba(0,136,255,.5); }
.dzt-pv-ghost input:checked + .dzt-pv-switch::after { transform: translateX(18px); }
.dzt-pv-ghost input:focus-visible + .dzt-pv-switch { outline: 2px solid #0088ff; outline-offset: 2px; }

.dzt-pv-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 4px; }
.dzt-pv-head b { font-size: 14px; }
.dzt-pv-head small { font-size: 12px; color: #999; }
.dzt-pv-help { font-size: 12px; color: #777 !important; line-height: 1.45; margin: 0 0 10px; }

.dzt-pv-list { list-style: none !important; margin: 0 0 12px !important; padding: 0 !important; }
.dzt-pv-item {
    display: flex; align-items: center; gap: 10px; margin: 0 !important;
    padding: 10px 2px; border-bottom: 1px solid #eee;
}
.dzt-pv-item:first-child { border-top: 1px solid #eee; }
.dzt-pv-ico { color: #0088ff; display: flex; }
.dzt-pv-ico svg { width: 16px !important; height: 16px !important; }
.dzt-pv-name { flex: 1; font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dzt-pv-r { font-size: 12px; color: #888; font-variant-numeric: tabular-nums; }
.dzt-pv-empty { font-size: 13px; color: #888; padding: 10px 0; border-top: 1px solid #eee; border-bottom: 1px solid #eee; }
.dzt-pv-add { width: 100%; justify-content: center; }
.dzt-pv-error { color: #ef2730 !important; font-size: 12.5px; margin: 10px 0 0; }

/* Editor zóny */
.dzt-pv-map { height: 210px; border-radius: 10px; overflow: hidden; margin-bottom: 10px; border: 1px solid #e3e6eb; }
.dzt-pv-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.dzt-pv-home { display: flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; }
.dzt-pv-home input { width: 16px; height: 16px; accent-color: #0088ff; }
/* Stejný princip jako #dzt-radius v tracker.css – bez stylu runnable-track
   kreslil prohlížeč pod gradientem ještě vlastní kolejnici ("dvojitý posuvník").
   Pole je navíc uvnitř .dzt-sos-field, jehož input styly (padding, rámeček,
   pozadí) je potřeba tady na ID úplně přebít. */
#dzt-pv-radius {
    -webkit-appearance: none !important; appearance: none !important;
    width: 100% !important; height: 4px !important; min-height: 0 !important;
    border-radius: 2px !important; outline: none !important; cursor: pointer !important;
    padding: 0 !important; margin: 10px 0 6px !important;
    border: none !important; box-shadow: none !important;
    background: linear-gradient(to right, #0088ff 0%, #0088ff var(--val,50%), #ddd var(--val,50%), #ddd 100%) !important;
}
#dzt-pv-radius::-webkit-slider-runnable-track {
    height: 4px !important; background: transparent !important; border: none !important; box-shadow: none !important;
}
#dzt-pv-radius::-webkit-slider-thumb {
    -webkit-appearance: none !important; appearance: none !important;
    width: 18px !important; height: 18px !important; border-radius: 50% !important;
    background: #0088ff !important; cursor: pointer !important;
    border: 2px solid #fff !important; box-shadow: 0 1px 4px rgba(0,0,0,0.25) !important;
    margin-top: -7px !important;
}
#dzt-pv-radius::-moz-range-track {
    height: 4px !important; background: #ddd !important; border: none !important; box-shadow: none !important;
}
#dzt-pv-radius::-moz-range-progress { height: 4px !important; background: #0088ff !important; }
#dzt-pv-radius::-moz-range-thumb {
    width: 18px !important; height: 18px !important; border-radius: 50% !important;
    background: #0088ff !important; cursor: pointer !important;
    border: 2px solid #fff !important; box-shadow: 0 1px 4px rgba(0,0,0,0.25) !important;
}

/* Pin zóny – stejná ikona štítu na šedém kruhu jako tlačítko Soukromí na mapě */
.dzt-pv-pin { background: none !important; border: none !important; }
.dzt-pv-pin-dot {
    width: 34px; height: 34px; border-radius: 50%;
    background: #2b2e33; color: #fff; box-sizing: border-box;
    border: 2px solid #fff; box-shadow: 0 2px 8px rgba(0,0,0,0.45);
    display: flex; align-items: center; justify-content: center; cursor: grab;
}
.dzt-pv-pin-dot svg { width: 18px !important; height: 18px !important; display: block !important; }
.leaflet-dragging .dzt-pv-pin-dot { cursor: grabbing; }

/* Toast */
.dzt-pv-toast {
    position: absolute; left: 50%; bottom: 18px; z-index: 1200;
    transform: translate(-50%, 12px); opacity: 0; transition: opacity .25s, transform .25s;
    max-width: calc(100% - 32px); box-sizing: border-box;
    background: #191b1f; color: #fff; font-size: 13px; line-height: 1.4;
    padding: 10px 14px; border-radius: 10px; border: 1px solid rgba(0,136,255,.45);
    box-shadow: 0 6px 24px rgba(0,0,0,.4), 0 0 18px rgba(0,136,255,.25);
    pointer-events: none; text-align: center;
}
.dzt-pv-toast.show { opacity: 1; transform: translate(-50%, 0); }
.dzt-pv-toast[hidden] { display: none !important; }

/* ─── Dark ─── */
html.dark .dzt-privacy-modal { background: #2b2e33 !important; color: #e8e8e8 !important; }
html.dark .dzt-privacy-modal h3 { color: #e8e8e8 !important; }
html.dark .dzt-pv-sub, html.dark .dzt-pv-help { color: #999 !important; }
html.dark .dzt-pv-ghost { background: #1e2024; border-color: #3a3d44; }
html.dark .dzt-pv-ghost-text small { color: #999; }
html.dark .dzt-pv-switch { background: #4a4e56; }
html.dark .dzt-pv-item, html.dark .dzt-pv-item:first-child, html.dark .dzt-pv-empty { border-color: #3a3d44; }
html.dark .dzt-pv-map { border-color: #3a3d44; }
html.dark #dzt-pv-radius { background: linear-gradient(to right, #0088ff 0%, #0088ff var(--val,50%), #3a3d44 var(--val,50%), #3a3d44 100%) !important; }
html.dark #dzt-pv-radius::-moz-range-track { background: #3a3d44 !important; }
