
/* PUNCTE IRC TULCEA - FUTURISTIC THEME 2026
   Design-only override. Backend/forms/admin remain unchanged. */

:root{
  --fx-bg:#031019;
  --fx-bg2:#061a27;
  --fx-panel:rgba(8,31,45,.78);
  --fx-panel-strong:rgba(7,27,41,.93);
  --fx-line:rgba(103,231,239,.24);
  --fx-line-hot:rgba(103,231,239,.58);
  --fx-text:#effcff;
  --fx-muted:#a5c3cc;
  --fx-cyan:#67e7ef;
  --fx-cyan2:#39b8e7;
  --fx-blue:#4b82ff;
  --fx-green:#51e5a4;
  --fx-gold:#ffd77d;
  --fx-red:#ff7185;
  --fx-shadow:0 22px 70px rgba(0,4,12,.42);
  --fx-radius:22px;
}

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

body{
  min-height:100vh;
  margin:0!important;
  color:var(--fx-text)!important;
  background:
    radial-gradient(circle at 10% 4%,rgba(43,190,221,.18),transparent 26rem),
    radial-gradient(circle at 90% 14%,rgba(71,113,255,.16),transparent 30rem),
    radial-gradient(circle at 52% 84%,rgba(47,208,174,.10),transparent 34rem),
    linear-gradient(150deg,#020b12 0%,#061824 42%,#03111b 100%)!important;
  background-attachment:fixed!important;
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;
  color-scheme:dark;
  overflow-x:hidden;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.22;
  background-image:
    linear-gradient(rgba(112,231,239,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(112,231,239,.035) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(to bottom,#000,transparent 92%);
}

body::after{
  content:"";
  position:fixed;
  inset:-20%;
  z-index:-3;
  pointer-events:none;
  background:
    conic-gradient(from 120deg at 50% 45%,
      transparent 0 14%,
      rgba(77,219,232,.06) 18%,
      transparent 25% 52%,
      rgba(79,124,255,.055) 58%,
      transparent 68%);
  animation:fxAmbient 28s linear infinite;
}
@keyframes fxAmbient{to{transform:rotate(360deg)}}

a{color:inherit}
::selection{background:rgba(103,231,239,.28);color:#fff}

/* HEADER */
.site-header{
  position:sticky!important;
  top:0;
  z-index:5000!important;
  border-bottom:1px solid var(--fx-line)!important;
  background:rgba(3,16,25,.78)!important;
  box-shadow:0 12px 40px rgba(0,5,12,.28)!important;
  backdrop-filter:blur(22px) saturate(145%);
  -webkit-backdrop-filter:blur(22px) saturate(145%);
}

.site-header .wrap{
  min-height:70px;
}

.brand{
  gap:12px!important;
}
.brand-mark{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(133,245,249,.34)!important;
  background:
    radial-gradient(circle at 30% 24%,rgba(255,255,255,.32),transparent 26%),
    linear-gradient(145deg,#56e5ec,#3a7af0)!important;
  color:#03141e!important;
  box-shadow:
    0 0 0 5px rgba(81,224,232,.07),
    0 0 30px rgba(74,219,231,.26)!important;
}
.brand-mark::after{
  content:"";
  position:absolute;
  inset:-60% -25%;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.6),transparent 65%);
  transform:translateX(-80%) rotate(10deg);
  animation:fxBrandSweep 5.2s ease-in-out infinite;
}
@keyframes fxBrandSweep{
  0%,65%{transform:translateX(-85%) rotate(10deg)}
  83%,100%{transform:translateX(85%) rotate(10deg)}
}
.brand-text strong{color:#fff!important;letter-spacing:-.02em}
.brand-text span{color:#8edfe5!important}

.topnav{
  gap:6px!important;
}
.topnav a{
  border:1px solid rgba(132,226,236,.12)!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.035)!important;
  color:#dff7fa!important;
  font-size:12px!important;
  font-weight:750!important;
  transition:.22s ease!important;
}
.topnav a:hover,
.topnav a:focus-visible{
  transform:translateY(-2px);
  border-color:var(--fx-line-hot)!important;
  background:rgba(80,218,229,.12)!important;
  color:#fff!important;
  box-shadow:0 10px 24px rgba(0,7,16,.25),0 0 18px rgba(87,224,235,.08);
  outline:none;
}

/* MAIN */
main.wrap{
  position:relative;
  z-index:2;
}

/* HERO: same IRC visual, subtle background like the promo image */
.hero{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate;
  min-height:430px;
  border:1px solid rgba(115,235,242,.26)!important;
  border-radius:30px!important;
  background:
    linear-gradient(90deg,rgba(3,16,26,.96) 0%,rgba(3,16,26,.84) 40%,rgba(3,16,26,.42) 69%,rgba(3,16,26,.67) 100%),
    linear-gradient(180deg,rgba(3,16,26,.16),rgba(3,16,26,.62)),
    url("/puncte/assets/puncte-irc-futuristic.webp") center/cover no-repeat!important;
  box-shadow:
    0 32px 90px rgba(0,5,12,.48),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(106,231,239,.03)!important;
}

.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 35%,rgba(70,218,231,.17),transparent 30%),
    linear-gradient(90deg,rgba(3,15,24,.35),transparent 68%);
}

.hero::after{
  content:"";
  position:absolute;
  left:-20%;
  bottom:-140px;
  width:70%;
  height:250px;
  z-index:-1;
  border-radius:50%;
  background:rgba(68,224,232,.13);
  filter:blur(70px);
  pointer-events:none;
}

.hero-grid{
  min-height:430px;
  align-items:center!important;
  gap:28px!important;
}

.eyebrow{
  color:#8cf5f2!important;
  font-weight:900!important;
  letter-spacing:.15em!important;
  text-shadow:0 0 18px rgba(99,235,239,.34);
}
.hero h1{
  max-width:760px;
  margin-bottom:12px!important;
  color:#fff!important;
  font-size:clamp(2.25rem,5.4vw,4.9rem)!important;
  line-height:.96!important;
  letter-spacing:-.06em!important;
  text-shadow:0 10px 40px rgba(0,0,0,.45);
}
.hero .lead{
  max-width:700px;
  color:#bad4db!important;
  font-size:clamp(.98rem,1.7vw,1.18rem)!important;
  line-height:1.65!important;
}
.hero-actions{
  gap:10px!important;
  margin-top:22px!important;
}

.hero-stat-card{
  border:1px solid rgba(110,237,242,.25)!important;
  border-radius:22px!important;
  background:linear-gradient(145deg,rgba(7,30,45,.84),rgba(4,20,31,.79))!important;
  box-shadow:
    0 18px 44px rgba(0,4,10,.32),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 30px rgba(64,222,232,.06)!important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.hero-stat-card .big{
  color:#8ff7f2!important;
  text-shadow:0 0 24px rgba(99,235,239,.24);
}

/* BUTTONS */
.btn,
button,
input[type="submit"]{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(147,244,249,.32)!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#5ae7e9,#3c7ce8)!important;
  color:#03141d!important;
  font-weight:850!important;
  box-shadow:
    0 12px 28px rgba(30,120,188,.22),
    inset 0 1px 0 rgba(255,255,255,.35)!important;
  transition:transform .22s ease,filter .22s ease,box-shadow .22s ease!important;
}
.btn:hover,
button:hover,
input[type="submit"]:hover{
  transform:translateY(-2px)!important;
  filter:brightness(1.08)!important;
  box-shadow:
    0 17px 35px rgba(25,119,190,.3),
    0 0 24px rgba(89,227,235,.14),
    inset 0 1px 0 rgba(255,255,255,.4)!important;
}
.btn.secondary,
button.secondary{
  background:rgba(10,42,58,.78)!important;
  color:#dffbfc!important;
  border-color:rgba(102,231,239,.3)!important;
}
button.danger,.danger{
  background:linear-gradient(135deg,#ff7d8d,#c93e61)!important;
  color:#fff!important;
}
button.ok,.ok{
  background:linear-gradient(135deg,#60e7ab,#29ad7a)!important;
  color:#052019!important;
}

/* SECTIONS */
.section{
  position:relative;
  margin-top:24px!important;
  scroll-margin-top:92px;
}
.section-head{
  margin-bottom:12px!important;
}
.section-head h2{
  color:#f7ffff!important;
  font-size:clamp(1.35rem,2.5vw,2rem)!important;
  letter-spacing:-.035em!important;
}
.section-head p{
  color:var(--fx-muted)!important;
}

/* CARDS */
.card{
  position:relative;
  overflow:hidden;
  border:1px solid var(--fx-line)!important;
  border-radius:var(--fx-radius)!important;
  background:
    linear-gradient(145deg,rgba(10,39,55,.78),rgba(5,24,37,.72))!important;
  color:var(--fx-text)!important;
  box-shadow:
    0 18px 52px rgba(0,4,11,.28),
    inset 0 1px 0 rgba(255,255,255,.045)!important;
  backdrop-filter:blur(18px) saturate(125%);
  -webkit-backdrop-filter:blur(18px) saturate(125%);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease!important;
}
.card::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  top:-120px;
  right:-100px;
  border-radius:50%;
  background:rgba(75,222,234,.09);
  filter:blur(25px);
  pointer-events:none;
}
.card:hover{
  transform:translateY(-2px);
  border-color:rgba(102,234,241,.38)!important;
  box-shadow:
    0 23px 62px rgba(0,4,11,.34),
    0 0 28px rgba(68,218,229,.055),
    inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.card.flat{
  background:linear-gradient(145deg,rgba(10,38,54,.64),rgba(5,23,35,.58))!important;
}
.card-accent{
  border-color:rgba(103,231,239,.42)!important;
  box-shadow:0 18px 60px rgba(0,6,15,.34),0 0 34px rgba(86,224,234,.07)!important;
}
.card h3{color:#fff!important}
.card p,.muted{color:var(--fx-muted)!important}

/* SERVICE CARDS */
.service-card{
  min-height:100%;
}
.service-badge,
.pill{
  border:1px solid rgba(103,231,239,.24)!important;
  border-radius:999px!important;
  background:rgba(68,218,229,.09)!important;
  color:#8ff5f3!important;
  font-weight:800!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.service-card:nth-child(2) .service-badge{
  border-color:rgba(103,143,255,.26)!important;
  background:rgba(77,111,255,.09)!important;
  color:#a8c3ff!important;
}
.service-card:nth-child(3) .service-badge{
  border-color:rgba(81,229,164,.27)!important;
  background:rgba(81,229,164,.085)!important;
  color:#9cf3c8!important;
}

/* STEPS / TUTORIAL */
.step-num{
  display:grid!important;
  place-items:center!important;
  min-width:38px!important;
  height:38px!important;
  border:1px solid rgba(133,244,247,.4)!important;
  border-radius:12px!important;
  background:linear-gradient(145deg,rgba(87,229,235,.2),rgba(66,121,235,.18))!important;
  color:#bffeff!important;
  font-weight:900!important;
  box-shadow:0 0 18px rgba(83,224,233,.10),inset 0 1px 0 rgba(255,255,255,.08);
}
.tutorial-code,code{
  border:1px solid rgba(103,231,239,.17)!important;
  border-radius:9px!important;
  background:rgba(0,10,17,.64)!important;
  color:#a9f8f3!important;
  font-family:"Cascadia Code","Consolas",monospace!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}

/* CALLOUTS */
.callout,
.notice,
.security-note{
  border:1px solid rgba(103,231,239,.21)!important;
  border-radius:14px!important;
  background:rgba(6,30,43,.66)!important;
  color:#dff7f9!important;
}
.callout.info{
  border-color:rgba(81,192,235,.28)!important;
  background:rgba(35,117,160,.10)!important;
}
.security-note{
  border-color:rgba(81,229,164,.27)!important;
  background:rgba(31,134,96,.09)!important;
}

/* FORMS */
.field span,label{
  color:#cce8ec!important;
}
input,
select,
textarea{
  border:1px solid rgba(117,217,230,.20)!important;
  border-radius:11px!important;
  outline:none!important;
  background:rgba(0,12,20,.58)!important;
  color:#f0feff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease!important;
}
input::placeholder,
textarea::placeholder{color:#668b98!important}
input:focus,
select:focus,
textarea:focus{
  border-color:rgba(99,235,239,.60)!important;
  background:rgba(0,14,23,.78)!important;
  box-shadow:0 0 0 4px rgba(84,224,232,.09)!important;
}

/* METRICS */
.metric{
  isolation:isolate;
}
.metric::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:3px;
  background:linear-gradient(90deg,var(--fx-cyan),var(--fx-blue),transparent 88%);
}
.metric-value{
  color:#92fbf5!important;
  font-size:clamp(1.8rem,4vw,3rem)!important;
  text-shadow:0 0 24px rgba(100,240,239,.18);
}
.metric-label{
  color:#eaffff!important;
  font-weight:800!important;
}
.metric-sub{
  color:var(--fx-muted)!important;
}

/* TABLES */
table{
  border-collapse:separate!important;
  border-spacing:0!important;
  color:#e8fafd!important;
}
thead th{
  border-bottom:1px solid rgba(112,230,239,.19)!important;
  background:rgba(4,22,34,.82)!important;
  color:#8feef1!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.06em;
  text-transform:uppercase;
}
tbody td{
  border-bottom:1px solid rgba(112,230,239,.075)!important;
  background:rgba(7,28,41,.42)!important;
  color:#d9eef2!important;
}
tbody tr:hover td{
  background:rgba(54,157,180,.09)!important;
}

/* ACCOUNT BAR */
.account-bar{
  border-color:rgba(91,226,234,.38)!important;
  background:
    radial-gradient(circle at 88% 50%,rgba(76,130,255,.15),transparent 30%),
    linear-gradient(145deg,rgba(10,44,60,.88),rgba(5,25,38,.80))!important;
}

/* FLASH */
.flash{
  border:1px solid rgba(81,229,164,.32)!important;
  border-radius:13px!important;
  background:rgba(41,163,116,.12)!important;
  color:#bff5d9!important;
  box-shadow:0 12px 30px rgba(0,5,12,.18);
}
.flash.bad{
  border-color:rgba(255,113,133,.32)!important;
  background:rgba(175,54,75,.12)!important;
  color:#ffc2cb!important;
}

/* ADMIN */
#administrare{
  padding:18px;
  border:1px solid rgba(255,215,125,.17);
  border-radius:26px;
  background:
    radial-gradient(circle at 88% 10%,rgba(255,205,110,.07),transparent 24rem),
    rgba(3,16,25,.26);
}
#administrare .section-head h2{
  color:#ffe6ad!important;
}
#administrare .pill{
  border-color:rgba(255,215,125,.27)!important;
  background:rgba(255,215,125,.08)!important;
  color:#ffe1a0!important;
}

/* FOOTER */
.footer{
  border-top:1px solid rgba(103,231,239,.16)!important;
  background:transparent!important;
  color:#779aa6!important;
}
.footer strong{color:#ccecef!important}

/* SCROLLBAR */
*{
  scrollbar-width:thin;
  scrollbar-color:#286a78 #06151f;
}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:#06151f}
*::-webkit-scrollbar-thumb{
  border:2px solid #06151f;
  border-radius:999px;
  background:linear-gradient(#2a7a88,#225069);
}

/* RESPONSIVE */
@media(max-width:900px){
  .site-header{position:relative!important}
  .hero{
    min-height:0;
    border-radius:22px!important;
    background:
      linear-gradient(180deg,rgba(3,16,26,.82),rgba(3,16,26,.94)),
      url("/puncte/assets/puncte-irc-futuristic.webp") center/cover no-repeat!important;
  }
  .hero-grid{min-height:0}
  .hero h1{font-size:clamp(2.1rem,10vw,3.6rem)!important}
  #administrare{padding:12px}
}

@media(max-width:620px){
  body::before{background-size:32px 32px}
  .hero{border-radius:18px!important}
  .hero h1{letter-spacing:-.045em!important}
  .card{border-radius:17px!important}
  .topnav a{font-size:11px!important}
  table{font-size:12px!important}
}

@media(prefers-reduced-motion:reduce){
  body::after,.brand-mark::after{animation:none!important}
  *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important}
}

/* FIX BRAND TEXT - contrast */
.site-header .brand,
.site-header .brand a,
.site-header .brand-text,
.site-header .brand-text strong,
.site-header .brand strong {
    color:#ffffff !important;
}

.site-header .brand-text strong,
.site-header .brand strong {
    color:#f4feff !important;
    text-shadow:
        0 0 10px rgba(103,231,239,.28),
        0 2px 8px rgba(0,0,0,.65) !important;
}

.site-header .brand-text span,
.site-header .brand span {
    color:#b9dfe6 !important;
    text-shadow:0 1px 6px rgba(0,0,0,.65) !important;
}

/* FIX INFO BOXES - IDENTITATE / AUTOMAT / SIGURANTA */
.info-strip .info-box{
    border:1px solid rgba(103,231,239,.25) !important;
    background:
        linear-gradient(145deg,rgba(10,39,55,.92),rgba(5,24,37,.88)) !important;
    box-shadow:
        0 16px 42px rgba(0,5,12,.30),
        inset 0 1px 0 rgba(255,255,255,.05) !important;
    color:#ffffff !important;
}

.info-strip .info-box .kicker{
    color:#8ff5f3 !important;
    font-weight:900 !important;
    text-shadow:0 0 12px rgba(103,231,239,.20);
}

.info-strip .info-box strong{
    color:#ffffff !important;
    font-weight:850 !important;
    text-shadow:0 2px 8px rgba(0,0,0,.45);
}

.info-strip .info-box .muted,
.info-strip .info-box span.muted{
    color:#b8d5dc !important;
}

.info-strip .info-box:hover{
    border-color:rgba(103,231,239,.52) !important;
    box-shadow:
        0 20px 50px rgba(0,5,12,.36),
        0 0 24px rgba(65,220,231,.08),
        inset 0 1px 0 rgba(255,255,255,.07) !important;
}

/* HOME BUTTON - MOBILE */
@media(max-width:700px){

    .topnav .home-link{
        display:inline-flex !important;
        position:fixed !important;
        left:12px !important;
        bottom:14px !important;
        z-index:99999 !important;

        align-items:center !important;
        justify-content:center !important;
        min-width:96px !important;
        min-height:44px !important;
        padding:10px 15px !important;

        border:1px solid rgba(120,240,245,.55) !important;
        border-radius:14px !important;

        background:linear-gradient(
            135deg,
            rgba(75,225,232,.96),
            rgba(57,118,225,.96)
        ) !important;

        color:#03141d !important;
        font-size:13px !important;
        font-weight:900 !important;
        text-decoration:none !important;

        box-shadow:
            0 14px 35px rgba(0,5,12,.45),
            0 0 22px rgba(77,225,235,.20) !important;
    }

}

/* BUTON ACASA MOBIL - INDEPENDENT DE MENIU */
#mobile-home-fixed{
    display:none !important;
}

@media(max-width:700px){

    #mobile-home-fixed{
        position:fixed !important;
        display:flex !important;

        left:12px !important;
        bottom:max(12px, env(safe-area-inset-bottom)) !important;

        z-index:2147483000 !important;

        align-items:center !important;
        justify-content:center !important;
        gap:7px !important;

        min-width:100px !important;
        min-height:46px !important;
        padding:10px 16px !important;

        border:1px solid rgba(170,250,255,.75) !important;
        border-radius:14px !important;

        background:linear-gradient(
            135deg,
            #63edf0,
            #3d83ed
        ) !important;

        color:#03141d !important;
        font:900 13px/1 "Segoe UI",Arial,sans-serif !important;
        text-decoration:none !important;

        box-shadow:
            0 14px 36px rgba(0,0,0,.55),
            0 0 24px rgba(89,231,239,.28) !important;

        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
    }

    #mobile-home-fixed span{
        font-size:20px !important;
        line-height:1 !important;
    }
}

/* =========================================================
   FIX MAGAZIN - TEXT LIZIBIL PE CARDURILE ALBE
   ========================================================= */

.product{
    color:#18324a !important;
}

.product h3{
    color:#123557 !important;
    font-weight:900 !important;
    text-shadow:none !important;
}

.product p{
    color:#405875 !important;
}

.product .price{
    color:#173f9b !important;
    font-weight:900 !important;
}

.product .service-badge{
    color:#087f8c !important;
    background:#e5fbfd !important;
    border-color:#87dde3 !important;
    font-weight:900 !important;
}

.product .required-note{
    color:#294762 !important;
    background:#edf4f8 !important;
    border:1px solid #cbdbe5 !important;
}

.product .required-note strong{
    color:#102f4a !important;
}

.product .field span,
.product label span{
    color:#28536c !important;
    font-weight:800 !important;
}

.product input{
    background:#ffffff !important;
    color:#102b40 !important;
    border:2px solid #9ab3c3 !important;
    opacity:1 !important;
}

.product input::placeholder{
    color:#607d8c !important;
    opacity:1 !important;
}

.product input:focus{
    border-color:#2a9fc0 !important;
    box-shadow:0 0 0 3px rgba(42,159,192,.14) !important;
}

.product button,
.product button.block{
    color:#051927 !important;
    font-weight:900 !important;
}


/* CONT AUTENTIFICAT - DREAPTA SUS */
.top-account{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    margin-left:2px !important;
}

.top-account-name{
    display:inline-flex !important;
    align-items:center !important;
    min-height:42px !important;
    padding:0 15px !important;

    border:1px solid rgba(103,231,239,.30) !important;
    border-radius:14px !important;
    background:rgba(8,34,50,.88) !important;

    color:#ffffff !important;
    font-weight:900 !important;
    white-space:nowrap !important;
}

.top-account-logout{
    margin:0 !important;
    padding:0 !important;
}

.top-account-logout button{
    min-height:42px !important;
    padding:0 14px !important;

    border:1px solid rgba(103,231,239,.32) !important;
    border-radius:14px !important;
    background:rgba(12,45,60,.92) !important;

    color:#dffcff !important;
    font-weight:850 !important;
    cursor:pointer !important;
}

.top-account-logout button:hover{
    border-color:rgba(103,231,239,.70) !important;
    background:rgba(18,63,80,.98) !important;
}

/* MOBIL */
@media(max-width:700px){
    .top-account{
        width:100% !important;
        justify-content:flex-end !important;
        margin-top:6px !important;
    }

    .top-account-name,
    .top-account-logout button{
        min-height:38px !important;
        padding:0 11px !important;
        font-size:12px !important;
    }
}

/* =========================================================
   FIX FINAL MAGAZIN + CONT SUS
   ========================================================= */

/* ascunde cardul mare Salut... */
.account-section{
    display:none !important;
}

/* fallback */
section.section:has(.account-bar){
    display:none !important;
}

/* CONT SUS DREAPTA */
.top-account{
    display:flex !important;
    align-items:center !important;
    gap:7px !important;
    margin-left:0 !important;
}

.top-account-name{
    display:flex !important;
    align-items:center !important;
    height:46px !important;
    padding:0 14px !important;
    border-radius:15px !important;
    border:1px solid rgba(103,231,239,.30) !important;
    background:#10293a !important;
    color:#ffffff !important;
    font-weight:900 !important;
    white-space:nowrap !important;
}

.top-account-logout{
    margin:0 !important;
    padding:0 !important;
    display:block !important;
}

.top-account-logout button{
    width:auto !important;
    height:46px !important;
    min-height:46px !important;
    padding:0 15px !important;
    margin:0 !important;
    border-radius:15px !important;
    border:1px solid rgba(103,231,239,.38) !important;
    background:#163b4d !important;
    color:#ffffff !important;
    font-weight:900 !important;
    cursor:pointer !important;
}

.top-account-logout button:hover{
    background:#20546a !important;
}

/* MAGAZIN - CONTRAST FORTAT */
main .product{
    color:#223b55 !important;
}

main .product h3{
    color:#173a62 !important;
    text-shadow:none !important;
    opacity:1 !important;
}

main .product p{
    color:#405673 !important;
    opacity:1 !important;
}

main .product .price{
    color:#173f9b !important;
    opacity:1 !important;
}

main .product .service-badge{
    color:#087f8c !important;
    background:#e9fcfd !important;
    border-color:#8bdde3 !important;
    opacity:1 !important;
}

main .product .required-note{
    color:#294762 !important;
    background:#edf4f8 !important;
    border-color:#cbdbe5 !important;
    opacity:1 !important;
}

main .product .required-note strong{
    color:#18364f !important;
}

main .product .field span,
main .product label span{
    color:#2a5870 !important;
    opacity:1 !important;
}

main .product input{
    color:#102b40 !important;
    background:#ffffff !important;
    border-color:#9ab3c3 !important;
    opacity:1 !important;
}

main .product input::placeholder{
    color:#607d8c !important;
    opacity:1 !important;
}

/* TELEFON */
@media(max-width:700px){
    .top-account{
        gap:5px !important;
    }

    .top-account-name{
        height:40px !important;
        padding:0 10px !important;
        font-size:12px !important;
    }

    .top-account-logout button{
        height:40px !important;
        min-height:40px !important;
        padding:0 10px !important;
        font-size:12px !important;
    }
}

