/*
 * GeoArea v20 Design System
 * Central visual layer. Loaded after legacy/page styles to normalize colours,
 * typography, controls, cards and responsive behaviour without changing data logic.
 */
:root {
  --ga-primary: #2457d6;
  --ga-primary-hover: #1848c2;
  --ga-primary-soft: #edf3ff;
  --ga-navy: #0d1b3d;
  --ga-navy-2: #17366f;
  --ga-gold: #f1b84b;
  --ga-success: #16a45b;
  --ga-success-hover: #11874b;
  --ga-danger: #dc3f4f;
  --ga-warning: #e79a19;
  --ga-page: #f4f7fc;
  --ga-surface: #ffffff;
  --ga-surface-2: #f8faff;
  --ga-text: #101b33;
  --ga-text-2: #41506b;
  --ga-muted: #71809a;
  --ga-border: #dfe6f1;
  --ga-border-strong: #cbd6e6;
  --ga-shadow-xs: 0 2px 8px rgba(13, 27, 61, .05);
  --ga-shadow-sm: 0 8px 22px rgba(13, 27, 61, .07);
  --ga-shadow-md: 0 16px 42px rgba(13, 27, 61, .10);
  --ga-radius-sm: 10px;
  --ga-radius: 16px;
  --ga-radius-lg: 22px;
  --ga-control-h: 48px;
  --ga-container: 1320px;
  --ga-ease: 180ms ease;
}

/* Base */
html { scroll-behavior: smooth; }
body { background: var(--ga-page); color: var(--ga-text); }
body, button, input, select, textarea { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
a { text-underline-offset: 3px; }
.ga-container { width: min(calc(100% - 40px), var(--ga-container)); margin-inline: auto; }
.ga-section { padding: 54px 0; }
.ga-section__head { margin-bottom: 24px; }
.ga-section__head h1,.ga-section__head h2,.ga-section__head h3 { margin: 0; color: var(--ga-text); }
.ga-section__head h2 { font-size: clamp(24px, 2.4vw, 34px); line-height: 1.25; letter-spacing: -.015em; }
.ga-section__head > a { color: var(--ga-primary); font-weight: 800; }
.ga-empty,.ga-empty-state { border: 1px dashed var(--ga-border-strong); border-radius: var(--ga-radius); background: var(--ga-surface); color: var(--ga-muted); }

/* Typography scale */
.geoarea-ui h1,.ga-page h1,.ga-account-panel h1,.gb-page h1 { font-size: clamp(28px, 3vw, 40px); line-height: 1.18; letter-spacing: -.02em; }
.geoarea-ui h2,.ga-page h2,.ga-account-panel h2,.gb-page h2 { font-size: clamp(23px, 2.2vw, 32px); line-height: 1.24; letter-spacing: -.015em; }
.geoarea-ui h3,.ga-page h3,.ga-account-panel h3,.gb-page h3 { font-size: clamp(18px, 1.5vw, 23px); line-height: 1.32; }
.geoarea-ui p,.ga-page p,.ga-account-panel p,.gb-page p { color: var(--ga-text-2); line-height: 1.65; }

/* Unified buttons */
.ga-button,.ga-green-btn,.gb-btn,.gb-submit,.ga-topup-submit,
button[type="submit"],input[type="submit"] {
  min-height: var(--ga-control-h);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: 13px;
  background: var(--ga-primary);
  color: #fff !important;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 7px 16px rgba(36,87,214,.18);
  cursor: pointer;
  transition: transform var(--ga-ease), background var(--ga-ease), box-shadow var(--ga-ease), border-color var(--ga-ease);
}
.ga-button:hover,.ga-green-btn:hover,.gb-btn:hover,.gb-submit:hover,
button[type="submit"]:hover,input[type="submit"]:hover {
  background: var(--ga-primary-hover);
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(36,87,214,.23);
}
.ga-green-btn,.ga-topup-submit { background: var(--ga-success); box-shadow: 0 7px 16px rgba(22,164,91,.18); }
.ga-green-btn:hover,.ga-topup-submit:hover { background: var(--ga-success-hover); }
button:disabled,.ga-topup-submit:disabled,[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none !important; box-shadow: none !important; }

/* Unified forms */
.geoarea-ui input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.geoarea-ui select,.geoarea-ui textarea,
.ga-account-panel input:not([type="checkbox"]):not([type="radio"]),.ga-account-panel select,.ga-account-panel textarea,
.gb-page input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),.gb-page select,.gb-page textarea {
  width: 100%;
  min-height: var(--ga-control-h);
  border: 1px solid var(--ga-border);
  border-radius: 12px;
  background: #fff;
  color: var(--ga-text);
  padding: 11px 14px;
  outline: none;
  box-shadow: none;
  transition: border-color var(--ga-ease), box-shadow var(--ga-ease), background var(--ga-ease);
}
.geoarea-ui textarea,.ga-account-panel textarea,.gb-page textarea { min-height: 130px; resize: vertical; }
.geoarea-ui input:focus,.geoarea-ui select:focus,.geoarea-ui textarea:focus,
.ga-account-panel input:focus,.ga-account-panel select:focus,.ga-account-panel textarea:focus,
.gb-page input:focus,.gb-page select:focus,.gb-page textarea:focus {
  border-color: var(--ga-primary);
  box-shadow: 0 0 0 4px rgba(36,87,214,.11);
}
.geoarea-ui label,.ga-account-panel label,.gb-page label { color: var(--ga-text); font-weight: 750; }

/* Shared surfaces */
.ga-account-mini-card,.ga-account-menu,.ga-account-panel,
.gb-card,.gb-section,.ga-topup-box,.ga-balance-card,
.ga-faq__item,.ga-blog-card,.ga-service-card {
  border: 1px solid var(--ga-border) !important;
  border-radius: var(--ga-radius) !important;
  background: var(--ga-surface) !important;
  box-shadow: var(--ga-shadow-xs) !important;
}

/* Home hero/search */
.ga-hero { background: linear-gradient(118deg, var(--ga-navy) 0%, var(--ga-navy-2) 58%, #275ddb 100%); color: #fff; }
.ga-hero h1,.ga-hero h2,.ga-hero h3,.ga-hero p,.ga-hero .ga-eyebrow { color: #fff; }
.ga-hero__search { border-radius: var(--ga-radius-lg); box-shadow: var(--ga-shadow-md); }
.ga-search-form { border-radius: var(--ga-radius-lg); }
.ga-search-form select,.ga-search-form input { border-radius: 0; }

/* Property grids: preserve existing card composition, normalize spacing only */
.ga-property-grid { gap: 22px; }
.ghp-card { border: 1px solid var(--ga-border) !important; border-radius: var(--ga-radius) !important; box-shadow: var(--ga-shadow-sm) !important; overflow: hidden; transition: transform var(--ga-ease), box-shadow var(--ga-ease); }
.ghp-card:hover { transform: translateY(-3px); box-shadow: var(--ga-shadow-md) !important; }
.ghp-card a { text-decoration: none; }
.ghp-title { color: var(--ga-text) !important; }
.ghp-meta,.ghp-footer { color: var(--ga-muted); }

/* Services */
.ga-services__grid { gap: 22px; }
.ga-services .ga-service-card { transition: transform var(--ga-ease), box-shadow var(--ga-ease); }
.ga-services .ga-service-card:hover { transform: translateY(-4px); box-shadow: var(--ga-shadow-md) !important; }
.ga-services .ga-service-card > div { min-height: 118px; }
.ga-services .ga-service-card h3 { color: var(--ga-text) !important; }
.ga-services .ga-service-card p { color: var(--ga-muted) !important; }

/* Blog */
.gab-page { color: var(--ga-text); }
.gab-hero { background: linear-gradient(118deg, var(--ga-navy) 0%, #173572 62%, #275ddb 100%) !important; }
.gab-hero h1,.gab-hero h2,.gab-hero h3,.gab-hero p { color: #fff !important; }
.gab-hero .gab-hero-content h3 { font-size: clamp(27px, 3vw, 40px) !important; line-height: 1.2 !important; }
.gab-section-heading h2,.gab-section-heading h3 { font-size: clamp(23px, 2.5vw, 32px) !important; }
.gab-card h2,.gab-card h3,.gab-post-card h2,.gab-post-card h3 { font-size: 18px !important; line-height: 1.42 !important; }
.gab-card p,.gab-post-card p,.gab-page p { font-size: 14px !important; line-height: 1.7 !important; }
.gab-card,.gab-post-card { border: 1px solid var(--ga-border) !important; border-radius: var(--ga-radius) !important; box-shadow: var(--ga-shadow-xs) !important; overflow: hidden; }

/* FAQ */
.ga-faq__list { display: grid; gap: 12px; }
.ga-faq__item { overflow: hidden; }
.ga-faq__item summary { padding: 18px 20px; color: var(--ga-text); font-weight: 800; cursor: pointer; }
.ga-faq__item > div { padding: 0 20px 18px; }

/* Account/dashboard */
.ga-account-shell { gap: 24px; }
.ga-account-left { min-width: 0; }
.ga-account-menu a { border-radius: 11px; color: var(--ga-text-2); transition: background var(--ga-ease), color var(--ga-ease); }
.ga-account-menu a:hover,.ga-account-menu a.active,.ga-account-menu .active > a { background: var(--ga-primary-soft); color: var(--ga-primary); }
.ga-account-panel { padding: 26px !important; }
.ga-mp-head { gap: 18px; }
.ga-mp-head h1,.ga-mp-head h2 { color: var(--ga-text); }
.ga-account-notice { border-radius: 12px; background: #eaf8f1; border: 1px solid #bee9d1; color: #087343; }
.ga-account-notice--error { background: #fff0f2; border-color: #f3c5cc; color: #a91f35; }
.ga-mp-row { border: 1px solid var(--ga-border); border-radius: var(--ga-radius); background: #fff; box-shadow: var(--ga-shadow-xs); overflow: hidden; }
.ga-mp-actions a,.ga-mp-actions button { border-radius: 10px; }
.ga-fav-grid.ga-property-grid { gap: 22px !important; }

/* Balance */
.ga-balance-card.primary { background: linear-gradient(135deg, var(--ga-primary), #173d9b) !important; color: #fff; }
.ga-balance-card.primary * { color: #fff !important; }
.ga-tr-row { border-color: var(--ga-border); }

/* Add/Edit Property */
.gb-page { color: var(--ga-text); }
.gb-sidebar { border-right-color: var(--ga-border); }
.gb-steps { border: 1px solid var(--ga-border); border-radius: var(--ga-radius); background: #fff; box-shadow: var(--ga-shadow-xs); overflow: hidden; }
.gb-step { color: var(--ga-text-2); }
.gb-step:hover,.gb-step.active { color: var(--ga-primary); background: var(--ga-primary-soft); }
.gb-section { padding: 24px !important; margin-bottom: 18px; }
.gb-section h2,.gb-section h3 { color: var(--ga-text); }
.gb-upload { border: 1.5px dashed #a9bad3 !important; border-radius: var(--ga-radius) !important; background: var(--ga-surface-2) !important; }
.gb-upload:hover { border-color: var(--ga-primary) !important; background: var(--ga-primary-soft) !important; }
.gb-existing-gallery { grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 14px !important; }
.gb-existing-item { border-radius: 12px !important; box-shadow: var(--ga-shadow-xs) !important; cursor: grab; }
.gb-existing-item:active { cursor: grabbing; }
.gb-existing-item.main { border-color: var(--ga-primary) !important; box-shadow: 0 0 0 3px rgba(36,87,214,.12), var(--ga-shadow-sm) !important; }
.gb-remove-existing { background: rgba(13,27,61,.82) !important; color: #fff !important; border: 0 !important; }

/* Public page CTA/hero colour safety */
.gab-final-cta,.ga-contact-cta,[class*="hero"][style*="gradient"] { color:#fff; }
.gab-final-cta h1,.gab-final-cta h2,.gab-final-cta h3,.ga-contact-cta h1,.ga-contact-cta h2,.ga-contact-cta h3 { color:#fff !important; }
.gab-final-cta p,.ga-contact-cta p { color:rgba(255,255,255,.86) !important; }

/* Tables */
.ga-transactions-table,.geoarea-ui table { border: 1px solid var(--ga-border); border-radius: var(--ga-radius); overflow: hidden; background: #fff; }
.geoarea-ui table th { background: var(--ga-surface-2); color: var(--ga-text); }
.geoarea-ui table td,.geoarea-ui table th { border-color: var(--ga-border); }

/* Focus/accessibility */
:where(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid rgba(36,87,214,.32); outline-offset: 2px; }

@media (max-width: 1180px) {
  .ga-container { width: min(calc(100% - 30px), var(--ga-container)); }
  .gb-existing-gallery { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width: 900px) {
  .ga-section { padding: 42px 0; }
  .ga-account-panel { padding: 20px !important; }
  .gb-section { padding: 20px !important; }
  .gb-existing-gallery { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 640px) {
  .ga-container { width: min(calc(100% - 20px), var(--ga-container)); }
  .ga-section { padding: 34px 0; }
  .ga-section__head { align-items: flex-start; }
  .ga-section__head h2 { font-size: 24px; }
  .ga-account-panel { padding: 16px !important; border-radius: 14px !important; }
  .ga-button,.ga-green-btn,.gb-btn,.gb-submit { width: 100%; }
  .gb-section { padding: 16px !important; border-radius: 14px !important; }
  .gb-existing-gallery { gap: 9px !important; }
  .gab-hero .gab-hero-content h3 { font-size: 27px !important; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}

/* v20.3 header notification indicator */
.ga-header-notifications{position:relative;display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--ga-border,#dbe3ef);border-radius:50%;background:#fff;text-decoration:none;font-size:18px}
.ga-header-notifications b{position:absolute;top:-5px;right:-5px;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border:2px solid #fff;border-radius:999px;background:#dc2626;color:#fff;font-size:10px;line-height:1}

/* v20.4 — Edit gallery interaction hardening */
.gb-existing-gallery {
  user-select: none;
  touch-action: pan-y;
}
.gb-existing-item {
  cursor: grab !important;
  transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease, border-color .16s ease;
}
.gb-existing-item:active { cursor: grabbing !important; }
.gb-existing-item.dragging {
  opacity: .55 !important;
  transform: scale(.97) !important;
  box-shadow: 0 14px 32px rgba(15,23,42,.22) !important;
}
.gb-existing-item:focus-visible {
  outline: 3px solid rgba(37,99,235,.35) !important;
  outline-offset: 3px;
}
.gb-existing-item.main::before {
  content: "მთავარი";
  position: absolute;
  left: 9px;
  bottom: 9px;
  z-index: 4;
  padding: 5px 9px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
.gb-drag-handle {
  position: absolute;
  left: 9px;
  top: 9px;
  z-index: 4;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: rgba(15,23,42,.78);
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  letter-spacing: -3px;
  pointer-events: none;
}
.gb-remove-existing {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  width: 30px !important;
  height: 30px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(15,23,42,.86) !important;
  color: #fff !important;
  cursor: pointer !important;
}
.gb-remove-existing:hover { background: #dc2626 !important; }
.gb-gallery-help {
  margin: -6px 0 14px !important;
  color: #64748b !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* v20.4 — Edit gallery interaction hardening */
.gb-existing-gallery {
  user-select: none;
  touch-action: pan-y;
}
.gb-existing-item {
  cursor: grab !important;
  transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease, border-color .16s ease;
}
.gb-existing-item:active { cursor: grabbing !important; }
.gb-existing-item.dragging {
  opacity: .55 !important;
  transform: scale(.97) !important;
  box-shadow: 0 14px 32px rgba(15,23,42,.22) !important;
}
.gb-existing-item:focus-visible {
  outline: 3px solid rgba(37,99,235,.35) !important;
  outline-offset: 3px;
}
.gb-existing-item.main::before {
  content: "მთავარი";
  position: absolute;
  left: 9px;
  bottom: 9px;
  z-index: 4;
  padding: 5px 9px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
.gb-drag-handle {
  position: absolute;
  left: 9px;
  top: 9px;
  z-index: 4;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: rgba(15,23,42,.78);
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  letter-spacing: -3px;
  pointer-events: none;
}
.gb-remove-existing {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  width: 30px !important;
  height: 30px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(15,23,42,.86) !important;
  color: #fff !important;
  cursor: pointer !important;
}
.gb-remove-existing:hover { background: #dc2626 !important; }
.gb-gallery-help {
  margin: -6px 0 14px !important;
  color: #64748b !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}
