/* MOBIN shared site utilities: quick contact panel + floating language link. */

.floating-language-link {
  position: fixed;
  top: 50%;
  left: 0;
  z-index: 300;
  min-width: 52px;
  height: 46px;
  display: grid;
  place-items: center;
  padding: 0 14px;
  transform: translateY(-50%);
  border: 1px solid rgba(100, 150, 255, 0.26);
  border-left: 0;
  border-radius: 0 14px 14px 0;
  color: rgba(230, 242, 255, 0.92);
  background: rgba(4, 10, 28, 0.50);
  box-shadow: 0 10px 36px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(20px) saturate(1.35);
  -webkit-backdrop-filter: blur(20px) saturate(1.35);
  font-family: var(--font-family-latin);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-decoration: none;
  transition: color 160ms ease, background 160ms ease, border-color 160ms ease;
}

.floating-language-link:hover,
.floating-language-link:focus-visible {
  color: #fff;
  background: rgba(20, 35, 70, .74);
  border-color: rgba(128, 174, 255, .46);
  outline: none;
}

.quick-contact {
  --contact-tab-handle: 54px;
  --contact-panel-width: min(350px, calc(100vw - 66px));
  position: fixed;
  top: calc(50% - 84px);
  left: 0;
  z-index: 301;
  width: var(--contact-tab-handle);
  height: var(--contact-tab-handle);
  direction: ltr;
  isolation: isolate;
}

.quick-contact-panel {
  position: absolute;
  top: 50%;
  left: 0;
  width: var(--contact-panel-width);
  padding: 18px 18px 17px;
  direction: rtl;
  text-align: right;
  color: rgba(230,242,255,.98);
  background: rgba(4,10,28,.72);
  border: 1px solid rgba(115,165,255,.48);
  border-left: 0;
  border-radius: 0 14px 14px 0;
  box-shadow: 0 10px 36px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(20px) saturate(1.35);
  -webkit-backdrop-filter: blur(20px) saturate(1.35);
  transform: translate(-100%, -50%);
  opacity: 0;
  visibility: hidden;
  transition: transform 220ms cubic-bezier(.22,1,.36,1), opacity 170ms ease, visibility 0s linear 220ms;
}

html[dir="ltr"] .quick-contact-panel { direction: ltr; text-align: left; }

.quick-contact.is-open .quick-contact-panel {
  transform: translate(0, -50%);
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.quick-contact-title { margin: 0 0 13px; color: #fff; font-size: 17px; line-height: 1.4; font-weight: 700; }
.quick-contact-list { display: grid; gap: 12px; }
.quick-contact-row { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 11px; align-items: center; color: rgba(225,237,255,.86); font-size: 14px; line-height: 1.65; }
.quick-contact-row-icon { width: 21px; height: 21px; color: rgba(145,184,255,.88); }
.quick-contact-details { min-width: 0; }
.quick-contact-label { display: block; margin-bottom: 1px; color: rgba(160,193,255,.72); font-size: 12px; }
.quick-contact-value, .quick-contact-value:visited { color: rgba(241,247,255,.98); font-size: 15px; text-decoration: none; overflow-wrap: anywhere; }
.quick-contact-value[href]:hover, .quick-contact-value[href]:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 3px; outline: none; }

.quick-contact-handle {
  position: relative;
  z-index: 2;
  width: var(--contact-tab-handle);
  height: var(--contact-tab-handle);
  display: grid;
  place-items: center;
  padding: 3px;
  color: rgba(175,202,255,.82);
  background: rgba(4,10,28,.50);
  border: 1px solid rgba(100,150,255,.26);
  border-left: 0;
  border-radius: 0 14px 14px 0;
  box-shadow: 0 10px 36px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(20px) saturate(1.35);
  -webkit-backdrop-filter: blur(20px) saturate(1.35);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color 160ms ease, background 160ms ease, border-color 160ms ease;
}

.quick-contact-handle:hover,
.quick-contact-handle:focus-visible {
  color: #fff;
  background: rgba(20,35,70,.72);
  border-color: rgba(128,174,255,.46);
  outline: none;
}

.quick-contact-icon { width: 18px; height: 18px; display: block; }
.quick-contact-close { display: none; }

/*
 * Static orbital texture for selected solid dark internal surfaces.
 * The Home/Index experience is intentionally excluded from this system.
 * No animation, canvas or runtime behaviour. Existing background colours
 * remain authoritative; this is only a low-opacity decorative layer.
 */
:root {
  --orbital-pattern-image: url('/assets/patterns/orbital-field.svg');
  --orbital-pattern-opacity: 0.38;
}

body:has(#section-mv) .section-mv::before,
body:has(#section-mv) .section-history-a::before,
body:has(#section-mv) .section-history-b::before,
body:has(#section-group-a) .section-group-a::before,
body:has(#section-group-a) .section-group-c::before,
body:has(#section-listings) .section-listings::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: var(--orbital-pattern-image);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  opacity: var(--orbital-pattern-opacity);
}

body:has(.tl-item--strategic)::before,
body:has(.contact-layout)::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: var(--orbital-pattern-image);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  opacity: var(--orbital-pattern-opacity);
}

@media (max-width: 768px) {
  .floating-language-link { min-width: 48px; height: 42px; padding: 0 12px; }
  .quick-contact { --contact-tab-handle: 50px; --contact-panel-width: min(310px, calc(100vw - 60px)); }
  .quick-contact-panel { padding: 16px 15px 15px; }
  :root { --orbital-pattern-opacity: 0.38; }
}

@media (prefers-reduced-motion: reduce) {
  .quick-contact-panel, .quick-contact-handle, .floating-language-link { transition-duration: .01ms; }
}
