/* ============ TRUSTMEET CSS — Final ============ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
    --neon-purple:#a855f7;--neon-pink:#ec4899;--neon-blue:#3b82f6;
    --dark-bg:#0a0a0f;--card-bg:rgba(20,20,35,0.7);
    --text:#f1f5f9;--text-muted:#94a3b8;
    --radius:20px;--radius-lg:30px;
    --transition:0.4s cubic-bezier(0.22,1,0.36,1);
    --font:'Inter',system-ui,sans-serif
}
body{
    font-family:var(--font);background:var(--dark-bg);color:var(--text);
    line-height:1.6;padding-top:80px;-webkit-font-smoothing:antialiased;
    min-height:100vh;overflow-x:hidden
}
body::before{
    content:'';position:fixed;inset:0;z-index:0;
    background:radial-gradient(circle at 20% 50%,rgba(168,85,247,0.15) 0%,transparent 50%),
               radial-gradient(circle at 80% 20%,rgba(236,72,153,0.12) 0%,transparent 50%),
               radial-gradient(circle at 50% 80%,rgba(59,130,246,0.10) 0%,transparent 50%);
    animation:ambientMove 15s ease-in-out infinite alternate
}
@keyframes ambientMove{0%,100%{background-position:0% 0%}50%{background-position:100% 100%}}
.particles{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.particle{position:absolute;width:4px;height:4px;background:var(--neon-purple);border-radius:50%;box-shadow:0 0 20px var(--neon-purple);animation:floatParticle linear infinite;opacity:0.4}
@keyframes floatParticle{0%{transform:translateY(100vh) scale(0);opacity:0}10%{opacity:0.6}90%{opacity:0.6}100%{transform:translateY(-100vh) scale(1);opacity:0}}
.container{max-width:1280px;margin:0 auto;padding:0 24px;position:relative;z-index:1}

/* ===== NAVBAR ===== */
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(10,10,15,0.6);backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(168,85,247,0.15);padding:12px 0;box-shadow:0 4px 30px rgba(0,0,0,0.3)}
.navbar .container{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.nav-logo{font-weight:900;font-size:1.5rem;display:flex;align-items:center;gap:10px;color:#fff;letter-spacing:-0.02em;text-decoration:none;cursor:pointer}
.nav-logo .shield{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;background:linear-gradient(135deg,var(--neon-purple),var(--neon-pink));border-radius:14px;color:#fff;font-size:1.2rem;box-shadow:0 0 30px rgba(168,85,247,0.4);animation:glowPulse 2s ease-in-out infinite}
@keyframes glowPulse{0%,100%{box-shadow:0 0 30px rgba(168,85,247,0.4)}50%{box-shadow:0 0 60px rgba(168,85,247,0.8)}}
.nav-links{display:flex;align-items:center;gap:6px;flex-wrap:wrap;flex:1;justify-content:center}
.nav-links > a:not(.nav-item){font-size:0.8rem;font-weight:500;color:var(--text-muted);padding:6px 14px;border-radius:40px;transition:all var(--transition);text-decoration:none;cursor:pointer;white-space:nowrap}
.nav-links > a:not(.nav-item):hover{color:#fff;text-shadow:0 0 20px rgba(168,85,247,0.5)}

/* ===== ВЕРХНЕЕ МЕНЮ — ИКОНКИ (по образцу Beauty) ===== */
.nav-links .nav-item {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center;
    gap: 2px;
    padding: 6px 10px !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: var(--text-muted);
    text-decoration: none;
    position: relative;
    transition: color 0.3s ease, opacity 0.3s ease;
    opacity: 0.85;
    white-space: nowrap;
    cursor: pointer;
}
.nav-links .nav-item i {
    font-size: 1.05rem;
    transition: transform 0.3s ease, filter 0.3s ease;
}
.nav-links .nav-item span {
    font-size: 0.65rem;
    font-weight: 500;
}
.nav-links .nav-item:hover {
    color: #fff;
    opacity: 1;
}
.nav-links .nav-item:hover i {
    transform: translateY(-2px);
}
.nav-links .nav-item:hover::after  { width: 60%; }

.nav-links .nav-item::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -2px;
    height: 2px;
    width: 0;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--neon-purple), var(--neon-pink));
    transition: width 0.3s ease;
}

.nav-links .nav-item.active {
    color: var(--neon-purple) !important;
    opacity: 1;
}
.nav-links .nav-item.active i {
    transform: translateY(-2px) scale(1.1);
    filter: drop-shadow(0 0 8px rgba(168,85,247,0.6));
}
.nav-links .nav-item.active::after  { width: 60%; }

.btn-nav-size{padding:8px 22px!important;font-weight:600!important;font-size:0.95rem}
.btn-nav{padding:8px 22px!important;font-weight:600!important;background:linear-gradient(135deg,var(--neon-purple),var(--neon-pink))!important;color:#fff!important;box-shadow:0 0 30px rgba(168,85,247,0.3)}
.btn-nav:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 0 50px rgba(168,85,247,0.5)}
.trust-badge-sm{display:inline-flex;align-items:center;gap:4px;background:rgba(168,85,247,0.15);backdrop-filter:blur(4px);padding:3px 14px 3px 6px;border-radius:40px;font-size:0.7rem;font-weight:700;border:1px solid rgba(168,85,247,0.2);color:var(--text)}
.dot{width:8px;height:8px;border-radius:10px;display:inline-block;animation:glowPulse 1.5s ease-in-out infinite}
.dot.green{background:#22c55e;box-shadow:0 0 20px rgba(34,197,94,0.5)}.dot.yellow{background:#eab308;box-shadow:0 0 20px rgba(234,179,8,0.5)}.dot.gray{background:var(--text-muted)}
.nav-avatar{width:38px;height:38px;border-radius:40px;cursor:pointer;background:linear-gradient(135deg,var(--neon-purple),var(--neon-pink));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:0.9rem}
.nav-avatar img{width:100%;height:100%;object-fit:cover;border-radius:40px}

/* ===== DROPDOWN ===== */
.nav-right{display:flex;align-items:center;gap:8px;flex-shrink:0}
.nav-dropdown{position:relative;display:flex;align-items:center}
.nav-dropdown-toggle{display:flex;align-items:center;gap:6px;cursor:pointer;padding:4px 12px 4px 4px;border-radius:40px;background:rgba(168,85,247,0.1);border:1px solid rgba(168,85,247,0.15);transition:all var(--transition);font-size:0.8rem;color:var(--text)}
.nav-dropdown-toggle:hover{background:rgba(168,85,247,0.2);border-color:rgba(168,85,247,0.3)}
.nav-dropdown-menu{display:none;position:absolute;top:calc(100% + 8px);right:0;background:rgba(20,20,35,0.98);backdrop-filter:blur(20px);border:1px solid rgba(168,85,247,0.2);border-radius:var(--radius);box-shadow:0 8px 40px rgba(0,0,0,0.5),0 0 40px rgba(168,85,247,0.1);min-width:200px;padding:8px;flex-direction:column;z-index:1001;max-height:80vh;overflow-y:auto}
.nav-dropdown-menu.active{display:flex}
.nav-dropdown-menu a{padding:10px 16px;border-radius:var(--radius-sm);font-size:0.85rem;font-weight:500;transition:all 0.2s;white-space:nowrap;color:var(--text-muted);text-decoration:none}
.nav-dropdown-menu a:hover{background:rgba(168,85,247,0.15);color:#fff}
.nav-dropdown-menu hr{border:none;border-top:1px solid rgba(168,85,247,0.1);margin:4px 8px}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 30px;border-radius:60px;font-weight:600;font-size:0.95rem;border:none;transition:all var(--transition);cursor:pointer;text-decoration:none;letter-spacing:-0.01em}
.btn-primary{background:linear-gradient(135deg,var(--neon-purple),var(--neon-pink));color:#fff;box-shadow:0 0 40px rgba(168,85,247,0.3)}
.btn-primary:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 0 60px rgba(168,85,247,0.5)}
.btn-coral{background:linear-gradient(135deg,var(--neon-pink),#db2777);color:#fff;box-shadow:0 0 40px rgba(236,72,153,0.3)}.btn-coral:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 0 60px rgba(236,72,153,0.5)}
.btn-outline{background:transparent;color:var(--text);border:1.5px solid rgba(168,85,247,0.3)}.btn-outline:hover{border-color:var(--neon-purple);color:#fff;background:rgba(168,85,247,0.1);box-shadow:0 0 30px rgba(168,85,247,0.2)}
.btn-block{width:100%;justify-content:center}.btn-lg{padding:16px 44px;font-size:1.05rem}.btn-sm{padding:8px 12px!important;font-size:0.8rem!important;height:36px!important;line-height:1!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}.btn-xs{padding:4px 12px;font-size:0.7rem}

/* ===== CARDS ===== */
.card{background:var(--card-bg);backdrop-filter:blur(16px);border-radius:var(--radius-lg);padding:28px 30px;border:1px solid rgba(168,85,247,0.15);box-shadow:0 0 40px rgba(168,85,247,0.05);transition:all var(--transition)}
.card:hover{transform:translateY(-6px);box-shadow:0 0 60px rgba(168,85,247,0.15);border-color:rgba(168,85,247,0.3)}

/* ===== BADGES ===== */
.badge{display:inline-block;padding:5px 16px;border-radius:40px;font-size:0.75rem;font-weight:600;background:rgba(168,85,247,0.15);color:var(--neon-purple);border:1px solid rgba(168,85,247,0.15);line-height:1.4}
.badge-coral{background:rgba(236,72,153,0.15);color:var(--neon-pink);border-color:rgba(236,72,153,0.15)}
.badge-green{background:rgba(34,197,94,0.15);color:#22c55e;border-color:rgba(34,197,94,0.15)}
.badge-yellow{background:rgba(234,179,8,0.15);color:#eab308;border-color:rgba(234,179,8,0.15)}
.badge-red{background:rgba(239,68,68,0.15);color:#ef4444;border-color:rgba(239,68,68,0.15)}

.activity-photo {
    width: 100%;
    max-height: 400px;
    object-fit: cover;
    border-radius: var(--radius);
    margin: 16px 0;
    border: 1px solid rgba(168,85,247,0.2);
}

/* Большой статус на странице встречи — пилюля */
.activity-status-badge {
    display:inline-block;
    padding:5px 14px;
    border-radius:40px;
    font-size:0.8rem;
    font-weight:700;
    line-height:1;
    white-space:nowrap;
    height:fit-content;
    align-self:flex-start;
}
.activity-status-badge.open{background:rgba(34,197,94,0.15);color:#22c55e;border:1px solid rgba(34,197,94,0.3)}
.activity-status-badge.in_progress{background:rgba(34,197,94,0.25);color:#22c55e;border:1px solid rgba(34,197,94,0.4)}
.activity-status-badge.cancelled{background:rgba(239,68,68,0.15);color:#ef4444;border:1px solid rgba(239,68,68,0.3)}
.activity-status-badge.full{background:rgba(234,179,8,0.15);color:#eab308;border:1px solid rgba(234,179,8,0.3)}

/* ===== ANIMATIONS ===== */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}.float{animation:float 5s ease-in-out infinite}.float-delay-1{animation-delay:0.8s}.float-delay-2{animation-delay:1.6s}
.accent{background:linear-gradient(135deg,var(--neon-purple),var(--neon-pink));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.gradient-text{background:linear-gradient(135deg,var(--neon-purple),var(--neon-pink),var(--neon-blue));background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientMove 4s ease-in-out infinite}
@keyframes gradientMove{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* ===== PAGES ===== */
.page{display:none;padding:40px 0 60px}.page.active{display:block}
.yandex-map{width:100%;border-radius:var(--radius);overflow:hidden;border:1px solid rgba(168,85,247,0.2)}.yandex-map.small{height:200px}.yandex-map.medium{height:300px}.yandex-map.large{height:400px}

/* ===== FORMS ===== */
input[type=text],input[type=email],input[type=password],input[type=number],input[type=datetime-local],textarea{font-family:var(--font)}
select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:rgba(10,10,15,0.6);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a855f7' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;color:#f1f5f9;border:1px solid rgba(168,85,247,0.2);border-radius:40px;padding:10px 38px 10px 18px;font-family:var(--font);font-size:0.9rem;cursor:pointer;transition:all var(--transition);backdrop-filter:blur(8px)}
select:hover{border-color:var(--neon-purple);box-shadow:0 0 20px rgba(168,85,247,0.2)}select:focus{outline:none;border-color:var(--neon-purple);box-shadow:0 0 30px rgba(168,85,247,0.3)}
select option{background:#1a1a2e;color:#f1f5f9;padding:12px 18px;font-family:var(--font)}

/* ===== FLASH ===== */
.flash-container{position:fixed;top:90px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:8px}
.flash{padding:14px 24px;border-radius:40px;backdrop-filter:blur(16px);font-weight:500;font-size:0.9rem;animation:slideIn 0.3s ease-out}
.flash-success{background:rgba(34,197,94,0.2);color:#22c55e;border:1px solid rgba(34,197,94,0.3)}.flash-error{background:rgba(239,68,68,0.2);color:#ef4444;border:1px solid rgba(239,68,68,0.3)}.flash-warning{background:rgba(234,179,8,0.2);color:#eab308;border:1px solid rgba(234,179,8,0.3)}.flash-info{background:rgba(59,130,246,0.2);color:#3b82f6;border:1px solid rgba(59,130,246,0.3)}
@keyframes slideIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}

/* ===== MODAL ===== */
.modal-overlay{display:none;position:fixed;inset:0;z-index:9998;background:rgba(0,0,0,0.7);backdrop-filter:blur(4px);align-items:center;justify-content:center}.modal-overlay.active{display:flex}
.modal{background:var(--card-bg);backdrop-filter:blur(20px);border-radius:var(--radius-lg);padding:32px;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;border:1px solid rgba(168,85,247,0.2);box-shadow:0 0 80px rgba(168,85,247,0.2)}.modal h3{font-size:1.5rem;font-weight:800;margin-bottom:16px}.modal-close{float:right;background:none;border:none;color:var(--text-muted);font-size:1.5rem;cursor:pointer;padding:4px 8px;border-radius:8px}.modal-close:hover{background:rgba(168,85,247,0.1);color:#fff}

/* ===== FOOTER ===== */
.footer{background:rgba(10,10,15,0.6);backdrop-filter:blur(16px);border-top:1px solid rgba(168,85,247,0.1);padding:48px 0 24px;margin-top:40px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}.footer h4{font-weight:700;margin-bottom:12px;font-size:0.95rem;color:#fff}.footer p,.footer a{font-size:0.85rem;color:var(--text-muted);line-height:1.8;text-decoration:none;cursor:pointer}.footer a:hover{color:var(--neon-purple)}.footer ul{list-style:none}.footer-bottom{border-top:1px solid rgba(168,85,247,0.1);padding-top:20px;text-align:center;font-size:0.8rem;color:var(--text-muted)}

/* ===== GRID & UTILS ===== */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:28px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.grid-4{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.text-center{text-align:center}.text-muted{color:var(--text-muted)}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}
.flex{display:flex}.flex-center{display:flex;align-items:center;justify-content:center}.gap-1{gap:8px}.gap-2{gap:12px}.gap-3{gap:20px}.flex-wrap{flex-wrap:wrap}.justify-between{justify-content:space-between}.align-center{align-items:center}
table{width:100%;border-collapse:collapse}th,td{padding:10px 12px;text-align:left;border-bottom:1px solid rgba(168,85,247,0.1);font-size:0.85rem}th{color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.5px}.overflow-x{overflow-x:auto}

/* ===== MISC ===== */
.geo-selector{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.geo-selector select,.geo-selector input{padding:8px 16px;border:1px solid rgba(168,85,247,0.2);border-radius:40px;background:rgba(20,20,35,0.6);color:#fff;font-family:var(--font);font-size:0.85rem}
.geo-selector select:focus,.geo-selector input:focus{outline:none;border-color:var(--neon-purple)}

/* ===== ADAPTIVE ===== */
@media(max-width:992px){.footer-grid{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:768px){
    .my-meetings-page .flex.gap-2.mb-3{overflow-x:auto;flex-wrap:nowrap!important;gap:6px}
    .my-meetings-page .badge{flex-shrink:0;padding:5px 8px;font-size:0.65rem;white-space:nowrap;letter-spacing:-0.3px}
    body{padding-top:72px}
    .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
    .navbar .container{flex-wrap:wrap}
    .nav-links{display:none!important}
    .nav-dropdown-menu{right:-20px;min-width:180px;top:calc(100% + 4px)}
    .nav-dropdown-toggle{font-size:0.7rem;padding:2px 8px 2px 2px}
    .activity-detail .card{padding:16px!important;margin:0 -16px;border-radius:0}

@media(max-width:480px){
    .footer-grid{grid-template-columns:1fr}
    .nav-links{display:none!important}
    .nav-dropdown-toggle{padding:2px 6px 2px 2px;font-size:0.7rem}
    .navbar .container{flex-wrap:nowrap;gap:8px}
    .nav-logo{font-size:1.1rem}
    .nav-logo .shield{width:30px;height:30px;font-size:0.9rem}
    .btn-nav{padding:6px 14px!important;font-size:0.75rem!important}
    .trust-badge-sm{font-size:0.65rem;padding:2px 8px 2px 4px}
    .nav-dropdown-menu{right:5px!important;min-width:170px!important;position:absolute!important;top:calc(100% + 8px)!important;z-index:9999!important;background:rgba(15,15,25,0.98)!important;border:1px solid rgba(168,85,247,0.3)!important;box-shadow:0 8px 30px rgba(0,0,0,0.8)!important}
    .nav-dropdown{position:static}
}

/* ===== SELECT В GEO-SELECTOR (переопределение) ===== */
.geo-selector select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: rgba(10,10,15,0.6);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a855f7' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    border-radius: 40px !important;
    padding: 10px 38px 10px 18px !important;
    color: #f1f5f9 !important;
    border: 1px solid rgba(168,85,247,0.2) !important;
    font-family: var(--font);
    cursor: pointer;
    backdrop-filter: blur(8px);
}
.geo-selector select:hover {
    border-color: var(--neon-purple) !important;
    box-shadow: 0 0 20px rgba(168,85,247,0.2);
}

.mobile-only{display:none}@media(max-width:768px){.mobile-only{display:flex!important}}
@media(max-width:768px){.desktop-only{display:none!important}}
@media(min-width:769px){.mobile-only{display:none!important}}
.dot.green {
    background: #22c55e;
    box-shadow: 0 0 20px rgba(34,197,94,0.8);
}

.mobile-nav-links {
    display: none;
    justify-content: center;
    gap: 12px;
    padding: 8px 0;
    width: 100%;
    background: rgba(10,10,15,0.8);
    border-top: 1px solid rgba(168,85,247,0.1);
}
.mobile-nav-links a {
    font-size: 0.75rem;
    color: var(--text-muted);
    text-decoration: none;
    padding: 4px 10px;
    border-radius: 20px;
    white-space: nowrap;
}
.mobile-nav-links a:hover {
    color: #fff;
    background: rgba(168,85,247,0.15);
}
@media (max-width: 768px) {
    .mobile-nav-links { display: flex; }
}
@media(max-width:768px){.activity-detail .container{padding:0!important;max-width:100%!important}.activity-detail .card{border-radius:0!important;margin:0!important}}

/* Flatpickr — мобильная тема */
.flatpickr-calendar {
    background: #1a1a2e !important;
    border: 1px solid rgba(168,85,247,0.3) !important;
    color: #f1f5f9 !important;
}
.flatpickr-day {
    color: #f1f5f9 !important;
}
.flatpickr-day.today {
    background: rgba(168,85,247,0.2) !important;
    border-color: var(--neon-purple) !important;
}
.flatpickr-day.selected {
    background: var(--neon-purple) !important;
    color: #fff !important;
}
.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-weekday,
.flatpickr-time input,
.flatpickr-time .flatpickr-time-separator {
    color: #f1f5f9 !important;
}
.flatpickr-time .numInputWrapper span {
    border-color: rgba(168,85,247,0.3) !important;
}
.flatpickr-time {
    background: #1a1a2e !important;
}
.flatpickr-time input {
    background: rgba(10,10,15,0.6) !important;
    color: #f1f5f9 !important;
    border: 1px solid rgba(168,85,247,0.2) !important;
    border-radius: 8px !important;
}
input.datetime-picker,
input.datetime-picker::placeholder {
    color: #f1f5f9 !important;
    -webkit-text-fill-color: #f1f5f9 !important;
    opacity: 1 !important;
}
