/* OSINT Dashboard — Responsive Breakpoints & Print */

/* iPhone notch / safe-area insets */
@supports(padding:env(safe-area-inset-top)){
  .header{padding-top:max(10px,env(safe-area-inset-top));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .main{padding-bottom:max(12px,env(safe-area-inset-bottom))}
  .sidebar{padding-bottom:max(0px,env(safe-area-inset-bottom))}
  .mobile-bottom-nav{padding-bottom:env(safe-area-inset-bottom)}
}

@media print{
  .header,.sidebar,.smart-bar,.hamburger,.overlay,.toast,.modal-overlay,.btn,.input-group,.panel-actions,.cmd-overlay{display:none!important}
  .container{display:block!important}
  .main{max-height:none!important;padding:0!important}
  .panel{display:block!important;page-break-after:always}
  .panel:empty{display:none!important}
  .link-card{break-inside:avoid;border:1px solid #ccc;box-shadow:none}
  body{background:#fff!important;color:#000!important}
  .result-card,.link-card,.live-data,.info-card{background:#fff!important;border-color:#ccc!important;color:#000!important}
  .badge,.cat-header,.panel-title,.panel-desc{color:#000!important}
  a{color:#0066cc!important}
}

@media(max-width:900px) and (min-width:600px){
  .sidebar{position:fixed;left:0;top:65px;bottom:0;z-index:100;width:220px;transition:left .3s ease;box-shadow:4px 0 20px rgba(0,0,0,.5)}
  .hamburger{display:none}
  .main{margin-left:220px}
}
@media(max-width:599px){
  .sidebar{position:fixed;left:-260px;top:65px;bottom:0;z-index:100;width:260px;transition:left .3s ease;box-shadow:4px 0 20px rgba(0,0,0,.5)}
  .sidebar.open{left:0}
  .hamburger{display:block}
  .overlay{display:none;position:fixed;top:65px;right:0;bottom:0;left:0;background:rgba(0,0,0,.5);z-index:99}
  .overlay.show{display:block}
}
@media(max-width:900px){
  .container{flex-direction:column}
  .main{padding:12px;max-height:none;overflow-y:auto}
  .link-grid,.info-grid{grid-template-columns:1fr}
  .check-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .header-right .shortcut-hint{display:none}
  .dash-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:6px}
  .dash-stat{padding:10px 6px}
  .dash-stat .ds-val{font-size:20px}
  .dash-stat .ds-icon{font-size:18px}
  .dash-stat .ds-label{font-size:9px}
  .dash-section-title{font-size:12px}
  .dash-activity-item{font-size:11px;padding:6px 8px;gap:6px}
  .panel-header{flex-wrap:wrap;gap:8px}
  .panel-actions{flex-wrap:wrap;gap:4px}
  .panel-title{font-size:16px}
  .panel-desc{font-size:12px}
  .threat-bar{padding:4px 10px;gap:4px;font-size:10px}
  .header{padding:10px 12px;gap:8px}
  .header h1{font-size:16px}
  .header .tag{font-size:9px;padding:2px 6px}
  .fl-region{min-width:150px!important}
  .input-group{flex-wrap:wrap}
  .ew-alert{font-size:12px}
  .principal-card,.threat-card,.sigact-item{font-size:12px}
  .threat-actions{flex-wrap:wrap;gap:4px}
  .threat-actions .btn{font-size:10px;padding:3px 6px}
  .dash-section .btn-sm{font-size:10px;padding:4px 8px;min-height:36px}
}

@media(max-width:768px){
  .dash-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:5px}
  .dash-stat .ds-val{font-size:18px}
  .dash-stat .ds-icon{font-size:16px}
  .dash-stat .ds-spark{height:12px}
  .map-stats{gap:8px}
  .map-stat{padding:6px 10px;min-width:70px}
  .map-stat .ms-val{font-size:18px}
  .smart-bar{padding:14px 16px}
  .smart-bar input{min-width:180px;padding:10px 14px;font-size:14px}
  .cmd-box{max-width:90%;width:95%}
}

@media(max-width:480px){
  .main{padding:8px;padding-bottom:64px}
  .dash-grid{grid-template-columns:repeat(3,1fr);gap:3px}
  .dash-stat{padding:8px 4px;border-radius:8px}
  .dash-stat .ds-val{font-size:14px}
  .dash-stat .ds-icon{font-size:14px}
  .dash-stat .ds-label{font-size:8px;letter-spacing:.5px}
  .dash-stat .ds-spark{display:none}
  .header h1{font-size:14px}
  .header h1 span{letter-spacing:0}
  .header .tag{display:none}
  #platform-badge{display:none!important}
  #network-badge span{display:none}
  .header-right .btn{font-size:10px;padding:3px 6px;min-height:32px}
  .header-right .btn-sm:not(.notif-bell):not([onclick*="Duress"]):not([onclick*="SOS"]){display:none}
  .threat-bar{font-size:9px;padding:3px 8px}
  .mobile-bottom-nav{display:flex!important}
  #pwa-install-banner{bottom:70px;left:8px;right:8px}
}

/* Mobile bottom nav bar */
.mobile-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:200;background:var(--surface,#111827);border-top:1px solid var(--border,#2a3544);justify-content:space-around;align-items:center;height:56px;gap:0}
.mobile-bottom-nav button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:none;border:none;color:var(--text2,#94a3b8);font-size:18px;padding:6px 0;cursor:pointer;gap:2px;-webkit-tap-highlight-color:transparent}
.mobile-bottom-nav button span{font-size:9px;font-weight:500}
.mobile-bottom-nav button.active{color:var(--accent,#00d4aa)}

/* AI Insight widgets — tablet */
@media(max-width:900px){
  .ai-card,.auto-widget,[class*="auto-"][class*="-widget"]{max-width:100%;overflow-x:auto;font-size:12px}
  .ai-card table,.auto-widget table{font-size:11px}
  .ai-card .bar,.auto-widget .bar{min-width:40px}
  .ai-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))!important}
}

/* AI Insight widgets — mobile */
@media(max-width:480px){
  .ai-card,.auto-widget,[class*="auto-"][class*="-widget"]{padding:8px;font-size:11px;border-radius:8px}
  .ai-card h4,.auto-widget h4{font-size:12px;margin-bottom:4px}
  .ai-card table,.auto-widget table{font-size:10px}
  .ai-card table td,.auto-widget table td{padding:2px 4px}
  .ai-card svg,.auto-widget svg{max-width:100%;height:auto}
  .ai-grid{grid-template-columns:1fr!important}
}

@media(max-width:360px){
  .dash-grid{grid-template-columns:repeat(2,1fr);gap:3px}
  .dash-stat .ds-val{font-size:13px}
  .header h1{font-size:12px}
}

/* Orientation-specific — landscape phone */
@media(max-width:900px) and (orientation:landscape){
  .header{padding:6px 12px;min-height:auto}
  .header h1{font-size:14px}
  .sidebar{top:50px}
  .overlay{top:50px}
  .main{padding-top:8px}
  .mobile-bottom-nav{height:44px}
  .mobile-bottom-nav button{font-size:16px}
  .mobile-bottom-nav button span{font-size:8px}
}

/* Orientation data attribute (set by platform-features.js) */
[data-orientation="portrait"] .ai-grid{grid-template-columns:1fr!important}

/* Keyboard open — hide header + nav to maximize screen space */
.keyboard-open .header{position:relative;margin-top:-65px;transition:margin-top .2s ease}
.keyboard-open .mobile-bottom-nav{display:none!important}
.keyboard-open .smart-bar{position:relative}
/* Sidebar stays visible on tablets — only hide on phones */
@media(max-width:599px){.keyboard-open .sidebar{display:none!important}}

/* Low battery mode — reduce animations to save power */
.low-battery *{animation-duration:0s!important;transition-duration:.1s!important}
.low-battery .threat-bar{animation:none!important}
@media(max-width:599px){.critical-battery .sidebar{display:none!important}}
.critical-battery .notif-panel{display:none!important}

/* High contrast mode */
.high-contrast{--bg:#000!important;--surface:#111!important;--border:#fff!important;--text:#fff!important;--text2:#ddd!important}
.high-contrast .info-card,.high-contrast .card,.high-contrast .ew-card{border:2px solid #fff!important}
.high-contrast .btn{border:2px solid #fff!important}
.high-contrast .tag{border:1px solid #fff!important;color:#fff!important}

/* Globe responsive */
@media(max-width:900px){
  #globe-container{height:min(450px, calc(100vh - 180px))}
  #globe-container .globe-overlay button{padding:4px 8px;font-size:10px}
}
@media(max-width:480px){
  #globe-container{height:min(350px, calc(100vh - 160px))}
  #globe-container .globe-overlay{max-width:160px}
  #globe-container .globe-overlay button{padding:3px 6px;font-size:9px}
}
@media(max-width:900px) and (orientation:landscape){
  #globe-container{height:min(320px, calc(100vh - 120px))}
}

/* Reduced motion */
.reduced-motion *{animation:none!important;transition:none!important}