/*
 * Дополнительные стили страницы видеонаблюдения.
 * Здесь находятся стили окна уведомления администратора после входа.
 */
    /* Красивое уведомление администратора после входа в видеонаблюдение.
       Блок можно отключить одной настройкой в JS: VIDEO_ADMIN_NOTICE.enabled = false. */
    .video-admin-notice{
      position:fixed;
      inset:0;
      display:grid;
      place-items:center;
      padding:22px;
      background:
        radial-gradient(circle at 25% 20%, rgba(255,184,63,.18), transparent 32%),
        radial-gradient(circle at 76% 16%, rgba(96,165,250,.22), transparent 34%),
        rgba(5,12,29,.68);
      backdrop-filter:blur(12px) saturate(150%);
      opacity:0;
      visibility:hidden;
      pointer-events:none;
      transition:opacity .28s ease, visibility .28s ease;
      z-index:10000;
    }
    .video-admin-notice.is-visible{
      opacity:1;
      visibility:visible;
      pointer-events:auto;
    }
    .video-admin-notice__panel{
      width:min(760px,100%);
      position:relative;
      overflow:hidden;
      border-radius:28px;
      border:1px solid rgba(255,190,74,.82);
      color:#f8fbff;
      background:
        linear-gradient(135deg, rgba(20,65,118,.88), rgba(15,31,68,.94) 46%, rgba(24,88,145,.9)),
        radial-gradient(circle at 82% 10%, rgba(255,205,92,.26), transparent 34%);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.12) inset,
        0 0 46px rgba(255,184,63,.5),
        0 28px 80px rgba(0,0,0,.42);
      transform:translateY(16px) scale(.98);
      transition:transform .28s ease;
    }
    .video-admin-notice.is-visible .video-admin-notice__panel{
      transform:translateY(0) scale(1);
    }
    .video-admin-notice__panel::before{
      content:"";
      position:absolute;
      inset:-1px;
      background:linear-gradient(120deg, rgba(255,255,255,.22), transparent 35%, rgba(255,200,88,.18) 70%, transparent);
      pointer-events:none;
      opacity:.72;
    }
    .video-admin-notice__content{
      position:relative;
      padding:28px;
      display:grid;
      gap:18px;
    }
    .video-admin-notice__top{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:16px;
      padding-right:44px;
    }
    .video-admin-notice__badge{
      display:inline-flex;
      width:max-content;
      padding:6px 12px;
      border-radius:999px;
      color:#ffd475;
      font-size:12px;
      font-weight:700;
      background:rgba(255,184,63,.14);
      border:1px solid rgba(255,184,63,.34);
      box-shadow:0 0 18px rgba(255,184,63,.16);
    }
    .video-admin-notice h2{
      margin:10px 0 8px;
      font-size:clamp(26px,4vw,42px);
      line-height:1.08;
      letter-spacing:-.03em;
      text-shadow:0 2px 18px rgba(0,0,0,.38);
    }
    .video-admin-notice__lead{
      margin:0;
      max-width:62ch;
      color:rgba(248,251,255,.86);
      font-size:15px;
      line-height:1.55;
    }
    .video-admin-notice__close{
      position:absolute;
      top:18px;
      right:18px;
      z-index:2;
      width:42px;
      height:42px;
      border-radius:999px;
      border:1px solid rgba(255,211,119,.48);
      color:#fff;
      background:rgba(10,20,44,.78);
      box-shadow:0 0 18px rgba(255,184,63,.18), inset 0 0 16px rgba(255,255,255,.08);
      cursor:pointer;
      font-size:28px;
      line-height:1;
      transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    }
    .video-admin-notice__close:hover,
    .video-admin-notice__close:focus-visible{
      transform:translateY(-1px);
      border-color:rgba(255,211,119,.82);
      box-shadow:0 0 24px rgba(255,184,63,.32), inset 0 0 16px rgba(255,255,255,.12);
      outline:none;
    }
    .video-admin-notice__grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:12px;
    }
    .video-admin-notice__item{
      padding:14px;
      border-radius:18px;
      background:rgba(7,18,42,.48);
      border:1px solid rgba(255,255,255,.14);
      box-shadow:inset 0 0 18px rgba(255,255,255,.05);
    }
    .video-admin-notice__item strong{
      display:block;
      margin-bottom:6px;
      color:#ffd475;
      font-size:14px;
    }
    .video-admin-notice__item span{
      color:rgba(248,251,255,.84);
      font-size:13px;
      line-height:1.45;
    }
    .video-admin-notice__note{
      margin:0;
      padding:14px 16px;
      border-radius:18px;
      background:linear-gradient(90deg, rgba(255,184,63,.2), rgba(255,255,255,.08));
      border:1px solid rgba(255,184,63,.3);
      color:#fff3d0;
      line-height:1.5;
    }
    .video-admin-notice__actions{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      justify-content:flex-end;
    }
    .video-admin-notice__btn{
      min-height:42px;
      padding:10px 16px;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.2);
      color:#fff;
      background:rgba(255,255,255,.1);
      cursor:pointer;
      font-weight:700;
      transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    }
    .video-admin-notice__btn:hover,
    .video-admin-notice__btn:focus-visible{
      transform:translateY(-1px);
      border-color:rgba(255,211,119,.7);
      box-shadow:0 0 22px rgba(255,184,63,.24);
      outline:none;
    }
    .video-admin-notice__btn.primary{
      color:#14213b;
      background:linear-gradient(180deg,#ffe68f,#ffb731);
      border-color:rgba(255,232,157,.86);
      box-shadow:0 10px 28px rgba(255,184,63,.24);
    }
    @media(max-width:720px){
      .video-admin-notice{padding:14px}
      .video-admin-notice__content{padding:20px}
      .video-admin-notice__grid{grid-template-columns:1fr}
      .video-admin-notice__actions{justify-content:stretch}
      .video-admin-notice__btn{width:100%}
    }

/* 2026-05 polish: less intrusive notice presentation. */
.video-admin-notice{
  background:rgba(5,12,29,.72);
}

.video-admin-notice__panel{
  border-radius:14px;
  border-color:rgba(230,195,127,.34);
  background:linear-gradient(135deg,rgba(17,27,42,.98),rgba(21,37,58,.96));
  box-shadow:0 26px 70px rgba(0,0,0,.45);
}

.video-admin-notice__panel::before{
  display:none;
}

.video-admin-notice__badge{
  letter-spacing:0;
  color:#ffd896;
  background:rgba(230,195,127,.12);
  border-color:rgba(230,195,127,.24);
}

.video-admin-notice h2{
  letter-spacing:0;
  font-size:clamp(24px,3vw,34px);
}

.video-admin-notice__item,
.video-admin-notice__note{
  border-radius:10px;
}

.video-admin-notice__item{
  background:rgba(255,255,255,.055);
}

.video-admin-notice__item strong{
  color:#ffd896;
}

.video-admin-notice__note{
  color:rgba(248,251,255,.86);
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.12);
}

.video-admin-notice__btn,
.video-admin-notice__close{
  border-radius:10px;
}