/* ======================================
   SOURCE: /assets/3e-home-solutions-v2.css?v=20260724
   ====================================== */
/* 3E ana sayfa — dört yazılım çözümü */
body.page-home .three-home-solutions{
  overflow:hidden;
  padding:96px 0 110px;
  background:#07152d;
  color:#fff;
}

body.page-home .three-home-solutions,
body.page-home .three-home-solutions *{
  box-sizing:border-box;
  text-shadow:none!important;
}

body.page-home .three-home-solutions-inner{
  width:min(1540px,calc(100% - 32px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(370px,.65fr);
  gap:68px;
  align-items:center;
}

body.page-home .three-home-solutions-visual{
  min-width:0;
  padding:12px 0 70px;
}

body.page-home .three-home-workstation{
  position:relative;
  width:100%;
  margin:0;
}

body.page-home .three-home-workstation-frame{
  position:relative;
  padding:10px 10px 34px;
  border:1px solid #8d959d;
  border-radius:12px;
  background:#c6cbd0;
  box-shadow:0 18px 34px rgba(0,0,0,.28);
}

body.page-home .three-home-workstation-camera{
  position:absolute;
  top:4px;
  left:50%;
  z-index:8;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#252a30;
  transform:translateX(-50%);
}

body.page-home .three-home-workstation-screen{
  position:relative;
  overflow:hidden;
  aspect-ratio:16/9;
  border:3px solid #0b0e12;
  border-radius:5px 5px 2px 2px;
  background:#eef2f6;
}

body.page-home .three-home-workstation-stand{
  position:absolute;
  left:50%;
  bottom:-62px;
  z-index:0;
  width:48%;
  height:64px;
  transform:translateX(-50%);
  background:
    linear-gradient(180deg,#9ea5ab,#d3d7da) center bottom/100% 9px no-repeat,
    linear-gradient(102deg,transparent 19%,#d0d4d7 20%,#a8afb5 80%,transparent 81%) center top/56% 57px no-repeat;
  filter:drop-shadow(0 7px 5px rgba(0,0,0,.24));
}

body.page-home .three-home-solution-panel{
  position:absolute;
  inset:0;
  overflow:hidden;
  background:#eef2f6;
}

body.page-home .three-home-solution-panel.is-active{
  display:block;
}

body.page-home .three-home-solution-panel[hidden]{
  display:none!important;
}

body.page-home .three-home-solution-panel>img{
  display:block;
  width:100%;
  height:100%;
  margin:0;
  object-fit:cover;
  object-position:left top;
}

body.page-home .three-home-restaurant-phone{
  position:absolute;
  right:3.2%;
  bottom:3.5%;
  width:23%;
  min-height:73%;
  padding:5% 2.2% 2.4%;
  border:5px solid #111820;
  border-radius:18px;
  background:#f8f4ee;
  color:#182033;
  box-shadow:0 12px 22px rgba(0,0,0,.25);
  font-size:clamp(5px,.62vw,9px);
}

body.page-home .three-home-restaurant-phone::before{
  content:"";
  position:absolute;
  top:6px;
  left:50%;
  width:34%;
  height:5px;
  border-radius:4px;
  background:#111820;
  transform:translateX(-50%);
}

body.page-home .three-home-restaurant-phone-top,
body.page-home .three-home-restaurant-phone>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:5px;
}

body.page-home .three-home-restaurant-phone-top{
  margin-bottom:8%;
  color:#7b2030;
}

body.page-home .three-home-restaurant-phone>strong{
  display:block;
  margin-bottom:7%;
  font-size:1.45em;
}

body.page-home .three-home-restaurant-phone>div:not(.three-home-restaurant-phone-top){
  padding:8% 0;
  border-bottom:1px solid #ded8d0;
}

body.page-home .three-home-restaurant-phone button{
  width:100%;
  min-height:25px;
  margin-top:9%;
  border:0;
  border-radius:4px;
  background:#7b2030;
  color:#fff;
  font:800 1em/1 Manrope,Arial,sans-serif;
}

body.page-home .three-home-retail-app{
  height:100%;
  display:grid;
  grid-template-rows:9% 91%;
  background:#e9eef3;
  color:#122039;
  font-family:Manrope,Arial,sans-serif;
}

body.page-home .three-home-retail-app>header{
  padding:0 2%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #cfd8e2;
  background:#fff;
  font-size:clamp(6px,.7vw,11px);
}

body.page-home .three-home-retail-app>header span{
  display:flex;
  align-items:center;
  gap:5px;
  color:#647083;
  font-size:.78em;
  font-weight:700;
}

body.page-home .three-home-retail-app>header i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#159861;
}

body.page-home .three-home-retail-body{
  min-height:0;
  display:grid;
  grid-template-columns:17% minmax(0,1fr) 29%;
}

body.page-home .three-home-retail-body>nav{
  padding:14% 10%;
  display:grid;
  align-content:start;
  gap:5%;
  border-right:1px solid #d2dae4;
  background:#102039;
  color:#b8c5d6;
  font-size:clamp(5px,.63vw,10px);
}

body.page-home .three-home-retail-body>nav b{
  margin-bottom:8%;
  color:#fff;
}

body.page-home .three-home-retail-body>nav span{
  padding:8% 10%;
  border-left:3px solid transparent;
}

body.page-home .three-home-retail-body>nav .is-current{
  border-left-color:#ef9b13;
  background:#1c3558;
  color:#fff;
}

body.page-home .three-home-retail-body>main{
  min-width:0;
  padding:2.5%;
}

body.page-home .three-home-retail-search{
  min-height:8%;
  padding:2% 2.5%;
  border:1px solid #ccd6e1;
  border-radius:3px;
  background:#fff;
  color:#8a95a4;
  font-size:clamp(5px,.6vw,9px);
}

body.page-home .three-home-retail-products{
  margin-top:2.5%;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2.5%;
}

body.page-home .three-home-retail-products article{
  min-width:0;
  padding:3%;
  border:1px solid #cfd8e2;
  background:#fff;
}

body.page-home .three-home-retail-products img{
  display:block;
  width:100%;
  aspect-ratio:16/8;
  margin:0 0 4%;
  object-fit:cover;
}

body.page-home .three-home-retail-products b,
body.page-home .three-home-retail-products span{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.page-home .three-home-retail-products b{
  font-size:clamp(5px,.58vw,9px);
}

body.page-home .three-home-retail-products span{
  margin-top:2%;
  color:#9c263b;
  font-size:clamp(5px,.55vw,8px);
  font-weight:800;
}

body.page-home .three-home-retail-body>aside{
  padding:7% 6%;
  border-left:1px solid #cfd8e2;
  background:#fff;
  color:#28374b;
  font-size:clamp(5px,.58vw,9px);
}

body.page-home .three-home-retail-sale-head,
body.page-home .three-home-retail-line,
body.page-home .three-home-retail-body dl div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:5px;
}

body.page-home .three-home-retail-sale-head{
  padding-bottom:7%;
  border-bottom:1px solid #e0e6ed;
}

body.page-home .three-home-retail-sale-head span{
  color:#7b8797;
  font-size:.8em;
}

body.page-home .three-home-retail-line{
  padding:7% 0;
  border-bottom:1px solid #e5eaf0;
}

body.page-home .three-home-retail-body dl{
  margin:8% 0;
}

body.page-home .three-home-retail-body dl div{
  margin:5% 0;
}

body.page-home .three-home-retail-body dt{
  color:#778396;
}

body.page-home .three-home-retail-body dd{
  margin:0;
  font-weight:750;
}

body.page-home .three-home-retail-total{
  padding-top:7%;
  border-top:1px solid #d5dde6;
  color:#102039;
  font-size:1.25em;
  font-weight:850;
}

body.page-home .three-home-retail-body>aside>button{
  width:100%;
  min-height:11%;
  border:0;
  border-radius:3px;
  background:#9c263b;
  color:#fff;
  font:800 1em/1 Manrope,Arial,sans-serif;
}

body.page-home .three-home-custom-app{
  height:100%;
  display:grid;
  grid-template-rows:9% 91%;
  background:#111a29;
  color:#dce5f2;
  font-family:Manrope,Arial,sans-serif;
}

body.page-home .three-home-custom-app>header{
  padding:0 2%;
  display:flex;
  align-items:center;
  gap:1%;
  border-bottom:1px solid #2d394b;
  background:#182438;
  font-size:clamp(5px,.58vw,9px);
}

body.page-home .three-home-custom-app>header>span{
  display:flex;
  gap:4px;
}

body.page-home .three-home-custom-app>header>span i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#68768a;
}

body.page-home .three-home-custom-app>header b{
  padding:2% 2.5%;
  border-inline:1px solid #2d394b;
  background:#111a29;
}

body.page-home .three-home-custom-app>header em{
  margin-left:auto;
  color:#91a0b5;
  font-style:normal;
}

body.page-home .three-home-custom-body{
  min-height:0;
  display:grid;
  grid-template-columns:58% 42%;
}

body.page-home .three-home-custom-code{
  padding:4% 0;
  overflow:hidden;
  border-right:1px solid #2b384b;
  font:500 clamp(5px,.66vw,10px)/1.72 ui-monospace,SFMono-Regular,Consolas,monospace;
}

body.page-home .three-home-custom-code>div{
  display:grid;
  grid-template-columns:7% minmax(0,1fr);
}

body.page-home .three-home-custom-code>div>span{
  padding-right:25%;
  border-right:1px solid #273448;
  color:#5f6e84;
  text-align:right;
}

body.page-home .three-home-custom-code code{
  padding-left:4%;
  overflow:hidden;
  color:#dce5f2;
  font:inherit;
  white-space:nowrap;
}

body.page-home .three-home-custom-code code b{
  color:#78aaff;
  font-weight:650;
}

body.page-home .three-home-custom-code code i{
  color:#d6b5ff;
  font-style:normal;
}

body.page-home .three-home-custom-code code em{
  color:#8ed7a8;
  font-style:normal;
}

body.page-home .three-home-custom-operations{
  padding:4%;
  background:#eef2f6;
  color:#1c2b42;
}

body.page-home .three-home-custom-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  font-size:clamp(5px,.58vw,9px);
}

body.page-home .three-home-custom-title span b,
body.page-home .three-home-custom-title span small{
  display:block;
}

body.page-home .three-home-custom-title span small{
  margin-top:2px;
  color:#7b8797;
  font-size:.76em;
}

body.page-home .three-home-custom-title>em{
  display:flex;
  align-items:center;
  gap:4px;
  color:#08784b;
  font-size:.78em;
  font-style:normal;
  font-weight:800;
}

body.page-home .three-home-custom-title>em i{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#159861;
}

body.page-home .three-home-custom-metrics{
  margin-top:6%;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2%;
}

body.page-home .three-home-custom-metrics article{
  padding:8%;
  border:1px solid #d4dde7;
  background:#fff;
}

body.page-home .three-home-custom-metrics small,
body.page-home .three-home-custom-metrics b{
  display:block;
}

body.page-home .three-home-custom-metrics small{
  overflow:hidden;
  color:#788497;
  font-size:clamp(4px,.45vw,7px);
  white-space:nowrap;
}

body.page-home .three-home-custom-metrics b{
  margin-top:7%;
  font-size:clamp(7px,.88vw,14px);
}

body.page-home .three-home-custom-list{
  margin-top:5%;
  border:1px solid #d4dde7;
  background:#fff;
}

body.page-home .three-home-custom-list>div{
  min-height:23%;
  padding:4%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:5px;
  border-bottom:1px solid #e2e7ed;
  font-size:clamp(4px,.48vw,8px);
}

body.page-home .three-home-custom-list>div:last-child{
  border-bottom:0;
}

body.page-home .three-home-custom-list span b,
body.page-home .three-home-custom-list span small{
  display:block;
}

body.page-home .three-home-custom-list span small{
  margin-top:3px;
  color:#7a8697;
  font-size:.76em;
}

body.page-home .three-home-custom-list>div>em{
  padding:3px 4px;
  border:1px solid #b9d1ff;
  border-radius:7px;
  background:#eef4ff;
  color:#155eef;
  font-size:.72em;
  font-style:normal;
  font-weight:800;
}

body.page-home .three-home-custom-mobile{
  margin-top:5%;
  padding:4%;
  display:grid;
  gap:5px;
  border:1px solid #d4dde7;
  background:#fff;
  font-size:clamp(4px,.46vw,7px);
}

body.page-home .three-home-custom-mobile>span{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:5px;
  color:#435168;
}

body.page-home .three-home-custom-mobile>span i{
  color:#155eef;
  font-style:normal;
  font-weight:800;
}

body.page-home .three-home-custom-mobile>span em{
  color:#08784b;
  font-style:normal;
  font-weight:800;
}

body.page-home .three-home-solutions-copy{
  min-width:0;
}

body.page-home .three-home-solutions-copy h2{
  max-width:590px;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(34px,3.3vw,50px)!important;
  font-weight:800!important;
  line-height:1.08!important;
  letter-spacing:-.045em!important;
}

body.page-home .three-home-solutions-copy>p{
  max-width:580px;
  margin:20px 0 0!important;
  color:#b8c5d6!important;
  font-size:15px!important;
  line-height:1.7!important;
}

body.page-home .three-home-solution-tabs{
  margin-top:29px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid rgba(255,255,255,.23);
  border-left:1px solid rgba(255,255,255,.23);
}

body.page-home .three-home-solution-tabs button{
  min-height:49px;
  padding:9px 13px;
  border:0;
  border-right:1px solid rgba(255,255,255,.23);
  border-bottom:1px solid rgba(255,255,255,.23);
  border-radius:0;
  background:transparent;
  color:#d8e2ef;
  font:800 12px/1.25 Manrope,Arial,sans-serif;
  text-align:left;
  cursor:pointer;
}

body.page-home .three-home-solution-tabs button:hover,
body.page-home .three-home-solution-tabs button:focus-visible{
  background:#102440;
  color:#fff;
}

body.page-home .three-home-solution-tabs button[aria-selected="true"]{
  background:#fff;
  color:#07152d;
}

body.page-home .three-home-solution-details{
  min-height:190px;
  margin-top:28px;
}

body.page-home .three-home-solution-details article[hidden]{
  display:none!important;
}

body.page-home .three-home-solution-details h3{
  margin:0!important;
  color:#fff!important;
  font-size:21px!important;
  font-weight:800!important;
  letter-spacing:-.02em!important;
}

body.page-home .three-home-solution-details p{
  margin:12px 0 0!important;
  color:#b7c5d7!important;
  font-size:13px!important;
  line-height:1.7!important;
}

body.page-home .three-home-solution-details a{
  min-height:44px;
  margin-top:20px;
  padding:0 15px;
  display:inline-flex;
  align-items:center;
  border:1px solid #fff;
  border-radius:4px;
  background:#fff;
  color:#07152d;
  font-size:12px;
  font-weight:850;
  text-decoration:none;
}

body.page-home .three-home-solutions.is-motion-ready .three-home-solutions-visual,
body.page-home .three-home-solutions.is-motion-ready .three-home-solutions-copy{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .55s ease,transform .55s ease;
}

body.page-home .three-home-solutions.is-motion-ready .three-home-solutions-copy{
  transition-delay:80ms;
}

body.page-home .three-home-solutions.is-motion-ready.is-visible .three-home-solutions-visual,
body.page-home .three-home-solutions.is-motion-ready.is-visible .three-home-solutions-copy{
  opacity:1;
  transform:none;
}

@media(max-width:1180px){
  body.page-home .three-home-solutions-inner{
    grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);
    gap:42px;
  }
}

@media(max-width:960px){
  body.page-home .three-home-solutions-inner{
    width:min(900px,calc(100% - 32px));
    grid-template-columns:1fr;
    gap:46px;
  }

  body.page-home .three-home-solutions-copy{
    grid-row:1;
  }

  body.page-home .three-home-solutions-visual{
    grid-row:2;
  }

  body.page-home .three-home-solution-details{
    min-height:0;
  }
}

@media(max-width:620px){
  body.page-home .three-home-solutions{
    padding:72px 0 84px;
  }

  body.page-home .three-home-solutions-inner{
    width:calc(100% - 24px);
  }

  body.page-home .three-home-solutions-copy h2{
    font-size:34px!important;
  }

  body.page-home .three-home-solution-tabs{
    grid-template-columns:1fr;
  }

  body.page-home .three-home-solutions-visual{
    padding-bottom:36px;
  }

  body.page-home .three-home-workstation-frame{
    padding:5px 5px 18px;
    border-radius:8px;
  }

  body.page-home .three-home-workstation-camera{
    top:2px;
    width:3px;
    height:3px;
  }

  body.page-home .three-home-workstation-screen{
    border-width:2px;
  }

  body.page-home .three-home-workstation-stand{
    bottom:-34px;
    height:36px;
  }

  body.page-home .three-home-restaurant-phone{
    border-width:3px;
    border-radius:10px;
  }

  body.page-home .three-home-retail-body{
    grid-template-columns:minmax(0,1fr) 34%;
  }

  body.page-home .three-home-retail-body>nav{
    display:none;
  }

  body.page-home .three-home-retail-products article:nth-child(n+3){
    display:none;
  }

  body.page-home .three-home-custom-app{
    grid-template-rows:12% 88%;
  }

  body.page-home .three-home-custom-body{
    grid-template-columns:55% 45%;
  }

  body.page-home .three-home-custom-code{
    font-size:4px;
    line-height:1.55;
  }

  body.page-home .three-home-custom-mobile{
    display:none;
  }
}

@media(prefers-reduced-motion:reduce){
  body.page-home .three-home-solutions.is-motion-ready .three-home-solutions-visual,
  body.page-home .three-home-solutions.is-motion-ready .three-home-solutions-copy{
    opacity:1;
    transform:none;
    transition:none;
  }
}


/* ======================================
   SOURCE: /assets/3e-home-solutions-v3.css?v=20260725
   ====================================== */
/* 3E ana sayfa — dört ekranı aynı anda göster */
body.page-home .three-home-workstation-screen{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  aspect-ratio:auto!important;
  min-height:520px;
  padding:8px;
  overflow:visible!important;
  background:#e9eef3!important;
}
body.page-home .three-home-solution-panel,
body.page-home .three-home-solution-panel[hidden]{
  position:relative!important;
  inset:auto!important;
  display:block!important;
  min-height:250px;
  overflow:hidden!important;
  border:1px solid #c9d3df;
  border-radius:6px;
  background:#f8fafc!important;
}
body.page-home .three-home-solution-panel>img{
  height:100%!important;
  object-fit:cover!important;
  object-position:left top!important;
}
body.page-home .three-home-solution-panel-label{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  z-index:5;
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:8px 10px;
  border:1px solid #ccd6e1;
  border-radius:4px;
  background:rgba(255,255,255,.96);
  color:#07152d;
  box-shadow:none;
  pointer-events:none;
}
body.page-home .three-home-solution-panel-label b{font:800 12px/1.2 Manrope,Arial,sans-serif}
body.page-home .three-home-solution-panel-label span{font:600 10px/1.3 Manrope,Arial,sans-serif;color:#526277}
body.page-home .three-home-all-links{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:28px;
}
body.page-home .three-home-all-links a{
  display:flex;
  flex-direction:column;
  gap:5px;
  min-height:78px;
  padding:12px 13px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:4px;
  background:#0d2341;
  color:#fff;
  text-decoration:none;
}
body.page-home .three-home-all-links a:hover{background:#17375e;border-color:#fff}
body.page-home .three-home-all-links b{font:800 12px/1.2 Manrope,Arial,sans-serif}
body.page-home .three-home-all-links span{font:600 10px/1.35 Manrope,Arial,sans-serif;color:#c4d1e1}
body.page-home .three-home-solutions-copy>p{color:#d5dfeb!important}
@media(max-width:960px){body.page-home .three-home-workstation-screen{min-height:500px}}
@media(max-width:620px){
  body.page-home .three-home-workstation-screen{grid-template-columns:1fr;gap:7px;min-height:0;padding:6px}
  body.page-home .three-home-solution-panel,
  body.page-home .three-home-solution-panel[hidden]{min-height:225px}
  body.page-home .three-home-all-links{grid-template-columns:1fr;margin-top:22px}
}


/* ======================================
   SOURCE: /assets/3e-home-solutions-four-screens.css?v=20260725-4
   ====================================== */
/*
 * 3E ana sayfa çözüm ekranları
 * Masaüstünde 2x2, mobilde alt alta dört bağımsız ekran.
 */

body.page-home #panel-ekranlari {
  padding: 72px 0 86px !important;
  overflow: hidden !important;
  background: #07162d !important;
}

body.page-home #panel-ekranlari .three-home-solutions-inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 34px !important;
  width: min(1500px, calc(100% - 40px)) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

/* Başlık ekranların üstünde yer alsın. */
body.page-home #panel-ekranlari .three-home-solutions-copy {
  order: -1 !important;
  width: min(1050px, 100%) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
}

body.page-home #panel-ekranlari .three-home-solutions-copy h2 {
  max-width: 920px !important;
  margin: 0 auto !important;
  color: #ffffff !important;
  font-size: clamp(32px, 4vw, 54px) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.045em !important;
}

body.page-home #panel-ekranlari .three-home-solutions-copy > p {
  max-width: 800px !important;
  margin: 18px auto 0 !important;
  color: #cbd6e7 !important;
  font-size: 17px !important;
  line-height: 1.65 !important;
}

/* Eski tek monitör kasasını kaldır. */
body.page-home #panel-ekranlari .three-home-solutions-visual,
body.page-home #panel-ekranlari .three-home-workstation,
body.page-home #panel-ekranlari .three-home-workstation-frame {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.page-home #panel-ekranlari .three-home-workstation-camera,
body.page-home #panel-ekranlari .three-home-workstation-stand {
  display: none !important;
}

/* Dört ekranı aynı anda göster. */
body.page-home #panel-ekranlari .three-home-workstation-screen {
  position: relative !important;
  inset: auto !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 28px !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Her çözüm kendi bağımsız ekranı olsun. */
body.page-home #panel-ekranlari .three-home-solution-panel,
body.page-home #panel-ekranlari .three-home-solution-panel.is-active {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 430px !important;
  aspect-ratio: 16 / 10 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  border: 8px solid #c9d2de !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.28) !important;
  transform: none !important;
  transition: border-color 0.18s ease, transform 0.18s ease !important;
}

body.page-home #panel-ekranlari .three-home-solution-panel:hover {
  z-index: 2 !important;
  border-color: #eef3f8 !important;
  transform: translateY(-3px) !important;
}

/* Ekran başlıkları. */
body.page-home #panel-ekranlari .three-home-solution-panel-label {
  position: relative !important;
  inset: auto !important;
  z-index: 20 !important;
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 12px 17px !important;
  border: 0 !important;
  border-bottom: 1px solid #d9e0e9 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  color: #071a39 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.page-home #panel-ekranlari .three-home-solution-panel-label b {
  color: #071a39 !important;
  font-size: 17px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}

body.page-home #panel-ekranlari .three-home-solution-panel-label span {
  color: #53637a !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  text-align: right !important;
}

/* GIF ve panel görselleri ekranı kırpmadan doldursun. */
body.page-home #panel-ekranlari .three-home-solution-panel > img {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  transform: none !important;
}

/* Restoran telefon ekranı kendi restoran panelinde kalsın. */
body.page-home #panel-ekranlari .three-home-restaurant-phone {
  position: absolute !important;
  top: auto !important;
  right: 18px !important;
  bottom: 20px !important;
  left: auto !important;
  z-index: 25 !important;
  width: 138px !important;
  max-width: 27% !important;
  transform: none !important;
}

/* Perakende ekranı. */
body.page-home #panel-ekranlari .three-home-retail-app {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
}

body.page-home #panel-ekranlari .three-home-retail-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* Özel yazılım ekranı. */
body.page-home #panel-ekranlari .three-home-custom-app {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
}

body.page-home #panel-ekranlari .three-home-custom-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* Alttaki dört bağlantı. */
body.page-home #panel-ekranlari .three-home-all-links {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  max-width: 1180px !important;
  margin: 28px auto 0 !important;
}

body.page-home #panel-ekranlari .three-home-all-links a {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  min-height: 88px !important;
  padding: 15px 16px !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  border-radius: 7px !important;
  background: rgba(255, 255, 255, 0.035) !important;
  color: #ffffff !important;
  text-align: left !important;
  text-decoration: none !important;
}

body.page-home #panel-ekranlari .three-home-all-links a:hover {
  border-color: rgba(255, 255, 255, 0.58) !important;
  background: rgba(255, 255, 255, 0.075) !important;
}

body.page-home #panel-ekranlari .three-home-all-links b {
  color: #ffffff !important;
}

body.page-home #panel-ekranlari .three-home-all-links span {
  color: #c4d0e0 !important;
}

/* Orta ekranlar. */
@media (max-width: 1100px) {
  body.page-home #panel-ekranlari .three-home-workstation-screen {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel,
  body.page-home #panel-ekranlari .three-home-solution-panel.is-active {
    min-height: 480px !important;
    aspect-ratio: 16 / 9 !important;
  }

  body.page-home #panel-ekranlari .three-home-all-links {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Telefon görünümü: dört ekran alt alta. */
@media (max-width: 620px) {
  body.page-home #panel-ekranlari {
    padding: 48px 0 58px !important;
  }

  body.page-home #panel-ekranlari .three-home-solutions-inner {
    width: calc(100% - 24px) !important;
    gap: 25px !important;
  }

  body.page-home #panel-ekranlari .three-home-solutions-copy h2 {
    font-size: 34px !important;
  }

  body.page-home #panel-ekranlari .three-home-solutions-copy > p {
    margin-top: 14px !important;
    font-size: 15px !important;
  }

  body.page-home #panel-ekranlari .three-home-workstation-screen {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel,
  body.page-home #panel-ekranlari .three-home-solution-panel.is-active {
    min-height: 360px !important;
    aspect-ratio: auto !important;
    border-width: 5px !important;
    border-radius: 11px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel-label {
    align-items: flex-start !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 3px !important;
    min-height: 62px !important;
    padding: 10px 12px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel-label b {
    font-size: 15px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel-label span {
    font-size: 10px !important;
    text-align: left !important;
  }

  body.page-home #panel-ekranlari .three-home-restaurant-phone {
    right: 10px !important;
    bottom: 12px !important;
    width: 108px !important;
    max-width: 31% !important;
  }

  body.page-home #panel-ekranlari .three-home-all-links {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    margin-top: 22px !important;
  }

  body.page-home #panel-ekranlari .three-home-all-links a {
    min-height: 0 !important;
  }
}


/* ======================================
   SOURCE: /assets/3e-home-solutions-monitor-final.css?v=20260725-device-order-1
   ====================================== */
/*
 * Ana sayfa dört ayrı yazılım ekranı
 * Masaüstü: 2x2 bağımsız bilgisayar monitörü
 * Mobil: alt alta dört monitör
 */

body.page-home #panel-ekranlari {
  position: relative !important;
  padding: 48px 0 58px !important;
  overflow: hidden !important;
  background: #07162d !important;
}

body.page-home #panel-ekranlari .three-home-solutions-inner {
  display: block !important;
  width: min(1500px, calc(100% - 40px)) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

/*
 * Eski sağ-sol yerleşimi ve tek büyük monitör kasasını kaldır.
 */
body.page-home #panel-ekranlari .three-home-solutions-visual,
body.page-home #panel-ekranlari .three-home-workstation,
body.page-home #panel-ekranlari .three-home-workstation-frame {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.page-home #panel-ekranlari .three-home-workstation-frame::before,
body.page-home #panel-ekranlari .three-home-workstation-frame::after {
  display: none !important;
  content: none !important;
}

body.page-home #panel-ekranlari .three-home-workstation-camera,
body.page-home #panel-ekranlari .three-home-workstation-stand {
  display: none !important;
}

/*
 * Dört ekranı aynı anda göster.
 */
body.page-home #panel-ekranlari .three-home-workstation-screen {
  position: relative !important;
  inset: auto !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 78px 32px !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 0 45px !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/*
 * Her çözüm ayrı bilgisayar monitörü.
 */
body.page-home #panel-ekranlari .three-home-solution-panel,
body.page-home #panel-ekranlari .three-home-solution-panel.is-active {
  position: relative !important;
  inset: auto !important;
  isolation: isolate !important;
  z-index: 1 !important;

  display: flex !important;
  flex-direction: column !important;

  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 430px !important;
  aspect-ratio: 16 / 10 !important;

  margin: 0 !important;
  padding: 10px 10px 42px !important;

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

  border: 0 !important;
  border-radius: 17px 17px 10px 10px !important;

  background:
    radial-gradient(
      circle at 50% 6px,
      #3f4b58 0,
      #3f4b58 2px,
      transparent 2.8px
    ),
    linear-gradient(
      180deg,
      #e8edf2 0%,
      #cbd3db 68%,
      #aeb8c3 100%
    ) !important;

  box-shadow:
    0 24px 44px rgba(0, 0, 0, 0.30),
    inset 0 0 0 1px rgba(255, 255, 255, 0.7) !important;

  transform: none !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease !important;
}

/* Monitör ayağı */
body.page-home #panel-ekranlari .three-home-solution-panel::before {
  content: "" !important;
  position: absolute !important;
  left: 38% !important;
  bottom: -38px !important;
  z-index: -1 !important;

  display: block !important;
  width: 24% !important;
  height: 43px !important;

  background: linear-gradient(
    90deg,
    #8995a1 0%,
    #d4dbe2 45%,
    #9ba6b1 100%
  ) !important;

  clip-path: polygon(
    28% 0,
    72% 0,
    84% 100%,
    16% 100%
  ) !important;
}

/* Monitör tabanı */
body.page-home #panel-ekranlari .three-home-solution-panel::after {
  content: "" !important;
  position: absolute !important;
  left: 25% !important;
  bottom: -45px !important;
  z-index: -1 !important;

  display: block !important;
  width: 50% !important;
  height: 9px !important;

  border-radius: 8px 8px 3px 3px !important;
  background: linear-gradient(
    90deg,
    #75818d,
    #dce2e7 45%,
    #7c8894
  ) !important;

  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.28) !important;
}

body.page-home #panel-ekranlari .three-home-solution-panel:hover {
  z-index: 3 !important;
  transform: translateY(-3px) !important;
  box-shadow:
    0 30px 52px rgba(0, 0, 0, 0.36),
    inset 0 0 0 1px rgba(255, 255, 255, 0.75) !important;
}

/*
 * Monitör içerisindeki ekran başlığı.
 */
body.page-home #panel-ekranlari .three-home-solution-panel-label {
  position: relative !important;
  inset: auto !important;
  z-index: 5 !important;

  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;

  width: 100% !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 10px 15px !important;

  border: 0 !important;
  border-bottom: 1px solid #d9e0e8 !important;
  border-radius: 7px 7px 0 0 !important;

  background: #ffffff !important;
  color: #071a39 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.page-home #panel-ekranlari .three-home-solution-panel-label b {
  color: #071a39 !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}

body.page-home #panel-ekranlari .three-home-solution-panel-label span {
  color: #58677c !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
  text-align: right !important;
}

/*
 * GIF ekranları.
 */
body.page-home #panel-ekranlari .three-home-solution-panel > img {
  position: relative !important;
  inset: auto !important;
  z-index: 3 !important;

  display: block !important;
  flex: 1 1 auto !important;

  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  object-fit: contain !important;
  object-position: center !important;

  border: 0 !important;
  border-radius: 0 0 7px 7px !important;
  background: #ffffff !important;
  transform: none !important;
}

/*
 * Restoran telefon ekranı.
 */
body.page-home #panel-ekranlari .three-home-restaurant-phone {
  position: absolute !important;
  top: auto !important;
  right: 22px !important;
  bottom: 60px !important;
  left: auto !important;
  z-index: 12 !important;

  width: 130px !important;
  max-width: 25% !important;
  transform: none !important;
}

/*
 * Perakende ve özel yazılım panel içerikleri.
 */
body.page-home #panel-ekranlari .three-home-retail-app,
body.page-home #panel-ekranlari .three-home-custom-app {
  position: relative !important;
  inset: auto !important;
  z-index: 3 !important;

  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;

  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;

  border: 0 !important;
  border-radius: 0 0 7px 7px !important;
  background: #ffffff !important;
  transform: none !important;
}

body.page-home #panel-ekranlari .three-home-retail-body,
body.page-home #panel-ekranlari .three-home-custom-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/*
 * Bu iki metin HTML içerisinde gerçek H2 ve paragraf olarak kalır.
 * Müşterinin ekranında görünmez ve alan kaplamaz.
 */
body.page-home #panel-ekranlari .three-home-solutions-copy > h2,
body.page-home #panel-ekranlari .three-home-solutions-copy > p {
  position: absolute !important;

  width: 1px !important;
  height: 1px !important;

  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;

  white-space: nowrap !important;

  border: 0 !important;

  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
}

/*
 * Alt çözüm bağlantıları kompakt kalsın.
 */
body.page-home #panel-ekranlari .three-home-solutions-copy {
  position: relative !important;
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 24px 0 0 !important;
  padding: 0 !important;

  text-align: left !important;
}

body.page-home #panel-ekranlari .three-home-all-links {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;

  width: min(1200px, 100%) !important;
  max-width: none !important;

  margin: 0 auto !important;
  padding: 0 !important;
}

body.page-home #panel-ekranlari .three-home-all-links a {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;

  min-height: 0 !important;
  padding: 12px 14px !important;

  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  border-radius: 6px !important;

  background: rgba(255, 255, 255, 0.035) !important;
  color: #ffffff !important;

  text-align: left !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

body.page-home #panel-ekranlari .three-home-all-links a:hover {
  border-color: rgba(255, 255, 255, 0.55) !important;
  background: rgba(255, 255, 255, 0.075) !important;
}

body.page-home #panel-ekranlari .three-home-all-links b {
  color: #ffffff !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
}

body.page-home #panel-ekranlari .three-home-all-links span {
  color: #bdc9d9 !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
}

/*
 * Tablet.
 */
@media (max-width: 1120px) {
  body.page-home #panel-ekranlari .three-home-workstation-screen {
    grid-template-columns: 1fr !important;
    gap: 76px !important;
    width: min(820px, 100%) !important;
    margin: 0 auto !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel,
  body.page-home #panel-ekranlari .three-home-solution-panel.is-active {
    min-height: 470px !important;
  }

  body.page-home #panel-ekranlari .three-home-all-links {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/*
 * Mobil.
 */
@media (max-width: 620px) {
  body.page-home #panel-ekranlari {
    padding: 34px 0 40px !important;
  }

  body.page-home #panel-ekranlari .three-home-solutions-inner {
    width: calc(100% - 22px) !important;
  }

  body.page-home #panel-ekranlari .three-home-workstation-screen {
    grid-template-columns: 1fr !important;
    gap: 66px !important;
    padding-bottom: 38px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel,
  body.page-home #panel-ekranlari .three-home-solution-panel.is-active {
    min-height: 350px !important;
    aspect-ratio: auto !important;
    padding: 6px 6px 29px !important;
    border-radius: 12px 12px 7px 7px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel::before {
    bottom: -30px !important;
    height: 34px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel::after {
    bottom: -36px !important;
    height: 7px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel-label {
    align-items: flex-start !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 2px !important;

    min-height: 52px !important;
    padding: 8px 10px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel-label b {
    font-size: 14px !important;
  }

  body.page-home #panel-ekranlari .three-home-solution-panel-label span {
    font-size: 9px !important;
    text-align: left !important;
  }

  body.page-home #panel-ekranlari .three-home-restaurant-phone {
    right: 12px !important;
    bottom: 45px !important;
    width: 100px !important;
    max-width: 31% !important;
  }

  body.page-home #panel-ekranlari .three-home-solutions-copy {
    margin-top: 12px !important;
  }

  body.page-home #panel-ekranlari .three-home-all-links {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }

  body.page-home #panel-ekranlari .three-home-all-links a {
    padding: 10px 12px !important;
  }
}


/* 3E REAL POS TABLET START */

/*
 * Restoran ve perakende ekranları:
 * mağaza tezgâhlarında kullanılan eğimli kasa POS tableti.
 */
body.page-home #panel-ekranlari #home-solution-restaurant,
body.page-home #panel-ekranlari #home-solution-retail {
  justify-self: center !important;

  width: min(92%, 660px) !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 10 !important;

  margin: 5px auto 72px !important;
  padding: 16px 16px 42px !important;

  overflow: visible !important;

  border: 1px solid #4c5663 !important;
  border-radius: 28px !important;

  background:
    radial-gradient(
      circle at 50% 9px,
      #111820 0,
      #111820 3px,
      #65717e 3.5px,
      #65717e 4.5px,
      transparent 5px
    ),
    linear-gradient(
      145deg,
      #303944 0%,
      #111820 52%,
      #050a10 100%
    ) !important;

  box-shadow:
    0 28px 50px rgba(0, 0, 0, 0.42),
    inset 0 0 0 2px rgba(255, 255, 255, 0.05),
    inset 0 -12px 22px rgba(0, 0, 0, 0.28) !important;

  transform-origin: center bottom !important;
}

/* İki tablet hafif farklı yönlere baksın. */
body.page-home #panel-ekranlari #home-solution-restaurant {
  transform: perspective(1500px) rotateX(2deg) rotateY(1.5deg) !important;
}

body.page-home #panel-ekranlari #home-solution-retail {
  transform: perspective(1500px) rotateX(2deg) rotateY(-1.5deg) !important;
}

/*
 * POS tabletin kısa ve kalın metal taşıyıcı kolu.
 */
body.page-home #panel-ekranlari #home-solution-restaurant::before,
body.page-home #panel-ekranlari #home-solution-retail::before {
  content: "" !important;

  position: absolute !important;
  left: 50% !important;
  bottom: -61px !important;
  z-index: -2 !important;

  width: 126px !important;
  height: 76px !important;

  border: 1px solid #77818b !important;
  border-radius: 8px 8px 14px 14px !important;

  background:
    linear-gradient(
      90deg,
      #4c5660 0%,
      #aeb7bf 20%,
      #e2e7eb 50%,
      #a3adb6 80%,
      #48525c 100%
    ) !important;

  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.24),
    0 8px 18px rgba(0, 0, 0, 0.35) !important;

  clip-path: polygon(
    24% 0,
    76% 0,
    92% 100%,
    8% 100%
  ) !important;

  transform: translateX(-50%) !important;
}

/*
 * Tezgâha oturan geniş ve ağır POS tabanı.
 */
body.page-home #panel-ekranlari #home-solution-restaurant::after,
body.page-home #panel-ekranlari #home-solution-retail::after {
  content: "" !important;

  position: absolute !important;
  left: 50% !important;
  bottom: -76px !important;
  z-index: -3 !important;

  width: 330px !important;
  max-width: 60% !important;
  height: 25px !important;

  border: 1px solid #606a75 !important;
  border-radius: 50% 50% 14px 14px / 60% 60% 14px 14px !important;

  background:
    linear-gradient(
      180deg,
      #dce2e7 0%,
      #89949f 45%,
      #414b55 100%
    ) !important;

  box-shadow:
    0 13px 17px rgba(0, 0, 0, 0.42),
    inset 0 3px 2px rgba(255, 255, 255, 0.6) !important;

  transform: translateX(-50%) !important;
}

/*
 * Uygulama ekranı tablet çerçevesinin içine gömülü görünür.
 */
body.page-home #panel-ekranlari
#home-solution-restaurant
.three-home-solution-panel-label,

body.page-home #panel-ekranlari
#home-solution-retail
.three-home-solution-panel-label {
  min-height: 54px !important;
  padding: 10px 15px !important;

  border: 0 !important;
  border-bottom: 1px solid #d8dfe7 !important;
  border-radius: 13px 13px 0 0 !important;

  background: #ffffff !important;
}

body.page-home #panel-ekranlari
#home-solution-restaurant
.three-home-solution-panel-label b,

body.page-home #panel-ekranlari
#home-solution-retail
.three-home-solution-panel-label b {
  font-size: 15px !important;
}

body.page-home #panel-ekranlari
#home-solution-restaurant
.three-home-solution-panel-label span,

body.page-home #panel-ekranlari
#home-solution-retail
.three-home-solution-panel-label span {
  font-size: 10px !important;
}

/*
 * Restoran GIF'i ve perakende uygulaması ekranın tamamını doldurur.
 */
body.page-home #panel-ekranlari
#home-solution-restaurant > img {
  flex: 1 1 auto !important;

  width: 100% !important;
  height: 100% !important;

  object-fit: contain !important;
  object-position: center !important;

  border-radius: 0 0 13px 13px !important;
  background: #ffffff !important;
}

body.page-home #panel-ekranlari
#home-solution-retail
.three-home-retail-app {
  flex: 1 1 auto !important;

  width: 100% !important;
  height: 100% !important;

  overflow: hidden !important;

  border-radius: 0 0 13px 13px !important;
  background: #ffffff !important;
}

/*
 * Restoran ekranındaki ayrı telefon kaldırılır.
 * Tablet kasa görüntüsünü bozmasın.
 */
body.page-home #panel-ekranlari
#home-solution-restaurant
.three-home-restaurant-phone {
  display: none !important;
}

/*
 * Tıklama bağlantısı tablet ekranına gömülü küçük düğme.
 */
body.page-home #panel-ekranlari
#home-solution-restaurant
.three-home-solution-screen-link,

body.page-home #panel-ekranlari
#home-solution-retail
.three-home-solution-screen-link {
  border-radius: 28px !important;
}

body.page-home #panel-ekranlari
#home-solution-restaurant
.three-home-solution-screen-link::after,

body.page-home #panel-ekranlari
#home-solution-retail
.three-home-solution-screen-link::after {
  right: 25px !important;
  bottom: 54px !important;

  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  background: rgba(4, 20, 43, 0.94) !important;
}

/*
 * Tabletlerin altındaki POS ayağı için satır aralığı.
 */
body.page-home #panel-ekranlari .three-home-workstation-screen {
  row-gap: 104px !important;
}

/* Tablet */
@media (max-width: 1120px) {
  body.page-home #panel-ekranlari #home-solution-restaurant,
  body.page-home #panel-ekranlari #home-solution-retail {
    width: min(90%, 720px) !important;
    margin-bottom: 75px !important;
  }
}

/* Telefon */
@media (max-width: 620px) {
  body.page-home #panel-ekranlari #home-solution-restaurant,
  body.page-home #panel-ekranlari #home-solution-retail {
    width: 96% !important;
    aspect-ratio: auto !important;
    min-height: 330px !important;

    margin-bottom: 55px !important;
    padding: 10px 10px 29px !important;

    border-radius: 19px !important;

    transform: none !important;
  }

  body.page-home #panel-ekranlari #home-solution-restaurant::before,
  body.page-home #panel-ekranlari #home-solution-retail::before {
    bottom: -43px !important;

    width: 84px !important;
    height: 49px !important;
  }

  body.page-home #panel-ekranlari #home-solution-restaurant::after,
  body.page-home #panel-ekranlari #home-solution-retail::after {
    bottom: -53px !important;

    width: 190px !important;
    height: 18px !important;
  }

  body.page-home #panel-ekranlari
  #home-solution-restaurant
  .three-home-solution-panel-label,

  body.page-home #panel-ekranlari
  #home-solution-retail
  .three-home-solution-panel-label {
    min-height: 48px !important;
    border-radius: 9px 9px 0 0 !important;
  }

  body.page-home #panel-ekranlari
  #home-solution-restaurant
  .three-home-solution-screen-link::after,

  body.page-home #panel-ekranlari
  #home-solution-retail
  .three-home-solution-screen-link::after {
    right: 16px !important;
    bottom: 38px !important;
  }

  body.page-home #panel-ekranlari .three-home-workstation-screen {
    row-gap: 79px !important;
  }
}

/* 3E REAL POS TABLET END */


/* 3E DEVICE ROW ORDER START */

/*
 * Üst sıra:
 * E-Ticaret bilgisayarı | Özel Yazılım bilgisayarı
 *
 * Alt sıra:
 * Restoran POS tableti | Perakende POS tableti
 */
body.page-home #panel-ekranlari #home-solution-commerce {
  order: 1 !important;
}

body.page-home #panel-ekranlari #home-solution-custom {
  order: 2 !important;
}

body.page-home #panel-ekranlari #home-solution-restaurant {
  order: 3 !important;
}

body.page-home #panel-ekranlari #home-solution-retail {
  order: 4 !important;
}

/* 3E DEVICE ROW ORDER END */



/* ======================================
   SOURCE: /assets/3e-home-solution-screen-links.css?v=20260725-2
   ====================================== */
/*
 * Dört bilgisayar monitörünün tamamını tıklanabilir yapar.
 * Alttaki ayrı bağlantı kartlarını müşteriden gizler.
 */

body.page-home #panel-ekranlari .three-home-solution-panel {
  cursor: pointer !important;
}

/*
 * Monitörün tamamını kaplayan bağlantı.
 */
body.page-home #panel-ekranlari
.three-home-solution-screen-link {
  position: absolute !important;
  inset: 0 !important;
  z-index: 80 !important;

  display: block !important;

  border-radius: 16px 16px 10px 10px !important;
  outline: 0 !important;

  color: #ffffff !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

/*
 * Monitörün içerisinde görünen küçük yönlendirme.
 */
body.page-home #panel-ekranlari
.three-home-solution-screen-link::after {
  content: attr(data-link-label) "  →" !important;

  position: absolute !important;
  right: 18px !important;
  bottom: 54px !important;
  z-index: 2 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 32px !important;
  padding: 7px 12px !important;

  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  border-radius: 5px !important;

  background: rgba(5, 25, 56, 0.93) !important;
  color: #ffffff !important;

  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;

  box-shadow: 0 5px 14px rgba(0, 0, 0, 0.24) !important;

  transition:
    background-color 0.18s ease,
    transform 0.18s ease !important;
}

body.page-home #panel-ekranlari
.three-home-solution-screen-link:hover::after {
  background: #1264e8 !important;
  transform: translateY(-2px) !important;
}

body.page-home #panel-ekranlari
.three-home-solution-screen-link:focus-visible {
  box-shadow:
    inset 0 0 0 4px #1b73ed,
    inset 0 0 0 7px #ffffff !important;
}

body.page-home #panel-ekranlari
.three-home-solution-screen-link:focus-visible::after {
  background: #1264e8 !important;
}

/*
 * Eski dört küçük bağlantı görünmez.
 * Bağlantılar HTML içinde kalmaya devam eder.
 */
body.page-home #panel-ekranlari
.three-home-solutions-copy {
  position: absolute !important;

  width: 1px !important;
  height: 1px !important;

  margin: -1px !important;
  padding: 0 !important;

  overflow: hidden !important;
  white-space: nowrap !important;

  border: 0 !important;

  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
}

body.page-home #panel-ekranlari
.three-home-all-links {
  display: none !important;
}

/*
 * Mobilde monitör içi bağlantı etiketi.
 */
@media (max-width: 620px) {
  body.page-home #panel-ekranlari
  .three-home-solution-screen-link {
    border-radius: 12px 12px 7px 7px !important;
  }

  body.page-home #panel-ekranlari
  .three-home-solution-screen-link::after {
    right: 11px !important;
    bottom: 40px !important;

    min-height: 28px !important;
    padding: 6px 9px !important;

    font-size: 9px !important;
  }
}