*{
  box-sizing:border-box;
}

:root{
  color-scheme:dark;
  --bg:#050608;
  --bg-alt:#090b12;
  --card:#0d0f18;
  --card-2:#111421;
  --text:#ffffff;
  --muted:#cfcfcf;
  --soft:#b8b8b8;
  --border:rgba(255,255,255,.10);
  --blue:#2734c9;
  --blue-hover:#1d27a8;
  --blue-light:#8d98ff;
  --danger:#ff4d6d;
  --success:#20c997;
  --warning:#ffc857;
  --shadow:0 20px 55px rgba(39,52,201,.14);
}

html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#050608;
  --bg-alt:#090b12;
  --card:#0d0f18;
  --card-2:#111421;
  --text:#ffffff;
  --muted:#cfcfcf;
  --soft:#b8b8b8;
  --border:rgba(255,255,255,.10);
  --blue:#2734c9;
  --blue-hover:#1d27a8;
  --blue-light:#8d98ff;
  --danger:#ff4d6d;
  --success:#20c997;
  --warning:#ffc857;
  --shadow:0 20px 55px rgba(39,52,201,.14);
}

html[data-theme="light"]{
  color-scheme:light;
  --bg:#f5f7fb;
  --bg-alt:#ffffff;
  --card:#ffffff;
  --card-2:#f9fafb;
  --text:#111827;
  --muted:#4b5563;
  --soft:#6b7280;
  --border:rgba(17,24,39,.12);
  --blue:#2734c9;
  --blue-hover:#1d27a8;
  --blue-light:#2734c9;
  --danger:#dc3545;
  --success:#198754;
  --warning:#f0ad00;
  --shadow:0 18px 45px rgba(17,24,39,.08);
}

html{
  scroll-behavior:smooth;
  background:var(--bg)!important;
  color:var(--text)!important;
}

body{
  margin:0;
  background:var(--bg)!important;
  color:var(--text)!important;
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.7;
}

a{
  text-decoration:none;
  color:inherit;
}

a:hover,
a:focus{
  color:var(--blue-light);
}

.container{
  width:90%;
  max-width:1200px;
  margin:auto;
}

.wrap{
  padding:60px 0;
}

.card{
  background:var(--card)!important;
  border:1px solid var(--border);
  border-radius:22px;
  padding:28px;
  margin-bottom:20px;
  box-shadow:var(--shadow);
  color:var(--text)!important;
}

.site-header,
header.site-header,
.site-footer,
footer.site-footer{
  background:var(--card)!important;
  color:var(--text)!important;
  border-color:var(--border)!important;
}

.site-header *,
.site-footer *{
  color:inherit;
}

.site-header .main-nav a,
.site-footer a:not(.btn){
  color:var(--muted)!important;
}

.site-header .main-nav a:hover,
.site-header .main-nav a:focus,
.site-header .main-nav a.active,
.site-footer a:not(.btn):hover,
.site-footer a:not(.btn):focus{
  color:var(--blue-light)!important;
}

h1,h2,h3,h4,h5,h6{
  color:var(--text);
  margin-top:0;
}

p{
  color:var(--muted);
}

.btn,
a.btn,
button.btn,
input[type="submit"].btn,
input[type="button"].btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:var(--blue)!important;
  border:1px solid var(--blue)!important;
  color:#ffffff!important;
  padding:12px 16px;
  border-radius:10px;
  font-weight:900;
  cursor:pointer;
margin: 20px 5px 0 0;
  text-decoration:none!important;
  line-height:1.2;
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease;
}

.btn:hover,
.btn:focus,
a.btn:hover,
a.btn:focus,
button.btn:hover,
button.btn:focus,
input[type="submit"].btn:hover,
input[type="submit"].btn:focus,
input[type="button"].btn:hover,
input[type="button"].btn:focus{
  background:var(--blue-hover)!important;
  border-color:var(--blue-hover)!important;
  color:#ffffff!important;
  text-decoration:none!important;
}

.btn.outline,
a.btn.outline,
button.btn.outline,
input[type="submit"].btn.outline,
input[type="button"].btn.outline,
.outline,
.outline-btn,
.login-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:transparent!important;
  border:1px solid var(--border)!important;
  color:var(--text)!important;
  padding:11px 16px;
  border-radius:10px;
  font-weight:900;
  cursor:pointer;
  text-decoration:none!important;
  line-height:1.2;
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease;
}

.btn.outline:hover,
.btn.outline:focus,
a.btn.outline:hover,
a.btn.outline:focus,
button.btn.outline:hover,
button.btn.outline:focus,
input[type="submit"].btn.outline:hover,
input[type="submit"].btn.outline:focus,
input[type="button"].btn.outline:hover,
input[type="button"].btn.outline:focus,
.outline:hover,
.outline:focus,
.outline-btn:hover,
.outline-btn:focus,
.login-btn:hover,
.login-btn:focus{
  background:var(--blue)!important;
  border-color:var(--blue)!important;
  color:#ffffff!important;
  text-decoration:none!important;
}

html[data-theme="dark"] .btn.outline:hover,
html[data-theme="dark"] .btn.outline:focus,
html[data-theme="dark"] a.btn.outline:hover,
html[data-theme="dark"] a.btn.outline:focus,
html[data-theme="dark"] button.btn.outline:hover,
html[data-theme="dark"] button.btn.outline:focus,
html[data-theme="dark"] .outline:hover,
html[data-theme="dark"] .outline:focus,
html[data-theme="dark"] .outline-btn:hover,
html[data-theme="dark"] .outline-btn:focus,
html[data-theme="dark"] .login-btn:hover,
html[data-theme="dark"] .login-btn:focus{
  background:var(--blue-light)!important;
  border-color:var(--blue-light)!important;
  color:#050608!important;
}

html[data-theme="light"] .btn.outline:hover,
html[data-theme="light"] .btn.outline:focus,
html[data-theme="light"] a.btn.outline:hover,
html[data-theme="light"] a.btn.outline:focus,
html[data-theme="light"] button.btn.outline:hover,
html[data-theme="light"] button.btn.outline:focus,
html[data-theme="light"] .outline:hover,
html[data-theme="light"] .outline:focus,
html[data-theme="light"] .outline-btn:hover,
html[data-theme="light"] .outline-btn:focus,
html[data-theme="light"] .login-btn:hover,
html[data-theme="light"] .login-btn:focus{
  background:var(--blue)!important;
  border-color:var(--blue)!important;
  color:#ffffff!important;
}

.site-header .nav-actions .btn,
.site-header .nav-actions a.btn,
.site-header .nav-actions button.btn,
.site-footer .btn,
.site-footer a.btn,
.site-footer button.btn{
  color:#ffffff!important;
}

.site-header .nav-actions .btn.outline,
.site-header .nav-actions a.btn.outline,
.site-header .nav-actions button.btn.outline,
.site-footer .btn.outline,
.site-footer a.btn.outline,
.site-footer button.btn.outline{
  background:transparent!important;
  border-color:var(--border)!important;
  color:var(--text)!important;
}

.site-header .nav-actions .btn.outline:hover,
.site-header .nav-actions .btn.outline:focus,
.site-header .nav-actions a.btn.outline:hover,
.site-header .nav-actions a.btn.outline:focus,
.site-header .nav-actions button.btn.outline:hover,
.site-header .nav-actions button.btn.outline:focus,
.site-footer .btn.outline:hover,
.site-footer .btn.outline:focus,
.site-footer a.btn.outline:hover,
.site-footer a.btn.outline:focus,
.site-footer button.btn.outline:hover,
.site-footer button.btn.outline:focus{
  background:var(--blue)!important;
  border-color:var(--blue)!important;
  color:#ffffff!important;
}

html[data-theme="dark"] .site-header .nav-actions .btn.outline:hover,
html[data-theme="dark"] .site-header .nav-actions .btn.outline:focus,
html[data-theme="dark"] .site-footer .btn.outline:hover,
html[data-theme="dark"] .site-footer .btn.outline:focus{
  background:var(--blue-light)!important;
  border-color:var(--blue-light)!important;
  color:#050608!important;
}

#themeToggle,
.theme-toggle{
  white-space:nowrap;
  color:var(--text)!important;
}

#themeToggle:hover,
#themeToggle:focus,
.theme-toggle:hover,
.theme-toggle:focus{
  color:#ffffff!important;
}

html[data-theme="dark"] #themeToggle:hover,
html[data-theme="dark"] #themeToggle:focus,
html[data-theme="dark"] .theme-toggle:hover,
html[data-theme="dark"] .theme-toggle:focus{
  background:var(--blue-light)!important;
  border-color:var(--blue-light)!important;
  color:#050608!important;
}

html[data-theme="light"] #themeToggle:hover,
html[data-theme="light"] #themeToggle:focus,
html[data-theme="light"] .theme-toggle:hover,
html[data-theme="light"] .theme-toggle:focus{
  background:var(--blue)!important;
  border-color:var(--blue)!important;
  color:#ffffff!important;
}

.danger,
.btn.danger,
button.danger,
a.danger{
  background:var(--danger)!important;
  border-color:var(--danger)!important;
  color:#ffffff!important;
}

.success,
.btn.success,
button.success,
a.success{
  background:var(--success)!important;
  border-color:var(--success)!important;
  color:#ffffff!important;
}

input,
select,
textarea{
  width:100%;
  padding:14px;
  border-radius:12px;
  border:1px solid var(--border);
  background:var(--bg);
  color:var(--text);
  /*margin-bottom:14px;*/
  outline:none;
}
select {
  width:100%;
  padding:14px 45px 14px 14px;
  border-radius:12px;
  border:1px solid var(--border);
  background-color:var(--bg);
  color:var(--text);
  outline:none;

  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;

  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") !important;

  background-repeat:no-repeat !important;
  background-position:right 12px center !important;
  background-size:20px !important;
}
@media(max-width:500px){
    input,
select,
textarea{
    margin-bottom:14px;
}

}
@media (max-width:500px) {
    .show-pass {
        top: 38% !important;
        /*transform: translateY(0);*/
    }
}
input:focus,
select:focus,
textarea:focus{
  border-color:var(--blue-light);
}

textarea{
  min-height:110px;
  resize:vertical;
}

.badge{
  display:inline-block;
  background:rgba(39,52,201,.18);
  color:var(--blue-light);
  padding:7px 12px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
}

.status{
  display:inline-block;
  padding:6px 12px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
}

.status.default{
  background:rgba(39,52,201,.15);
  color:var(--blue-light);
}

.status.warning{
  background:rgba(255,200,87,.13);
  color:var(--warning);
  border:1px solid rgba(255,200,87,.25);
}

.status.success{
  background:rgba(32,201,151,.13)!important;
  color:var(--success)!important;
  border:1px solid rgba(32,201,151,.25);
}

.status.danger{
  background:rgba(255,77,109,.13)!important;
  color:var(--danger)!important;
  border:1px solid rgba(255,77,109,.25);
}

.table-wrap{
  overflow-x:auto;
}

table{
  width:100%;
  border-collapse:collapse;
  color:var(--text);
}

th,
td{
  padding:14px;
  border-bottom:1px solid var(--border);
  text-align:left;
}

th{
  color:var(--blue-light);
}

td{
  color:var(--text);
}

.grid{
  display:grid;
  gap:16px;
}

.invoice-paper{
  background:var(--card);
  color:var(--text);
}

.invoice-paper p{
  color:var(--muted);
}

html[data-theme="light"] .invoice-paper{
  background:#ffffff;
  color:#111827;
}

html[data-theme="light"] .invoice-paper p{
  color:#4b5563;
}

html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
  background:#ffffff;
  color:#111827;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea{
  background:#050608;
  color:#ffffff;
}

@media(max-width:800px){
  .container{
    width:92%;
  }

  .wrap{
    padding:40px 0;
  }

  .card{
    padding:22px;
    /*text-align: center;*/
  }

  .btn,
  .outline,
  .outline-btn,
  .login-btn{
    width:100%;
    text-align:center;
  }
}
/* Floating chat support widget */
.ig-chat-widget{
  position:fixed;
  right:max(16px, env(safe-area-inset-right));
  bottom:max(16px, env(safe-area-inset-bottom));
  z-index:1200;
  font-family:Arial,Helvetica,sans-serif;
}

.ig-chat-toggle{
  width:clamp(54px, 12vw, 62px);
  height:clamp(54px, 12vw, 62px);
  border-radius:50%;
  border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(135deg,var(--blue),var(--blue-hover))!important;
  color:#fff!important;
  box-shadow:0 18px 45px rgba(39,52,201,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  position:relative;
  padding:0;
  touch-action:manipulation;
}

.ig-chat-toggle:hover,
.ig-chat-toggle:focus{
  transform:translateY(-2px);
  box-shadow:0 22px 55px rgba(39,52,201,.45);
  outline:none;
}

.ig-chat-toggle svg{
  width:clamp(25px, 6vw, 29px);
  height:clamp(25px, 6vw, 29px);
  display:block;
}

.ig-chat-pulse{
  position:absolute;
  top:10px;
  right:10px;
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--success);
  border:2px solid #fff;
}

.ig-chat-panel{
  position:absolute;
  right:0;
  bottom:calc(clamp(54px, 12vw, 62px) + 16px);
  width:min(380px, calc(100vw - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));
  max-height:min(620px, calc(100dvh - 104px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
  background:var(--card)!important;
  color:var(--text)!important;
  border:1px solid var(--border);
  border-radius:24px;
  box-shadow:0 24px 70px rgba(0,0,0,.28), var(--shadow);
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  transform:translateY(14px) scale(.98);
  pointer-events:none;
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
  display:flex;
  flex-direction:column;
}

.ig-chat-widget.is-open .ig-chat-panel{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}

.ig-chat-header{
  padding:clamp(14px, 4vw, 18px) clamp(14px, 4vw, 18px) clamp(12px, 3.5vw, 16px);
  background:linear-gradient(135deg,var(--blue),var(--blue-hover));
  color:#fff;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  flex:0 0 auto;
}

.ig-chat-header strong{
  color:#fff;
  display:block;
  font-size:clamp(16px, 4.8vw, 18px);
  line-height:1.2;
}

.ig-chat-header span{
  color:rgba(255,255,255,.82);
  display:block;
  font-size:clamp(12px, 3.6vw, 13px);
  line-height:1.4;
  margin-top:4px;
}

.ig-chat-close{
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  width:34px;
  height:34px;
  border-radius:10px;
  cursor:pointer;
  font-size:22px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  touch-action:manipulation;
}

.ig-chat-close:hover,
.ig-chat-close:focus{
  background:rgba(255,255,255,.24);
  outline:none;
}

.ig-chat-body{
  padding:clamp(14px, 4vw, 18px);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}

.ig-chat-message{
  background:var(--card-2);
  color:var(--muted);
  border:1px solid var(--border);
  border-radius:16px 16px 16px 6px;
  padding:13px 14px;
  font-size:clamp(13px, 3.8vw, 14px);
  line-height:1.55;
  margin-bottom:14px;
  overflow-wrap:anywhere;
}

.ig-chat-response{
  display:none;
  margin-top:14px;
  background:rgba(39,52,201,.10);
  border:1px solid rgba(39,52,201,.30);
  color:var(--text);
  border-radius:16px;
  padding:14px;
  font-size:clamp(13px, 3.8vw, 14px);
  line-height:1.55;
  overflow-wrap:anywhere;
}

.ig-chat-response.is-visible{
  display:block;
}

.ig-chat-response a{
  color:var(--blue-light)!important;
  font-weight:900;
  text-decoration:none;
  overflow-wrap:anywhere;
}

.ig-chat-form{
  display:flex;
  gap:10px;
  align-items:flex-end;
  width:100%;
}

.ig-chat-input{
  flex:1 1 auto;
  min-width:0;
  width:100%;
  min-height:48px;
  max-height:min(130px, 28dvh);
  resize:none;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--bg)!important;
  color:var(--text)!important;
  padding:12px 13px;
  font:inherit;
  font-size:16px;
  line-height:1.35;
}

.ig-chat-input::placeholder{
  color:var(--soft);
}

.ig-chat-input:focus{
  outline:none;
  border-color:var(--blue-light);
  box-shadow:0 0 0 3px rgba(39,52,201,.16);
}

.ig-chat-send{
  margin:0!important;
  min-height:48px;
  border-radius:14px!important;
  padding:12px 15px!important;
  flex:0 0 auto;
  white-space:nowrap;
  touch-action:manipulation;
}

html[data-theme="light"] .ig-chat-toggle{
  border-color:rgba(39,52,201,.22);
  box-shadow:0 18px 45px rgba(39,52,201,.22);
}

html[data-theme="light"] .ig-chat-panel{
  box-shadow:0 24px 70px rgba(17,24,39,.16), var(--shadow);
}

html[data-theme="dark"] .ig-chat-response{
  background:rgba(141,152,255,.10);
  border-color:rgba(141,152,255,.22);
}

@media(max-width:640px){
  .ig-chat-widget{
    right:max(12px, env(safe-area-inset-right));
    bottom:max(12px, env(safe-area-inset-bottom));
  }

  .ig-chat-panel{
    width:calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right));
    max-height:calc(100dvh - 92px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    border-radius:20px;
  }
}

@media(max-width:420px){
  .ig-chat-panel{
    position:fixed;
    left:max(10px, env(safe-area-inset-left));
    right:max(10px, env(safe-area-inset-right));
    bottom:calc(clamp(54px, 12vw, 58px) + max(20px, env(safe-area-inset-bottom)));
    width:auto;
    max-height:calc(100dvh - 88px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    border-radius:18px;
  }

  .ig-chat-form{
    gap:8px;
  }

  .ig-chat-send{
    padding-left:12px!important;
    padding-right:12px!important;
  }
}

@media(max-width:340px){
  .ig-chat-form{
    flex-direction:column;
    align-items:stretch;
  }

  .ig-chat-send{
    width:100%;
  }
}

@media(max-height:520px){
  .ig-chat-panel{
    max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    bottom:calc(clamp(54px, 12vw, 62px) + 10px);
  }

  .ig-chat-header{
    padding-top:12px;
    padding-bottom:12px;
  }

  .ig-chat-body{
    padding-top:12px;
    padding-bottom:12px;
  }
}

/* Responsive chat form fixes */
.ig-chat-widget,
.ig-chat-widget *{
  box-sizing:border-box;
}

.ig-chat-body{
  flex:1 1 auto;
}

.ig-chat-form{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:10px;
  align-items:stretch;
  width:100%;
}

.ig-chat-input{
  display:block;
  width:100%!important;
  min-width:0!important;
  height:auto;
  min-height:48px;
  margin:0!important;
  overflow:auto;
}

.ig-chat-send{
  width:auto!important;
  min-width:104px;
  margin:0!important;
  align-self:stretch;
}

@media(max-width:480px){
  .ig-chat-form{
    grid-template-columns:1fr;
  }

  .ig-chat-input,
  .ig-chat-send{
    width:100%!important;
  }

  .ig-chat-send{
    min-width:0;
  }
}

@media(max-width:420px){
  .ig-chat-panel{
    left:max(8px, env(safe-area-inset-left));
    right:max(8px, env(safe-area-inset-right));
  }

  .ig-chat-body{
    padding:12px;
  }
}

/* Telegram floating support button */
.ig-telegram-btn{
  position:fixed;
  right:max(16px, env(safe-area-inset-right));
  bottom:calc(max(16px, env(safe-area-inset-bottom)) + 78px);
  width:clamp(54px, 12vw, 62px);
  height:clamp(54px, 12vw, 62px);
  border-radius:50%;
  background:#229ED9!important;
  color:#ffffff!important;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 18px 45px rgba(34,158,217,.35);
  z-index:1199;
  text-decoration:none!important;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ig-telegram-btn:hover,
.ig-telegram-btn:focus{
  transform:translateY(-2px);
  background:#1c91c9!important;
  color:#ffffff!important;
  box-shadow:0 22px 55px rgba(34,158,217,.45);
  outline:none;
}

.ig-telegram-btn svg{
  width:clamp(26px, 6vw, 31px);
  height:clamp(26px, 6vw, 31px);
  display:block;
}

.ig-telegram-btn-pulse{
  position:absolute;
  inset:-5px;
  border-radius:50%;
  background:rgba(34,158,217,.35);
  animation:igTelegramPulse 1.8s infinite;
  z-index:-1;
}

@keyframes igTelegramPulse{
  0%{
    transform:scale(.9);
    opacity:.9;
  }
  70%{
    transform:scale(1.25);
    opacity:0;
  }
  100%{
    transform:scale(.9);
    opacity:0;
  }
}

@media(max-width:640px){
  .ig-telegram-btn{
    right:max(12px, env(safe-area-inset-right));
    bottom:calc(max(12px, env(safe-area-inset-bottom)) + 70px);
  }
}

/* Footer social media icons */
.footer-social{
  display:flex;
  gap:12px;
  margin-top:18px;
  flex-wrap:wrap;
}

.footer-social a{
  width:42px;
  height:42px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(39,52,201,.12);
  border:1px solid var(--border);
  color:var(--blue-light)!important;
  transition:.25s;
  text-decoration:none!important;
}

.footer-social a:hover,
.footer-social a:focus{
  background:var(--blue)!important;
  border-color:var(--blue)!important;
  color:#ffffff!important;
  transform:translateY(-3px);
  outline:none;
}

html[data-theme="dark"] .footer-social a:hover,
html[data-theme="dark"] .footer-social a:focus{
  background:var(--blue)!important;
  border-color:var(--blue)!important;
  color:#ffffff!important;
}

.footer-social svg{
  width:19px;
  height:19px;
  display:block;
}

@media(max-width:640px){
  .footer-social{
    justify-content:center;
  }
}

/* Keep social icons white on hover */

.footer-social a:hover svg,
.footer-social a:focus svg,
.footer-social a:hover svg path,
.footer-social a:focus svg path{
  color:#ffffff!important;
  fill:#ffffff!important;
}
