/* V152 — GERÇEK BİLGİSAYAR lightbox, second approved visual proposal.
   Changes are scoped to the project gallery. Other site elements are untouched. */

/* Rounded image and frame have the same geometry, at every size. */
.v150-project-detail .v150-gallery,
.v150-project-detail .v150-gallery-main,
.v150-project-detail .v150-gallery-thumb { box-sizing:border-box; }
.v150-project-detail .v150-gallery { border-radius:20px; }
.v150-project-detail .v150-gallery-main { border-radius:14px; }
.v150-project-detail .v150-gallery-main > img { border-radius:inherit; }
.v150-project-detail .v150-gallery-thumb { border-radius:12px; }
.v150-project-detail .v150-gallery-thumb > img { border-radius:9px; }

/* Branding and soft blue wave header inspired by selected proposal. */
dialog.v150-gallery-dialog.v151-gallery-dialog.v152-gallery-dialog {
  box-sizing:border-box;
  width:min(1190px, calc(100vw - 44px));
  max-width:calc(100vw - 44px);
  max-height:min(90dvh, 860px);
  margin:auto;
  padding:0;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(192,220,239,.98);
  border-radius:24px;
  color:#102e50;
  box-shadow:0 34px 100px rgba(17,46,83,.27),0 9px 25px rgba(0,58,110,.08);
}
dialog.v150-gallery-dialog.v151-gallery-dialog.v152-gallery-dialog::backdrop {
  background:rgba(30,58,92,.26);
  -webkit-backdrop-filter:blur(16px) saturate(.85);
  backdrop-filter:blur(16px) saturate(.85);
}
.v150-gallery-dialog.v152-gallery-dialog .v152-dialog-head {
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(160px,235px) minmax(0,1fr) 44px;
  align-items:center;
  gap:24px;
  min-height:104px;
  padding:18px 24px;
  overflow:hidden;
  background:linear-gradient(109deg,#fff 6%,#fff 47%,#f4faff 70%,#e5f2fe 100%);
  border-bottom:1px solid #e1edf8;
}
.v150-gallery-dialog.v152-gallery-dialog .v152-dialog-head::before,
.v150-gallery-dialog.v152-gallery-dialog .v152-dialog-head::after {
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:45%;height:180px;right:-7%;bottom:-110px;
  border-radius:60% 0 0 0/100% 0 0 0;
  background:rgba(49,159,236,.12);
  transform:rotate(-13deg);
}
.v150-gallery-dialog.v152-gallery-dialog .v152-dialog-head::after {
  right:4%;bottom:-138px;width:40%;height:195px;
  background:rgba(0,116,218,.07);transform:rotate(-16deg);
}
.v152-dialog-brand {
  display:flex;align-items:center;justify-content:flex-start;
  min-width:0;min-height:48px;padding-right:22px;
  border-right:1px solid #ccddea;
}
.v152-dialog-brand img { display:block;max-width:100%;width:205px;height:auto;max-height:57px;object-fit:contain;object-position:left center; }
.v152-dialog-heading {display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0;line-height:1.3;}
.v152-dialog-heading strong {color:#0d2a4f;font-size:clamp(16px,1.7vw,22px);font-weight:800;letter-spacing:-.015em;overflow-wrap:anywhere;}
.v152-dialog-heading span {color:#5c7691;font-size:13px;font-weight:500;}
.v150-gallery-dialog.v152-gallery-dialog .v152-dialog-close {
  z-index:1;
  width:44px;height:44px;flex:0 0 44px;
  background:rgba(255,255,255,.83);
  border:1px solid #d9e8f6;border-radius:50%;
  color:#2e4d70;box-shadow:0 4px 10px rgba(32,79,119,.06);
}
.v150-gallery-dialog.v152-gallery-dialog .v152-dialog-close:hover {background:#e7f5ff;color:#007fbd;border-color:#aad9f5;}
.v152-dialog-close svg {width:19px;height:19px;}

/* Large selected image left, smaller near-square thumbnails in a vertical right rail. */
.v150-gallery-dialog.v152-gallery-dialog .v151-dialog-body {
  box-sizing:border-box;
  display:grid;grid-template-columns:minmax(0,1fr) 172px;
  gap:16px;min-height:0;height:min(67dvh,606px);
  padding:17px 20px 19px;background:#fff;
}
.v150-gallery-dialog.v152-gallery-dialog .v151-dialog-body.v151-single-image {grid-template-columns:minmax(0,1fr);}
.v152-gallery-dialog .v151-gallery-stage {display:flex;flex-direction:column;gap:12px;min-height:0;min-width:0;}
.v152-gallery-dialog .v151-gallery-stage-image {
  min-height:0;flex:1 1 auto;
  display:flex;align-items:center;justify-content:center;
  border-radius:16px;border:1px solid #d8e9f4;
  overflow:hidden;background:#f3f8fc;
}
.v152-gallery-dialog .v151-gallery-stage-image > img {
  width:100%;height:100%;max-width:100%;max-height:100%;
  object-fit:contain;display:block;border-radius:15px;
}
.v152-gallery-dialog .v151-gallery-rail {
  display:flex;flex-direction:column;gap:10px;
  min-width:0;min-height:0;max-height:none;
  overflow-x:hidden;overflow-y:auto;
  padding:3px 4px 3px 3px;
  scrollbar-width:thin;scrollbar-color:#b1d6ed transparent;
}
.v152-gallery-dialog .v151-gallery-rail-thumb {
  display:block;flex:0 0 auto;
  box-sizing:border-box;width:100%;height:auto;aspect-ratio:1.33;
  padding:4px;margin:0;
  border:1px solid #d8e7f1;border-radius:14px;
  background:#f3f8fc;overflow:hidden;
  box-shadow:0 3px 9px rgba(17,62,98,.06);
  cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease;
}
.v152-gallery-dialog .v151-gallery-rail-thumb img {
  display:block;width:100%;height:100%;border-radius:10px;object-fit:contain;
}
.v152-gallery-dialog .v151-gallery-rail-thumb:hover {border-color:#6bbce9;}
.v152-gallery-dialog .v151-gallery-rail-thumb.is-selected {
  border:2px solid #0396ea;padding:3px;
  box-shadow:0 0 0 2px rgba(2,151,229,.16),0 6px 13px rgba(12,103,166,.12);
}
.v152-gallery-dialog .v151-gallery-controls {flex:0 0 38px;gap:10px;height:38px;}
.v152-gallery-dialog .v151-gallery-controls button {
  box-sizing:border-box;flex:0 0 36px;width:36px;height:36px;
  border-radius:50%;background:#f3f9ff;
}
.v152-gallery-dialog .v151-gallery-counter {
  display:inline-flex;align-items:center;justify-content:center;
  min-width:59px;min-height:30px;padding:0 10px;
  background:#eff7fe;border-radius:99px;color:#224869;
}
.v152-gallery-dialog :is(button:focus-visible) {outline:3px solid #0d9fea;outline-offset:2px;}

@media(max-width:850px) and (min-width:661px) {
  dialog.v150-gallery-dialog.v151-gallery-dialog.v152-gallery-dialog {width:min(96vw,900px);max-width:96vw;}
  .v150-gallery-dialog.v152-gallery-dialog .v152-dialog-head {grid-template-columns:minmax(125px,190px) minmax(0,1fr) 40px;gap:15px;min-height:90px;padding:14px 18px;}
  .v152-dialog-brand {padding-right:16px;}
  .v152-dialog-brand img {width:165px;}
  .v150-gallery-dialog.v152-gallery-dialog .v151-dialog-body {grid-template-columns:minmax(0,1fr) 136px;padding:14px;gap:12px;height:min(63dvh,580px);}
}
@media(max-width:660px) {
  dialog.v150-gallery-dialog.v151-gallery-dialog.v152-gallery-dialog {
    width:calc(100vw - 16px);max-width:calc(100vw - 16px);
    max-height:95dvh;border-radius:17px;
  }
  .v150-gallery-dialog.v152-gallery-dialog .v152-dialog-head {
    display:grid;grid-template-columns:minmax(0,1fr) 36px;
    column-gap:12px;row-gap:8px;
    padding:13px 13px 12px;min-height:auto;
  }
  .v152-dialog-brand {grid-column:1;grid-row:1;border-right:0;padding-right:0;min-height:27px;}
  .v152-dialog-brand img {width:134px;max-height:37px;}
  .v152-dialog-heading {grid-column:1;grid-row:2;gap:1px;}
  .v152-dialog-heading strong {font-size:15px;}
  .v152-dialog-heading span {font-size:11px;}
  .v150-gallery-dialog.v152-gallery-dialog .v152-dialog-close {grid-column:2;grid-row:1;align-self:start;flex-basis:36px;width:36px;height:36px;}
  .v150-gallery-dialog.v152-gallery-dialog .v151-dialog-body {
    display:flex;flex-direction:column;gap:11px;height:auto;
    padding:11px 12px 13px;max-height:calc(95dvh - 104px);overflow-y:auto;
  }
  .v152-gallery-dialog .v151-gallery-stage {flex:0 0 auto;gap:7px;}
  .v152-gallery-dialog .v151-gallery-stage-image {flex:0 0 auto;height:min(49dvh,310px);border-radius:12px;}
  .v152-gallery-dialog .v151-gallery-stage-image > img {max-height:100%;border-radius:11px;}
  .v152-gallery-dialog .v151-gallery-controls {height:33px;flex-basis:33px;}
  .v152-gallery-dialog .v151-gallery-controls button {width:32px;height:32px;flex-basis:32px;}
  .v152-gallery-dialog .v151-gallery-rail {
    display:flex;flex-direction:row;gap:9px;
    flex:0 0 auto;min-height:0;max-height:none;
    overflow-x:auto;overflow-y:hidden;padding:3px 1px 4px;
  }
  .v152-gallery-dialog .v151-gallery-rail-thumb {
    flex:0 0 94px;width:94px;height:78px;aspect-ratio:auto;border-radius:10px;
  }
  .v152-gallery-dialog .v151-gallery-rail-thumb img {border-radius:7px;}
  .v150-project-detail .v150-gallery {border-radius:16px;}
}
@media(max-width:360px) {
  .v150-gallery-dialog.v152-gallery-dialog .v151-dialog-body {padding:8px;}
  .v152-gallery-dialog .v151-gallery-stage-image {height:min(43dvh,260px);}
  .v152-gallery-dialog .v151-gallery-rail-thumb {flex-basis:82px;width:82px;height:72px;}
}
@media(prefers-reduced-motion:reduce){
  .v152-gallery-dialog .v151-gallery-rail-thumb {transition:none;}
}
