/* ─────────────────────────────────────────────
   FONTS & TEXT ANIMATIONS
────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Orbitron&display=swap');
@property --num { syntax: '<integer>'; initial-value: 0; inherits: false; }
@keyframes initText { 0% {content:"Αρχικοποίηση IoT συστήματος . . ."} 17% {content:"Αρχικοποίηση IoT συστήματος . . .\00000a Φόρτωση βασικών μονάδων . . ."} 27% {content:"Αρχικοποίηση IoT συστήματος . . .\00000a Φόρτωση βασικών μονάδων . . .\00000a Έλεγχος αισθητήρων . . ."} 36% {content:"Αρχικοποίηση IoT συστήματος . . .\00000a Φόρτωση βασικών μονάδων . . .\00000a Έλεγχος αισθητήρων . . .\00000a Σύνδεση με δίκτυο . . ."} 42% {content:"Αρχικοποίηση IoT συστήματος . . .\00000a Φόρτωση βασικών μονάδων . . .\00000a Έλεγχος αισθητήρων . . .\00000a Σύνδεση με δίκτυο . . .\00000a Συλλογή δεδομένων . . ."} 49% {content:"Φόρτωση βασικών μονάδων . . .\00000a Έλεγχος αισθητήρων . . .\00000a Σύνδεση με δίκτυο . . .\00000a Συλλογή δεδομένων . . .\00000a Ανάλυση πραγματικού χρόνου . . ."} 60% {content:"Έλεγχος αισθητήρων . . .\00000a Σύνδεση με δίκτυο . . .\00000a Συλλογή δεδομένων . . .\00000a Ανάλυση πραγματικού χρόνου . . .\00000a Αποστολή σε cloud . . ."} 66% {content:"Σύνδεση με δίκτυο . . .\00000a Συλλογή δεδομένων . . .\00000a Ανάλυση πραγματικού χρόνου . . .\00000a Αποστολή σε cloud . . .\00000a Φόρτωση διεπαφής χρήστη . . .\00000a"} 78% {content:"Συλλογή δεδομένων . . .\00000a Ανάλυση πραγματικού χρόνου . . .\00000a Αποστολή σε cloud . . .\00000a Φόρτωση διεπαφής χρήστη . . .\00000a Ενεργοποίηση αυτοματισμών . . .\00000a"} 100% {content:"Ανάλυση πραγματικού χρόνου . . .\00000a Αποστολή σε cloud . . .\00000a Φόρτωση διεπαφής χρήστη . . .\00000a Ενεργοποίηση αυτοματισμών . . .\00000a Σύνδεση με IoT οικοσύστημα . . .\00000a"} }
@keyframes opcty { 0% { opacity:0 } 100% { opacity:1 } }
@keyframes counting { 0% { --num: 0 } 60% { --num: 66 } 100% { --num: 100 } }
@keyframes charging { 0%{ width:0% } 60%{ width:66% } 100%{ width:100% } }
@keyframes rotate { 0%{ transform: rotate(0) } 100%{ transform: rotate(360deg) } }

/* ─────────────────────────────────────────────────────────────
   PROJECT-ONLY STYLES
────────────────────────────────────────────────────────────── */

/* MAPS */

#thessaloniki-app, #insertdevice-map, #editdevice-map { width: 100%; display: flex; align-items: center; justify-content: center; background-color: var(--background-color); border: 1px solid var(--secondary-color); border-radius: 0.75rem; padding: 1rem; }

#thessaloniki-app { min-height: 70vh; height: 100%; }

#insertdevice-map, #editdevice-map { min-height: 15vh; height: 30vh; margin-top: 1rem; }

/* Settings Form */
.settings-form label { display:block; margin:10px 0 5px; font-weight:bold; color:var(--text-color); }
.settings-form input { width:100%; padding:10px; border:1px solid var(--breadcrumb-bg); border-radius:var(--tz-border-radius); font-size:14px; margin-bottom:20px; box-sizing:border-box; }
.settings-form input:focus { border-color:var(--primary-color); outline:none; }

/* Logs */
.log-type-info { color:var(--log-info-color); font-weight:bold; }
.log-type-warning { color:var(--log-warning-color); font-weight:bold; }
.log-type-error { color:var(--log-error-color); font-weight:bold; }
.log-type-critical { color:var(--log-critical-color); font-weight:bold; }

/* Copy Buttons */
.copy-btn { background:var(--primary-color); color:var(--text-color-light); border:none; border-radius:5px; padding:5px 10px; font-size:1rem; cursor:pointer; transition:all .3s ease-in-out; }
.copy-btn:hover { background:var(--secondary-color); color:var(--text-color-light); transform:scale(1.1); }
.copy-btn:active { transform:scale(0.95); }
.copied { background:var(--third-color)!important; color:var(--text-color); }
.copied i { animation:popEffect .3s ease-in-out; }
@keyframes popEffect { 0%{transform:scale(1);opacity:.5;} 50%{transform:scale(1.5);opacity:1;} 100%{transform:scale(1);opacity:1;} }

/* Utilities */
.custom-border { border:4px solid var(--secondary-color)!important; }
.custom-disabled { background:var(--disabled-bg-color-dark)!important; color:var(--disabled-color)!important; border-color:#ddd!important; cursor:not-allowed!important; opacity:1!important; }
#profitsChart { width:100%!important; height:100%!important; }

/* ─────────────────────────────────────────────────────────────
   INPUT CONTAINERS
────────────────────────────────────────────────────────────── */

.input-container { display: flex; justify-content: space-between; }

.input-min, .input-max {
    margin-top: auto; width: 15%; border: 1px solid var(--input-border-color); background: var(--input-bg-color); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 15px; text-align: center; font-size: 14px; color: var(--background-color); box-shadow: 0 4px 10px var(--box-shadow-color); padding: 5px 10px; z-index: 2; transition: all 0.3s ease-in-out;
}

.input-min:hover, .input-max:hover {
    transform: scale(1.05); box-shadow: 0 6px 15px var(--box-shadow-hover-color); border: 1px solid var(--input-hover-border-color); background: var(--input-hover-bg-color);
}

/* ─────────────────────────────────────────────────────────────
   NOUi SLIDER
────────────────────────────────────────────────────────────── */

.noUi-tooltip { display: none !important; }
.noUi-active .noUi-tooltip { display: block !important; }
.noUi-connect { background: var(--slider-connect-color); }
.noUi-background { background: var(--slider-bg-color); }
.noUi-handle { background: var(--slider-connect-color); border: 2px solid var(--slider-handle-border); box-shadow: 0 2px 5px var(--box-shadow-color); }
.noUi-pips { color: var(--pip-text-color); }
.noUi-value { color: var(--slider-connect-color); }
.noUi-marker { background: var(--slider-handle-border); }
.noUi-tooltip { background: var(--slider-tooltip-bg); color: var(--slider-tooltip-text); border: 1px solid var(--slider-tooltip-border); border-radius: 4px; }
.noUi-horizontal { background: var(--slider-bg-color); }
.noUi-vertical { background: var(--slider-connect-color); }

/* ─────────────────────────────────────────────────────────────
   ROW HELPERS
────────────────────────────────────────────────────────────── */

.row-centered { display: flex; justify-content: center; align-items: center; }
.text-center-device-user-table { width: 100px !important; white-space: nowrap!important; }

/* ─────────────────────────────────────────────────────────────
   SWITCH BUTTON
────────────────────────────────────────────────────────────── */

.switch-input { -webkit-appearance: none !important; appearance: none !important; position: absolute !important; z-index: 1 !important; width: 100% !important; height: 100% !important; opacity: 0 !important; cursor: pointer !important; }

.switch-button { display: inline-flex !important; padding: 0 .375em !important; border-radius: 3.125em !important; border: .0625em solid #6b717b !important; background-color: #aaafbb !important; box-shadow: inset 0 0 .5em rgba(0,0,0,0.4) !important; transition-property: border-color, background-color !important; transition-duration: .2s !important; }

.switch-input:checked + .switch-button { border-color: var(--background-dark4) !important; background-color: var(--background-dark4) !important; }

.switch-button-inside { display: inline-flex !important; column-gap: 1em !important; position: relative !important; border-radius: 3.125em !important; padding: .75em !important; transform: translateX(-.375em) !important; background-image: linear-gradient(90deg, #c5c9d3 48%, #d5d7dd 52%) !important; box-shadow: inset .0625em 0 .0625em rgba(255,255,255,0.4) !important inset -.0625em 0 .0625em rgba(255,255,255,0.4) !important; transition-property: transform !important; transition-duration: .2s !important; }

.switch-button-inside::after { content: '' !important; position: absolute !important; z-index: -1 !important; inset: 0 !important; border-radius: 3.125em !important; background-image: linear-gradient(90deg, var(--background-dark3) 48%, var(--background-dark4) 52%) !important; box-shadow: inset .0625em 0 .0625em rgba(255,255,255,0.2) !important, inset -.0625em 0 .0625em rgba(255,255,255,0.2) !important; opacity: 0 !important; transition-property: opacity !important; transition-duration: .2s !important; }

.switch-input:checked + .switch-button > .switch-button-inside { transform: translateX(.375em) !important; }
.switch-input:checked + .switch-button > .switch-button-inside::after { opacity: 1 !important; }

.switch-icon { width: 1em !important; height: 1em !important; fill: #fff !important; filter: drop-shadow(0 .0625em .0625em rgba(0,0,0,0.4)) drop-shadow(0 0 .25em rgba(255,255,255,0.4)) drop-shadow(0 0 .25em rgba(255,255,255,0.4)); transition-property: fill !important; transition-duration: .2s !important; }

.switch-icon.off { fill: #767c86 !important; }
.switch-input:checked + .switch-button .switch-icon.off { fill: var(--text-color-light) !important; filter: none !important; }

.switch-icon.on { fill: var(--text-color-light) !important; }
.switch-input:not(:checked) + .switch-button .switch-icon.on { fill: var(--background-dark) !important; filter: none !important; }

@media screen and (max-width:768px){
#thessaloniki-app { min-height: 100vh; }
}



/* ─────────────────────────────────────────────────────────────
   PROFESSIONAL QUICK VIEW CARDS v2
────────────────────────────────────────────────────────────── */
.qv-dashboard{text-align:left;padding:15px;border-radius:8px;margin-top:20px!important;}
.qv-card{background:#fff;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,0.03);padding:12px 15px;height:100%;border:1px solid #e9ecef;display:flex;flex-direction:column;}
.qv-card-primary{border-top:3px solid var(--primary-color);}
.qv-card-secondary{border-top:3px solid var(--secondary-color);}
.qv-card-third{border-top:3px solid var(--third-color);}
.qv-card-dark{border-top:3px solid var(--header-bg-color);}
.qv-card-title{font-size:0.8rem;font-weight:700;letter-spacing:0.03em;color:var(--primary-color);margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid #eee;display:flex;align-items:center;gap:6px;}
.qv-card-title i{opacity:0.6;}
.qv-card-body{flex-grow:1;font-size:0.9rem;}
.qv-info-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;padding-bottom:6px;border-bottom:1px dashed #eee;font-size:0.9rem;}
.qv-info-row:last-child{border-bottom:none;margin-bottom:0;}
.qv-info-label{font-weight:600;color:#6c757d;font-size:0.85rem;}
.qv-info-value{font-weight:500;color:var(--text-color);text-align:right;word-break:break-all;}
.qv-timeline-container{max-height:500px;overflow-y:auto;padding-right:5px;}
.qv-timeline-container::-webkit-scrollbar{width:4px;}
.qv-timeline-container::-webkit-scrollbar-thumb{background-color:#ccc;border-radius:4px;}
.qv-event-item{display:flex;align-items:flex-start;gap:8px;padding:8px 0;border-left:2px solid #eee;padding-left:12px;margin-left:4px;position:relative;}
.qv-event-details{flex-grow:1;}
.qv-event-type{font-weight:600;font-size:0.85rem;line-height:1.2;}
.qv-event-time{font-size:0.75rem;color:#999;margin-top:2px;}
.qv-badge{display:inline-block;padding:3px 8px;border-radius:12px;font-size:0.75rem;font-weight:600;margin:0 4px 4px 0;}
.swal2-popup.qv-popup-override{padding:0!important;border-radius:12px!important;overflow:hidden;}
.qv-tooltip{position:relative;cursor:help;}
.qv-tooltip::after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translateX(-50%) translateY(10px);background:var(--primary-color);color:#fff;padding:6px 12px;border-radius:6px;font-size:0.8rem;font-weight:500;white-space:nowrap;box-shadow:0 4px 15px rgba(0,0,0,0.15);opacity:0;visibility:hidden;transition:all 0.2s ease;pointer-events:none;z-index:1060;}
.qv-tooltip::before{content:'';position:absolute;bottom:100%;left:50%;transform:translateX(-50%) translateY(10px);border:6px solid transparent;border-top-color:var(--primary-color);margin-bottom:-12px;opacity:0;visibility:hidden;transition:all 0.2s ease;pointer-events:none;z-index:1060;}
.qv-tooltip:hover::after,.qv-tooltip:hover::before{opacity:1;visibility:visible;transform:translateX(-50%) translateY(-8px);}
.qv-event-meta{margin-top:4px;font-size:0.8rem;}
.qv-field-change{background:#f8f9fa;border-left:3px solid var(--secondary-color);padding:4px 8px;margin-bottom:4px;border-radius:0 4px 4px 0;}
.qv-field-label{font-weight:600;color:var(--primary-color);font-size:0.75rem;margin-bottom:2px;}
.qv-val-old{color:#dc3545;text-decoration:line-through;opacity:0.7;font-size:0.85em;}
.qv-val-new{color:#198754;font-weight:600;}
.qv-arrow{color:#adb5bd;margin:0 5px;font-size:0.8em;}
.qv-filters-header{display:flex;gap:10px;margin-bottom:15px;background:#fff;padding:10px;border-radius:8px;border:1px solid #e9ecef;align-items:center;}
.qv-filter-input{flex:1;border:1px solid #dee2e6;border-radius:6px;padding:8px 12px;font-size:0.9rem;background:#f8f9fa;transition:all 0.2s ease;}
.qv-filter-input:focus{background:#fff;border-color:var(--primary-color);outline:none;box-shadow:0 0 0 3px rgba(var(--primary-rgb),0.1);}
.qv-filter-input::placeholder{color:#adb5bd;}

.upload-dropzone{border:2px dashed #dee2e6;border-radius:15px;background-color:#f8f9fa;transition:all 0.3s ease;min-height:280px;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;height:97%;}
.upload-dropzone:hover,.upload-dropzone.dragover{background-color:#eef2ff;border-color:var(--primary-color);}
.excel-preview-table{font-size:0.8rem;border-collapse:collapse;width:100%;color:#495057;box-shadow:0 2px 5px rgba(0,0,0,0.05);}
.excel-preview-table th{background-color:#f1f3f5;border:1px solid #dee2e6;text-align:center;font-weight:600;padding:6px;color:#868e96;}
.excel-preview-table td{border:1px solid #dee2e6;padding:6px 10px;background-color:#fff;}
.excel-row-num{background-color:#f1f3f5;border:1px solid #dee2e6;text-align:center;color:#868e96;width:35px;}
.stat-card-minimal{border:1px solid #eff2f5;border-radius:15px;background:#fff;padding:20px;height:100%;box-shadow:0 2px 6px rgba(0,0,0,0.02);display:flex;align-items:center;justify-content:space-between;border-top:3px solid var(--primary-color);}
.stat-icon-wrapper{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;}

.swal2-popup.swal-import-wide{width:80vw!important;max-width:1100px;}
@media(max-width:576px){.swal2-popup.swal-import-wide{width:100vw!important;max-width:100vw;margin:0;border-radius:0;}}
.excel-filename{max-width:260px;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.swal-import-left .swal2-html-container{text-align:left!important;}
@keyframes pulse-blue{0%{box-shadow:0 0 0 0 rgba(13,110,253,0.4);}70%{box-shadow:0 0 0 6px rgba(13,110,253,0);}100%{box-shadow:0 0 0 0 rgba(13,110,253,0);}}
.pulse-animation{animation:pulse-blue 2s infinite;}
.settings-grid-container{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;padding:10px;}
@media(max-width:768px){.settings-grid-container{grid-template-columns:1fr;}}
.badge-power-grid{background-color:#e3f2fd;color:#0d47a1;border:1px solid #90caf9;}
.badge-power-batt{background-color:#fbe9e7;color:#d84315;border:1px solid #ffab91;}
.badge-power-unknown{background-color:#f5f5f5;color:#616161;border:1px solid #e0e0e0;}
.settings-collapse-panel{background:var(--background-overlay);border-radius:8px;font-size:.85rem;color:var(--text-color);}
.qv-actions-swal{width:60vw!important;max-width:60vw!important;}
@media(max-width:768px){.qv-actions-swal{width:95vw!important;max-width:95vw!important;}}
#walletCarouselHost{width:100%;position:relative;overflow:hidden;padding:10px 0;}
.wallet-portfolio-wrapper{position:relative;width:100%;}
.wallet-scroll-track{display:flex;gap:0;overflow-x:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:20px;width:100%;}
.wallet-slide{min-width:100%;flex:0 0 100%;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;padding:0 10px;box-sizing:border-box;}
.wallet-nav-btn{position:absolute;top:95px;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,0.9);border:1px solid #e0e0e0;color:var(--primary-color);box-shadow:0 4px 10px rgba(0,0,0,0.15);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:all 0.2s ease;opacity:0;}
#walletCarouselHost:hover .wallet-nav-btn{opacity:1;}
.wallet-nav-btn:hover{background:var(--primary-color);color:white;transform:translateY(-50%) scale(1.1);}
.wallet-nav-btn.prev{left:5px;}
.wallet-nav-btn.next{right:5px;}
.wallet-stepper{display:flex;justify-content:center;gap:8px;margin-top:5px;margin-bottom:5px;}
.wallet-dot{width:8px;height:8px;background-color:#dee2e6;border-radius:50%;transition:all 0.3s ease;cursor:pointer;}
.wallet-dot.active{width:24px;background-color:var(--primary-color);border-radius:10px;}
.wallet-theme-me{background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);}
.wallet-theme-other{background:linear-gradient(135deg,#34495e 0%,#2c3e50 100%);}
.wallet-theme-empty{background:linear-gradient(135deg,#636e72 0%,#2d3436 100%);}
.wallet-label{font-size:.75rem;text-transform:uppercase;letter-spacing:1.2px;opacity:.7;margin-bottom:4px;}
.wallet-balance{font-size:2.6rem;font-weight:700;letter-spacing:-.5px;line-height:1.1;}
.wallet-user-name{font-size:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;}
.wallet-id-badge{background:rgba(255,255,255,0.15);backdrop-filter:blur(4px);padding:4px 10px;border-radius:8px;font-family:monospace;font-size:.9rem;border:1px solid rgba(255,255,255,0.1);}
.wallet-action-btn{border:none;border-radius:12px;padding:10px 0;font-size:.95rem;font-weight:600;transition:transform 0.2s;}
.wallet-action-btn:active{transform:scale(0.96);}
.btn-topup{background:var(--primary-color);color:white;box-shadow:0 4px 10px rgba(var(--primary-color-rgb),0.3);}
.btn-history{background:#e9ecef;color:var(--text-color);border:1px solid #dee2e6;}
.tx-mini-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px dashed #dee2e6;}
.tx-mini-row:last-child{border-bottom:none;}
.digital-wallet-card{width:100%;max-width:500px;height:220px;border-radius:24px;position:relative;z-index:2;box-shadow:0 15px 35px rgba(0,0,0,0.2),0 5px 15px rgba(0,0,0,0.1);transition:transform 0.3s ease;border:1px solid rgba(255,255,255,0.1);}
.wallet-details-container{width:95%;max-width:480px;background:rgba(255,255,255,0.65);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.8);border-radius:20px;margin:15px auto 0 auto;padding:20px;position:relative;z-index:1;box-shadow:0 8px 32px 0 rgba(31,38,135,0.1);}
.wallet-action-btn{border:none;border-radius:15px;padding:12px 0;font-size:.95rem;font-weight:600;transition:all 0.2s;}
.btn-topup{background:var(--primary-color);color:white;box-shadow:0 4px 12px rgba(var(--primary-color-rgb),0.4);}
.btn-history{background:rgba(255,255,255,0.8);color:var(--text-color);border:1px solid rgba(0,0,0,0.05);box-shadow:0 2px 5px rgba(0,0,0,0.05);}
.btn-history:hover{background:#fff;transform:translateY(-2px);}

.json-renderer{background-color:#ffffff;border:1px solid #e2e2e2;border-radius:6px;padding:10px;font-family:"IBM Plex Mono",monospace;font-size:.85rem;text-align:left!important;width:100%!important;box-sizing:border-box;margin:0!important;max-height:300px;overflow-y:auto;overflow-x:auto;}
ul.json-dict,ol.json-array{padding-left:10px!important;margin:0!important;border-left:1px dotted #ccc;}
.json-key{color:#1a1a1b;font-weight:600;}
.json-string{color:var(--primary-color);}
.json-literal{color:#0d6efd;font-weight:bold;}
a.json-toggle{color:#6d6e71!important;text-decoration:none;margin-right:5px;}
a.json-toggle:hover{color:var(--primary-color)!important;}
table.dataTable tbody td{vertical-align:top;}