/* ============================================================
   OSINT Platform v5.0 — Responsive CSS v2
   Navbar : fond blanc (#fff), texte #1a1f36
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
img,video,svg{max-width:100%;height:auto}

/* ── Container ── */
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}


/* ======================================================
   MENU MOBILE — fond blanc opaque garanti
   ====================================================== */
.navbar-burger {
  display: none;
  background: none;
  border: 1px solid #e0e3e8;
  border-radius: 6px;
  cursor: pointer;
  padding: 7px 9px;
  flex-direction: column;
  gap: 5px;
  flex-shrink: 0;
}
.navbar-burger span {
  display: block;
  width: 20px;
  height: 2px;
  background: #1a1f36;
  border-radius: 2px;
  transition: transform .25s, opacity .25s;
}

.navbar-mobile-menu {
  display: none;
  background-color: #ffffff;
  background: #ffffff;
  border-bottom: 2px solid #e0e3e8;
  box-shadow: 0 6px 20px rgba(0,0,0,.15);
  padding: 6px 0 14px;
  width: 100%;
}
.navbar-mobile-menu.open { display: block; }
.navbar-mobile-menu a {
  display: block;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 600;
  color: #1a1f36;
  text-decoration: none;
  border-left: 3px solid transparent;
  background: #ffffff;
  transition: background .15s, border-color .15s;
}
.navbar-mobile-menu a:hover {
  background: #f0f2f5;
  border-left-color: #4a7cf0;
  color: #4a7cf0;
}
.navbar-mobile-menu a.active {
  border-left-color: #4a7cf0;
  color: #4a7cf0;
  background: #e8eeff;
}
.navbar-mobile-menu a.btn-logout-mobile {
  color: #f97316;
  border-top: 1px solid #e0e3e8;
  margin-top: 6px;
  padding-top: 14px;
}
.navbar-mobile-menu a.btn-connexion-mobile {
  color: #4a7cf0;
  font-weight: 700;
}

/* ======================================================
   ADMIN RESPONSIVE
   ====================================================== */
.admin-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.admin-header-actions {
  display: flex;
  gap: 12px;
  align-items: center;
}
.admin-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  border-radius: 8px;
}

/* ── Tables responsive ── */
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:8px}

/* ── Forms ── */
.input-group{display:flex;flex-wrap:wrap;gap:8px}
.input-group .form-control{flex:1;min-width:150px}
.form-control{width:100%;min-width:0}

/* ── Grids ── */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:24px}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.veille-subcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;padding:16px}

/* ── Admin ── */
.admin-container{max-width:1200px;margin:0 auto;padding:20px}
.admin-wrap{width:100%;overflow-x:hidden}
.admin-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:24px}
.admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.admin-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:8px;width:100%}

/* ================================================
   ≤ 1024px
   ================================================ */
@media(max-width:1024px){
  .container{padding:0 16px}
  .admin-container{padding:16px}
  .stats-grid{grid-template-columns:repeat(3,1fr)}
  .veille-subcards{grid-template-columns:repeat(3,1fr)}
}

/* ================================================
   ≤ 768px — Tablette portrait + burger actif
   ================================================ */
@media(max-width:768px){
  html{font-size:15px}
  .container{padding:0 14px}

  /* Burger visible, nav cachée */
  .navbar-burger{display:flex}
  .navbar-nav{display:none !important}
  .badge-version,.badge-dev{display:none}

  /* Hero */
  .hero-content{padding:18px 14px;gap:14px;flex-wrap:wrap}

  /* Stats 2 colonnes */
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .stat-card{padding:14px}

  /* Veille 2 colonnes */
  .veille-subcards{grid-template-columns:repeat(2,1fr);gap:10px}
  .veille-header{flex-direction:column !important;gap:8px;align-items:flex-start !important}
  .veille-actions{flex-direction:column;gap:8px}

  /* ── ADMIN RESPONSIVE ── */
  .admin-container{padding:12px}

  /* Header admin (flex space-between → colonne) */
  .admin-header-row{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
  }
  .admin-header-actions{
    width:100%;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }

  /* Stats admin */
  .admin-stats-grid{grid-template-columns:repeat(2,1fr);gap:8px}

  /* Grid admin */
  .admin-grid{grid-template-columns:repeat(2,1fr);gap:10px}

  /* Tables admin scrollables */
  .admin-container table,
  .admin-wrap table{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    white-space:nowrap;
    font-size:13px;
  }
  .admin-container th,
  .admin-container td{padding:8px 10px !important;font-size:13px}

  /* Boutons admin */
  .admin-container .btn{padding:7px 12px;font-size:12px}

  /* Cards */
  .cards-grid{grid-template-columns:1fr}

  /* OSINT Tools */
  .ot-tab{padding:8px 12px;font-size:12px}
  .ot-stats{display:grid !important;grid-template-columns:repeat(3,1fr) !important}
  .ot-stat .n{font-size:20px !important}
  .ot-grid{grid-template-columns:1fr !important}
  .ot-card{padding:16px}
  .ot-info-card{padding:10px}

  /* iOS zoom fix */
  input[type="text"],input[type="email"],input[type="url"],
  input[type="password"],input[type="search"],
  select,textarea{font-size:16px !important}

  /* Scrollbar fine */
  ::-webkit-scrollbar{width:4px;height:4px}
  ::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:4px}
}

/* ================================================
   ≤ 640px
   ================================================ */
@media(max-width:640px){
  html{font-size:14px}
  .container{padding:0 12px}
  .admin-container{padding:10px}

  .ot-tabs{flex-wrap:nowrap !important;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
  .ot-tab{white-space:nowrap;flex-shrink:0}
  .ot-stats{display:grid !important;grid-template-columns:repeat(2,1fr) !important;gap:6px}
  .ot-result{flex-wrap:wrap;gap:6px}
  .ot-site{min-width:auto}

  .veille-subcards{grid-template-columns:1fr}
  .admin-stats-grid{grid-template-columns:repeat(2,1fr);gap:6px}

  .hide-mobile{display:none !important}
}

/* ================================================
   ≤ 480px — Mobile portrait
   ================================================ */
@media(max-width:480px){
  html{font-size:13px}
  .navbar-logo strong{font-size:14px}
  .hero-content{padding:12px}

  .stats-grid{grid-template-columns:1fr}
  .admin-grid{grid-template-columns:1fr !important}
  .admin-stats-grid{grid-template-columns:repeat(2,1fr)}
  .ot-stats{grid-template-columns:repeat(2,1fr) !important}
  .ot-grid{grid-template-columns:1fr !important}
  .ot-url{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ot-btn{width:100%;justify-content:center}
  .ot-ext-link{width:100%;justify-content:center}
  .ot-link-grid{flex-direction:column}
  .ot-terminal-body{font-size:11px}
}

/* ── Print ── */
@media print{
  .navbar,.site-footer,.btn,.ot-btn,.ot-terminal,
  #terminal{display:none !important}
  .container{max-width:100%;padding:0}
  body{font-size:12pt}
}