/* DOMORA release layer: persistent media ordering, accessible gallery and security settings. */

.record-gallery {
  display: grid;
  width: 100%;
  min-width: 0;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
}

.record-image {
  position: relative;
  min-width: 0;
  max-width: 100%;
  min-height: 150px;
  overflow: hidden;
  border: 1px solid var(--line, #d9ded8);
  border-radius: 16px;
  background: #edf1ec;
  cursor: grab;
  transition: border-color .18s ease, box-shadow .18s ease, opacity .18s ease, transform .18s ease;
}

.record-image:active { cursor: grabbing; }
.record-image.is-dragging { opacity: .48; transform: scale(.98); }
.record-image.is-drag-target { border-color: var(--clay, #da7655); box-shadow: 0 0 0 3px rgba(218,118,85,.16); }
.record-image.is-cover { border-color: var(--clay, #da7655); box-shadow: 0 0 0 2px rgba(218,118,85,.12); }

.record-image img {
  display: block;
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.record-image-position {
  position: absolute;
  left: 10px;
  top: 10px;
  padding: 5px 9px;
  border-radius: 999px;
  color: #fff;
  background: rgba(7,48,42,.86);
  font-size: 12px;
  font-weight: 750;
  backdrop-filter: blur(8px);
}

.record-image.is-cover .record-image-position { background: var(--clay, #da7655); }

.record-image-actions {
  position: absolute;
  right: 9px;
  bottom: 9px;
  display: flex;
  gap: 5px;
  padding: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 8px 24px rgba(7,48,42,.18);
}

.record-image-actions button {
  position: static;
  display: inline-grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: var(--ink, #0c332d);
  background: transparent;
  cursor: pointer;
}

.record-image-actions button:hover,
.record-image-actions button:focus-visible { color: #fff; background: var(--ink, #0c332d); outline: none; }

.record-empty-media {
  display: grid;
  gap: 5px;
  min-height: 140px;
  place-content: center;
  padding: 24px;
  border: 1px dashed var(--line, #d9ded8);
  border-radius: 16px;
  text-align: center;
}

.gallery-layout [data-gallery-index] { cursor: zoom-in; }
.gallery-layout [data-gallery-index]:focus-visible { outline: 3px solid var(--clay, #da7655); outline-offset: 3px; }

.gallery-browser {
  width: min(1180px, calc(100vw - 32px));
  max-width: none;
  height: min(880px, calc(100dvh - 32px));
  max-height: none;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 24px;
  color: #fff;
  background: #071f1b;
  box-shadow: 0 28px 90px rgba(0,0,0,.45);
}

.gallery-browser::backdrop { background: rgba(2,12,10,.82); backdrop-filter: blur(7px); }

.gallery-browser-inner {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: 100%;
}

.gallery-browser-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  padding: 10px 18px;
  border-bottom: 1px solid rgba(255,255,255,.14);
}

.gallery-browser-close,
.gallery-browser-arrow {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 50%;
  color: #fff;
  background: rgba(255,255,255,.09);
  font: inherit;
  cursor: pointer;
}

.gallery-browser-close:hover,
.gallery-browser-arrow:hover,
.gallery-browser-close:focus-visible,
.gallery-browser-arrow:focus-visible { background: #fff; color: #082f29; outline: none; }

.gallery-browser-stage {
  position: relative;
  display: grid;
  min-height: 0;
  place-items: center;
  touch-action: pan-y;
}

.gallery-browser-stage figure {
  display: grid;
  width: 100%;
  height: 100%;
  margin: 0;
  place-items: center;
}

.gallery-browser-stage img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  user-select: none;
}

.gallery-browser-arrow { position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); }
.gallery-browser-arrow[data-gallery-prev] { left: 18px; }
.gallery-browser-arrow[data-gallery-next] { right: 18px; }

.gallery-browser-thumbnails {
  display: flex;
  gap: 9px;
  min-height: 96px;
  padding: 12px 18px;
  overflow-x: auto;
  border-top: 1px solid rgba(255,255,255,.14);
}

.gallery-browser-thumbnails button {
  flex: 0 0 88px;
  padding: 0;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 10px;
  background: transparent;
  opacity: .62;
  cursor: pointer;
}

.gallery-browser-thumbnails button.is-active { border-color: var(--clay, #da7655); opacity: 1; }
.gallery-browser-thumbnails img { display: block; width: 100%; height: 66px; object-fit: cover; }

.security-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.security-grid article {
  padding: 22px;
  border: 1px solid var(--line, #d9ded8);
  border-radius: 18px;
  background: #fbfcfa;
}

.security-grid article.wide { grid-column: 1 / -1; }
.security-grid h3 { margin: 0 0 9px; }
.security-checklist { display: grid; gap: 9px; margin: 14px 0 0; padding: 0; list-style: none; }
.security-checklist li { position: relative; padding-left: 25px; }
.security-checklist li::before { content: "✓"; position: absolute; left: 0; color: #318766; font-weight: 800; }
.mfa-setup-secret { display: grid; gap: 8px; padding: 14px; border-radius: 12px; background: #edf1ec; overflow-wrap: anywhere; }

@media (max-width: 720px) {
  .record-gallery { grid-template-columns: minmax(0, 1fr); }
  .record-image img { height: 150px; }
  .gallery-browser { width: 100vw; height: 100dvh; border-radius: 0; }
  .gallery-browser-arrow { width: 40px; height: 40px; }
  .gallery-browser-arrow[data-gallery-prev] { left: 8px; }
  .gallery-browser-arrow[data-gallery-next] { right: 8px; }
  .gallery-browser-thumbnails { min-height: 82px; padding: 9px 12px; }
  .gallery-browser-thumbnails button { flex-basis: 70px; }
  .gallery-browser-thumbnails img { height: 52px; }
  .security-grid { grid-template-columns: 1fr; }
  .security-grid article.wide { grid-column: auto; }
}



/* Actual dialog structure produced by product-suite.js */
.gallery-browser {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 72px;
  grid-template-rows: minmax(0, 1fr) 96px;
  align-items: center;
}
.gallery-browser > figure { grid-column: 2; grid-row: 1; display: grid; min-width: 0; min-height: 0; height: 100%; margin: 0; place-items: center; }
.gallery-browser > figure img { display: block; max-width: 100%; max-height: calc(100dvh - 150px); object-fit: contain; user-select: none; }
.gallery-browser > figure figcaption { position: absolute; top: 19px; left: 50%; color: rgba(255,255,255,.85); font-weight: 750; transform: translateX(-50%); }
.gallery-browser .gallery-close { position: absolute; z-index: 4; top: 12px; right: 12px; }
.gallery-browser .gallery-arrow { position: static; z-index: 3; align-self: center; justify-self: center; color: #fff; background: rgba(255,255,255,.1); }
.gallery-browser .gallery-previous { grid-column: 1; grid-row: 1; }
.gallery-browser .gallery-next { grid-column: 3; grid-row: 1; }
.gallery-browser .gallery-thumbnails { grid-column: 1 / -1; grid-row: 2; display: flex; gap: 9px; min-width: 0; height: 96px; padding: 12px 64px; overflow-x: auto; border-top: 1px solid rgba(255,255,255,.14); }
.gallery-browser .gallery-thumbnails button { position: static; flex: 0 0 88px; width: 88px; height: 68px; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: 10px; background: transparent; opacity: .62; cursor: pointer; }
.gallery-browser .gallery-thumbnails button.active { border-color: var(--clay, #da7655); opacity: 1; }
.gallery-browser .gallery-thumbnails img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 720px) {
  .gallery-browser { grid-template-columns: 48px minmax(0, 1fr) 48px; grid-template-rows: minmax(0, 1fr) 80px; }
  .gallery-browser > figure img { max-height: calc(100dvh - 112px); }
  .gallery-browser .gallery-thumbnails { height: 80px; padding: 9px 48px; }
  .gallery-browser .gallery-thumbnails button { flex-basis: 70px; width: 70px; height: 54px; }
}

/* DOMORA feedback release: premium gallery and system-wide visual safeguards */
.property-share-tools .button,.share-tools .button{display:inline-flex;align-items:center;gap:.5rem;min-height:42px}
.share-icon{display:inline-flex;width:18px;height:18px;align-items:center;justify-content:center;flex:0 0 18px}
.share-icon svg{display:block;width:100%;height:100%;fill:currentColor}

.gallery-browser{position:fixed;inset:clamp(12px,3vw,40px);width:auto;max-width:none;height:auto;max-height:none;margin:auto;padding:0;overflow:hidden;border:0;border-radius:24px;background:rgba(246,243,236,.96);box-shadow:0 26px 90px rgba(5,32,28,.35);grid-template-columns:64px minmax(0,1fr) 64px;grid-template-rows:minmax(0,1fr) 92px;isolation:isolate}
.gallery-browser::before{content:"";position:absolute;inset:0;z-index:-2;background-image:var(--gallery-image);background-size:cover;background-position:center;filter:blur(36px) saturate(.72);transform:scale(1.08);opacity:.22}
.gallery-browser::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(241,238,229,.82))}
.gallery-browser::backdrop{background:rgba(9,28,25,.66);backdrop-filter:blur(11px)}
.gallery-browser>figure{position:relative;grid-column:2;grid-row:1;display:grid;place-items:center;min-width:0;min-height:0;height:100%;margin:0;padding:26px}
.gallery-browser>figure img{display:block;max-width:100%;max-height:calc(100dvh - 190px);object-fit:contain;border-radius:14px;box-shadow:0 18px 54px rgba(7,31,27,.18);user-select:none}
.gallery-browser>figure figcaption{position:absolute;top:18px;left:50%;padding:7px 12px;border-radius:999px;color:#fff;background:rgba(8,47,41,.78);font-weight:800;transform:translateX(-50%)}
.gallery-browser .gallery-close{position:absolute;z-index:5;top:16px;right:16px;display:grid;width:46px;height:46px;padding:0;place-items:center;border:1px solid rgba(8,47,41,.14);border-radius:50%;color:#fff;background:#0b3a33;font-size:28px;line-height:1;box-shadow:0 8px 24px rgba(8,47,41,.18)}
.gallery-browser .gallery-arrow{position:static;z-index:3;align-self:center;justify-self:center;display:grid;width:46px;height:46px;padding:0;place-items:center;border:0;border-radius:50%;color:#fff;background:rgba(8,47,41,.86);font-size:28px}
.gallery-browser .gallery-previous{grid-column:1;grid-row:1}.gallery-browser .gallery-next{grid-column:3;grid-row:1}
.gallery-browser .gallery-thumbnails{grid-column:1/-1;grid-row:2;display:flex;gap:10px;min-width:0;height:92px;padding:12px 72px;overflow-x:auto;overflow-y:hidden;border-top:1px solid rgba(8,47,41,.12);background:rgba(255,255,255,.72);scrollbar-width:none}
.gallery-browser .gallery-thumbnails::-webkit-scrollbar{display:none}
.gallery-browser .gallery-thumbnails button{position:static;flex:0 0 84px;width:84px;height:66px;padding:0;overflow:hidden;border:2px solid transparent;border-radius:10px;background:#fff;opacity:.68;cursor:pointer}
.gallery-browser .gallery-thumbnails button.active{border-color:var(--clay,#da7655);opacity:1}.gallery-browser .gallery-thumbnails img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:720px){.gallery-browser{inset:0;width:100vw;height:100dvh;border-radius:0;grid-template-columns:48px minmax(0,1fr) 48px;grid-template-rows:minmax(0,1fr) 78px}.gallery-browser>figure{padding:14px}.gallery-browser>figure img{max-height:calc(100dvh - 115px)}.gallery-browser .gallery-thumbnails{height:78px;padding:9px 52px}.gallery-browser .gallery-thumbnails button{flex-basis:66px;width:66px;height:52px}}