:root {
  --al-primary: #16a34a;
  --al-primary-hover: #15803d;
  --al-secondary: #7c3aed;
  --al-accent: #f97316;
  --al-text: #111827;
  --al-muted-text: #64748b;
  --al-background: #f8fafc;
  --al-surface: #ffffff;
  --al-border: #dbe4f0;
  --al-danger: #dc2626;
  --al-body-font: Inter, Arial, sans-serif;
  --al-display-font: Inter, Arial, sans-serif;
  --al-base-size: 16px;
  --al-heading-weight: 800;
  --al-radius: 8px;
  --al-button-radius: 8px;
  --al-border-width: 1px;
  --al-section-gap: 32px;
  --al-control-height: 44px;
}

html.al-config-ready body {
  color: var(--al-text);
  font-family: var(--al-body-font);
}

html.al-config-ready [data-al-component] {
  box-sizing: border-box;
  transition: outline-color 120ms ease;
}

#activitylock-builder-root,
[data-al-builder-root] {
  box-sizing: border-box;
  display: grid;
  gap: var(--al-section-gap);
  width: 100%;
  color: var(--al-text);
  font-family: var(--al-body-font);
}

[data-al-builder-mount-slot] {
  box-sizing: border-box;
  display: grid;
  gap: var(--al-section-gap);
  width: 100%;
  color: var(--al-text);
  font-family: var(--al-body-font);
}

.al-builder-node {
  box-sizing: border-box;
  min-width: 0;
  position: relative;
}

.al-builder-section,
.al-builder-container,
.al-builder-row,
.al-builder-column,
.al-builder-grid,
.al-builder-card,
.al-builder-banner,
.al-builder-pricingCard,
.al-builder-block {
  width: 100%;
}

.al-builder-row { display: flex; flex-direction: row; }
.al-builder-column { display: flex; flex-direction: column; }
.al-builder-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.al-builder-spacer { min-height: 32px; }
.al-builder-divider { width: 100%; border: 0; border-top: 1px solid var(--al-border); }
.al-builder-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--al-control-height);
  border-radius: var(--al-button-radius);
  text-decoration: none;
}
.al-builder-button:hover { background-color: var(--al-component-hover, inherit) !important; }
.al-builder-button:active { background-color: var(--al-component-pressed, var(--al-component-hover, inherit)) !important; }
.al-builder-button[aria-disabled="true"], .al-builder-button:disabled { background-color: var(--al-component-disabled, #94a3b8) !important; }
.al-builder-control-icon { display: inline-flex; margin-inline-end: 7px; line-height: 1; }
.al-builder-link,
.al-builder-navigationItem { color: var(--al-primary); }
.al-builder-image { display: block; max-width: 100%; }
.al-builder-image-media { display: block; width: 100%; max-width: 100%; height: auto; }
.al-builder-image-empty {
  min-height: 140px;
  border: 1px dashed var(--al-border);
  background: #f8fafc;
}
.al-builder-featureList { margin: 0; padding-left: 22px; }
.al-builder-pricing-label { display: block; margin-bottom: 10px; }

#activitylock-studio-component-adapters {
  position: fixed;
  inset: 0;
  z-index: 2147482000;
  pointer-events: none;
  overflow: visible;
}

.al-studio-component-proxy {
  position: absolute;
  left: var(--al-studio-region-left);
  top: var(--al-studio-region-top);
  width: var(--al-studio-region-width);
  height: var(--al-studio-region-height);
  min-width: 28px;
  min-height: 28px;
  box-sizing: border-box;
  pointer-events: none;
  color: inherit;
  background: transparent;
}

.al-studio-proxy-label {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 8px;
  opacity: 0;
  overflow: hidden;
  color: inherit;
  font: inherit;
  text-align: inherit;
  pointer-events: none;
}

.al-studio-component-proxy.al-studio-proxy-has-text .al-studio-proxy-label,
.al-studio-component-proxy.al-studio-inline-editing .al-studio-proxy-label {
  opacity: 1;
  color: var(--al-text, #111827);
  background: var(--al-surface, rgba(255,255,255,.96));
  border-radius: inherit;
  pointer-events: auto;
}

html.al-studio-preview[data-al-studio-mode="edit"] .al-studio-component-proxy {
  pointer-events: auto;
}

html.al-studio-preview[data-al-studio-mode="navigate"] #activitylock-studio-component-adapters {
  pointer-events: none;
  visibility: hidden;
}

html.al-studio-preview [data-al-component],
html.al-studio-preview [data-al-node] {
  cursor: pointer;
}

html.al-studio-preview[data-al-studio-mode="edit"] [data-al-component]:hover,
html.al-studio-preview[data-al-studio-mode="edit"] [data-al-node]:hover,
html.al-studio-preview [data-al-component].al-studio-selected,
html.al-studio-preview [data-al-node].al-studio-selected {
  outline: 3px solid #2563eb !important;
  outline-offset: 3px;
}

html.al-studio-preview [data-al-component][data-al-protected="true"]:hover {
  outline-color: #f97316 !important;
}

html.al-studio-preview[data-al-studio-mode="edit"] [data-al-node] {
  cursor: grab;
}

html.al-studio-preview[data-al-studio-mode="edit"] [data-al-node].al-studio-inline-editing {
  cursor: text;
  outline-color: #16a34a !important;
}

html.al-studio-preview .al-studio-dragging { opacity: .42 !important; }
html.al-studio-preview .al-studio-drop-target {
  outline: 4px solid #16a34a !important;
  outline-offset: -4px;
  background-image: linear-gradient(rgba(22, 163, 74, .08), rgba(22, 163, 74, .08));
}
html.al-studio-preview .al-studio-drop-invalid { outline: 4px dashed #dc2626 !important; }
html.al-studio-preview .al-studio-drop-before { box-shadow: inset 0 6px 0 #16a34a !important; }
html.al-studio-preview .al-studio-drop-after { box-shadow: inset 0 -6px 0 #16a34a !important; }

html.al-studio-preview[data-al-studio-mode="edit"] [data-al-builder-root]:empty {
  min-height: 78px;
  margin: 14px 0;
  border: 2px dashed #93c5fd;
  border-radius: 8px;
  background: rgba(239, 246, 255, .72);
}

html.al-studio-preview[data-al-studio-mode="edit"] [data-al-builder-root]:empty::before {
  content: 'Drop elements here';
  display: grid;
  place-items: center;
  min-height: 74px;
  color: #1d4ed8;
  font: 800 12px/1.3 Inter, Arial, sans-serif;
}

html.al-studio-preview[data-al-studio-mode="edit"] :is(
  .al-builder-section,
  .al-builder-container,
  .al-builder-row,
  .al-builder-column,
  .al-builder-grid,
  .al-builder-card,
  .al-builder-banner,
  .al-builder-pricingCard,
  .al-builder-block
):empty {
  display: grid;
  place-items: center;
  min-height: 72px;
  border: 2px dashed #86efac !important;
  background: rgba(240, 253, 244, .76) !important;
}

html.al-studio-preview[data-al-studio-mode="edit"] :is(
  .al-builder-section,
  .al-builder-container,
  .al-builder-row,
  .al-builder-column,
  .al-builder-grid,
  .al-builder-card,
  .al-builder-banner,
  .al-builder-pricingCard,
  .al-builder-block
):empty::before {
  content: 'Empty container - drop an element inside';
  color: #166534;
  font: 800 11px/1.35 Inter, Arial, sans-serif;
}

.al-studio-hover-overlay {
  position: absolute;
  z-index: 2147482998;
  pointer-events: none;
  border: 2px dashed #60a5fa;
}
.al-studio-hover-overlay > span {
  position: absolute;
  left: -2px;
  bottom: calc(100% + 2px);
  padding: 3px 6px;
  border-radius: 4px 4px 0 0;
  color: #fff;
  background: #2563eb;
  font: 700 10px/1.2 Inter, Arial, sans-serif;
  white-space: nowrap;
}
.al-studio-alignment-guide {
  position: absolute;
  z-index: 2147482999;
  pointer-events: none;
  background: #ec4899;
  box-shadow: 0 0 0 1px rgba(255,255,255,.65);
}
.al-studio-alignment-guide.horizontal { left: 0; right: 0; height: 1px; }
.al-studio-alignment-guide.vertical { top: 0; bottom: 0; width: 1px; }

.al-studio-selection-overlay {
  position: absolute;
  z-index: 2147483000;
  pointer-events: none;
  border: 2px solid #2563eb;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .78);
}

.al-studio-selection-overlay.is-protected { border-color: #f97316; }
.al-studio-element-label {
  position: absolute;
  left: -2px;
  bottom: calc(100% + 2px);
  max-width: 240px;
  overflow: hidden;
  padding: 4px 7px;
  border-radius: 5px 5px 0 0;
  color: #fff;
  background: #2563eb;
  font: 700 11px/1.2 Inter, Arial, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.al-studio-selection-overlay.is-protected .al-studio-element-label { background: #f97316; }
.al-studio-floating-toolbar {
  position: absolute;
  top: -42px;
  right: -2px;
  display: flex;
  gap: 2px;
  max-width: min(560px, 92vw);
  padding: 4px;
  border: 1px solid #334155;
  border-radius: 7px;
  background: #0f172a;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .28);
  pointer-events: auto;
}
.al-studio-floating-toolbar button {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 5px;
  color: #fff;
  background: transparent;
  cursor: pointer;
  font: 800 11px/1 Inter, Arial, sans-serif;
}
.al-studio-floating-toolbar button:hover { background: #334155; }
.al-studio-floating-toolbar button:disabled { opacity: .3; cursor: not-allowed; }
.al-studio-floating-toolbar .al-studio-move-handle { width: 44px; color: #bfdbfe; background: #1e3a8a; cursor: grab; font-size: 18px; touch-action: none; }
.al-studio-floating-toolbar .al-studio-move-handle:active,
.al-studio-selection-overlay.is-moving .al-studio-move-handle { cursor: grabbing; background: #166534; }
.al-studio-selection-overlay.is-moving { pointer-events: none; border-color: #16a34a; }
.al-studio-selection-overlay.is-moving .al-studio-floating-toolbar { pointer-events: auto; }
.al-studio-resize-handle {
  position: absolute;
  width: 10px;
  height: 10px;
  border: 2px solid #2563eb;
  border-radius: 50%;
  background: #fff;
  pointer-events: auto;
}
.al-studio-resize-nw { left: -6px; top: -6px; cursor: nwse-resize; }
.al-studio-resize-n { left: calc(50% - 5px); top: -6px; cursor: ns-resize; }
.al-studio-resize-ne { right: -6px; top: -6px; cursor: nesw-resize; }
.al-studio-resize-e { right: -6px; top: calc(50% - 5px); cursor: ew-resize; }
.al-studio-resize-se { right: -6px; bottom: -6px; cursor: nwse-resize; }
.al-studio-resize-s { left: calc(50% - 5px); bottom: -6px; cursor: ns-resize; }
.al-studio-resize-sw { left: -6px; bottom: -6px; cursor: nesw-resize; }
.al-studio-resize-w { left: -6px; top: calc(50% - 5px); cursor: ew-resize; }

@media (max-width: 1024px) {
  .al-builder-row { flex-wrap: wrap; }
}