:root {
  --samsung-blue: #034EA2;
  --dark-blue: #012e6b;
  --light-gray: #f4f4f4;
  --accent-blue: #0066cc;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background-color: var(--light-gray);
  color: #111;
  line-height: 1.6;
}

/* Navigation Bar */
.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: var(--samsung-blue);
    padding: 1rem 2rem;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.navbar .logo {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.logo-img {
    height: 60px;
    width: auto;
}

    .navbar .menu {
      display: flex;
      gap: 2rem;
    }

        .navbar .menu a {
          color: white;
          text-decoration: none;
          font-weight: 500;
          font-size: 1rem;
          transition: all 0.3s ease;
          padding: 0.5rem 1rem;
          border-radius: 5px;
        }

            .navbar .menu a:hover {
              background-color: rgba(255,255,255,0.1);
              color: #cce4ff;
            }
.navbar-brand {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Dense workspace layout for administration screens. */
.admin-page {
  max-width: 1400px;
}

.admin-page .card {
  padding: 0;
  border-radius: 10px;
}

.admin-page .card:hover {
  transform: none;
}

.admin-page .card-body {
  padding: 1.25rem;
}

.admin-page .card-header {
  padding: 0.75rem 1.25rem;
}

.admin-page .mb-4 {
  margin-bottom: 1rem !important;
}

.admin-page .table {
  margin-bottom: 0;
}

.admin-membership-actions {
  display: inline-flex;
  flex-direction: column;
  gap: 0.25rem;
}

.admin-membership-action {
  width: 6.25rem;
  min-height: 2rem;
  white-space: nowrap;
}

.widget-type-symbol {
  display: inline-block;
  margin-left: 0.15em;
  color: var(--accent-blue, #0d6efd);
  font-size: 0.9em;
  font-weight: 700;
  line-height: 1;
}

.admin-widget {
  scroll-margin-top: 9rem;
}

.admin-tabs-ready .admin-widget:not(.is-active) {
  display: none;
}

.admin-quick-links {
  position: sticky;
  top: 76px;
  z-index: 990;
  display: flex;
  gap: 0.4rem;
  padding: 0.55rem;
  overflow-x: auto;
  white-space: nowrap;
  background: rgba(244, 244, 244, 0.97);
  border: 1px solid #d9e2ec;
  border-radius: 8px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.08);
  backdrop-filter: blur(8px);
}

.admin-quick-link {
  flex: 0 0 auto;
  padding: 0.45rem 0.75rem;
  color: var(--dark-blue);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
}

.admin-quick-link:hover,
.admin-quick-link:focus {
  color: var(--accent-blue);
  border-color: var(--accent-blue);
  background: #f7fbff;
}

.admin-quick-link.active {
  color: #fff;
  background: var(--samsung-blue);
  border-color: var(--samsung-blue);
}

@media (max-width: 767.98px) {
  .admin-quick-links {
    top: 72px;
  }
}
@media (min-width: 768px) {
  .navbar {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .navbar .nav-link {
    font-size: 0.95rem;
    white-space: nowrap;
  }
}

/* Hero Section */
.full-width-hero {
  background: linear-gradient(135deg, var(--samsung-blue) 0%, var(--dark-blue) 100%);
  color: white;
  padding: 5rem 2rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.full-width-hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url('index_bg.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0.15;
  z-index: 1;
}

.hero-content {
  max-width: 800px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.hero-image {
  position: absolute;
  right: 5%;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.2;
  z-index: 1;
}

.hero-image img {
  width: 400px;
  height: auto;
}

.full-width-hero h1 {
  font-size: 3.5rem;
  margin-bottom: 1rem;
  font-weight: 700;
  letter-spacing: -1px;
}

.full-width-hero .tagline {
  font-size: 1.4rem;
  color: #e0e0e0;
  margin-bottom: 2rem;
  font-weight: 300;
}

.cta-button {
    display: inline-block;
    background-color: white;
    color: var(--samsung-blue);
    padding: 1rem 2rem;
    text-decoration: none;
    border-radius: 50px;
    font-weight: 600;
    transition: all 0.3s ease;
    margin-top: 1rem;
    pointer-events: auto;
    opacity: 1;
    position: relative;
    z-index: 10;
}

.cta-button:hover {
  background-color: #f0f0f0;
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.section {
  padding: 4rem 2rem;
  max-width: 1200px;
  margin: auto;
}

.section h2 {
  font-size: 2.5rem;
  margin-bottom: 2rem;
  color: var(--samsung-blue);
  text-align: left;
  font-weight: 700;
}

.section p {
  font-size: 1.1rem;
  text-align: left;
  max-width: 800px;
  margin: 0 auto 2rem;
  color: #555;
}

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
  margin-top: 3rem;
}

.card {
  background: white;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0,0,0,0.08);
  padding: 2.5rem;
  transition: all 0.3s ease;
  border: 1px solid #e0e0e0;
  animation: fadeInUp 0.6s ease forwards;
}

.card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

.card-icon {
  width: 50px;
  height: 50px;
  background: var(--samsung-blue);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
}

.card-icon::before {
  content: "\26A1";
  color: white;
  font-size: 1.5rem;
}

.card:nth-child(1) .card-icon::before { content: "\1F4BB"; }
.card:nth-child(2) .card-icon::before { content: "\2601"; }
.card:nth-child(3) .card-icon::before { content: "\1F916"; }
.card:nth-child(4) .card-icon::before { content: "\2699"; }

.card h3 {
  margin-bottom: 1rem;
  color: var(--dark-blue);
  font-size: 1.3rem;
  font-weight: 600;
}

.card p {
  color: #666;
  text-align: left;
  margin: 0;
  font-size: 1rem;
}

.card i {
    transition: transform 0.3s ease;
}

.card:hover i {
    transform: scale(1.2);
}

/* Contact Section */
#contact {
  background: white;
  border-radius: 20px;
  margin: 2rem auto;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.contact-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}

.contact-item {
  text-align: center;
  padding: 1rem;
}

.contact-item a {
  color: var(--samsung-blue);
  text-decoration: none;
  font-weight: 500;
}

.contact-item a:hover {
  text-decoration: underline;
}

footer {
  background: var(--samsung-blue);
  color: #e0e0e0;
  text-align: center;
  padding: 2rem 1rem;
  margin-top: 3rem;
}

/* Responsive Design */
@media (max-width: 767.98px) {
  .navbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
  }

  .navbar .menu {
    gap: 1rem;
    align-self: flex-start;
  }

  .full-width-hero h1 {
    font-size: 2.5rem;
  }

  .full-width-hero .tagline {
    font-size: 1.2rem;
  }



  .section {
    padding: 2rem 1rem;
  }

  .section h2 {
    font-size: 2rem;
  }
}

/* Animation */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Agent Designer */
.client-dashboard-page { max-width: 1600px; margin-inline: auto; }
.client-dashboard-shell { padding: 1em; border-radius: 10px; }
.client-dashboard-shell:hover,
.client-dashboard-tile:hover { transform: none; }
.client-dashboard-tile {
    display: flex;
    flex-direction: column;
    padding: .85em;
    border-radius: 8px;
}
.client-dashboard-tile .card-text { line-height: 1.35; }
.client-dashboard-tile .btn { padding-block: .3rem; }

.agent-library-page { display: grid; grid-template-columns: 230px minmax(0, 1fr); min-height: 100%; background: #f7f8fb; }
.agent-library-sidebar { background: linear-gradient(180deg, #352073, #59306e); color: #fff; padding: 1.15rem .8rem; }
.agent-library-sidebar-heading { display: flex; align-items: center; gap: .55rem; font-size: 1.15rem; font-weight: 700; padding: 0 .35rem .9rem; }
.agent-library-mark { display: grid; place-items: center; width: 1.85rem; height: 1.85rem; border-radius: .5rem; background: rgba(255,255,255,.16); }
.agent-library-filter-form .form-control { border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.12); color: #fff; }
.agent-library-filter-form .form-control::placeholder { color: rgba(255,255,255,.72); }
.agent-library-nav { display: grid; gap: .25rem; }
.agent-library-nav-item { display: flex; align-items: center; gap: .6rem; width: 100%; border: 0; border-radius: .4rem; padding: .5rem .6rem; background: transparent; color: rgba(255,255,255,.82); text-align: left; }
.agent-library-nav-item:hover, .agent-library-nav-item.active { background: #f5eaff; color: #352073; }
.agent-library-main { min-width: 0; padding: 1.15rem 1.25rem 1.75rem; }
.agent-library-header { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.agent-library-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 1rem; border-bottom: 1px solid #dfe3ea; margin-bottom: .9rem; }
.agent-library-tabs { display: flex; gap: .2rem; overflow-x: auto; }
.agent-library-tab { color: #5b6170; text-decoration: none; padding: .5rem .65rem .45rem; border-bottom: 3px solid transparent; white-space: nowrap; }
.agent-library-tab:hover, .agent-library-tab.active { color: #0d6efd; border-bottom-color: #0d6efd; }
.agent-library-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(175px, 210px)); gap: .55rem; }
.agent-library-card { display: flex; flex-direction: column; min-height: 145px; overflow: hidden; border: 1px solid #dde1e7; border-radius: .6rem; background: #fff; box-shadow: 0 2px 7px rgba(38,45,59,.05); }
.agent-card-visual { display: flex; align-items: center; justify-content: space-between; min-height: 42px; padding: .4rem .55rem; color: #fff; background: linear-gradient(135deg, #1267da, #50b8eb); }
.agent-card-visual.source-shared { background: linear-gradient(135deg, #5530a1, #9367da); }
.agent-card-visual.source-native { background: linear-gradient(135deg, #073f8c, #1575d1); }
.agent-card-visual.source-marketplace { background: linear-gradient(135deg, #087a79, #3dbb9f); }
.agent-card-icon { font-size: 1.1rem; line-height: 1; }
.agent-source-label { font-size: .58rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.agent-card-content { display: flex; flex: 1; flex-direction: column; padding: .5rem .55rem; }
.agent-card-content h2 { font-size: .82rem; line-height: 1.2; margin: 0; }
.agent-card-provider { color: #6c757d; font-size: .66rem; }
.agent-card-description { display: -webkit-box; overflow: hidden; margin-bottom: .2rem; color: #555e69; font-size: .72rem; line-height: 1.25; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.agent-card-content .btn { --bs-btn-padding-y: .2rem; --bs-btn-padding-x: .4rem; --bs-btn-font-size: .72rem; }
.agent-status { flex: 0 0 auto; border-radius: 1rem; padding: .12rem .3rem; background: #e9f7ef; color: #187344; font-size: .55rem; font-weight: 700; }
.agent-status:not(.status-published) { background: #eef0f3; color: #626974; }
.agent-library-card.is-disabled { background: #f1f2f4; border-color: #d4d6da; box-shadow: none; }
.agent-library-card.is-disabled .agent-card-visual { filter: grayscale(1); opacity: .62; }
.agent-library-card.is-disabled .agent-card-content { color: #777; }
.agent-library-empty { padding: 3rem 1rem; border: 1px dashed #cbd0d8; border-radius: .75rem; background: #fff; text-align: center; }

@media (max-width: 767.98px) {
    .agent-library-page { grid-template-columns: 1fr; }
    .agent-library-sidebar { padding: .8rem; }
    .agent-library-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .agent-library-main { padding: .9rem; }
}

.workflow-page { display: grid; grid-template-columns: 230px minmax(0, 1fr); height: 100%; min-height: 620px; background: #f7f8fb; }
.workflow-page.workflow-sidebar-collapsed { grid-template-columns: 48px minmax(0, 1fr); }
.workflow-library-panel { overflow-y: auto; padding: 1.15rem .8rem; color: #fff; background: linear-gradient(180deg, #352073, #59306e); }
.workflow-sidebar-top { margin: -.35rem -.1rem .65rem; padding: .35rem .25rem .8rem; border-bottom: 1px solid rgba(255,255,255,.2); }
.workflow-sidebar-toggle { display: inline-grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; padding: 0; border-color: rgba(255,255,255,.65); color: #fff; font-size: 1.2rem; line-height: 1; }
.workflow-sidebar-toggle:hover { background: #fff; color: #352073; }
.workflow-page.workflow-sidebar-collapsed .workflow-sidebar-toggle .chevron-left { transform: rotate(-45deg); }
.workflow-page.workflow-sidebar-collapsed .workflow-library-panel { overflow: hidden; padding-inline: .4rem; }
.workflow-page.workflow-sidebar-collapsed .workflow-library-panel > :not(.workflow-sidebar-top) { display: none; }
.workflow-page.workflow-sidebar-collapsed .workflow-sidebar-top { justify-content: center !important; margin: 0; padding: .25rem 0; border-bottom: 0; }
.workflow-page.workflow-sidebar-collapsed .workflow-sidebar-heading { display: none; }
.workflow-sidebar-heading { display: flex; align-items: center; gap: .55rem; color: #fff; font-size: 1.15rem; font-weight: 700; }
.workflow-library-panel > .d-flex .btn { border-color: rgba(255,255,255,.7); color: #fff; }
.workflow-library-panel > .d-flex .btn:hover { border-color: #fff; background: #fff; color: #352073; }
.workflow-library-panel .form-label { color: rgba(255,255,255,.82); }
.workflow-library-panel .form-select { border-color: rgba(255,255,255,.32); background-color: rgba(255,255,255,.12); color: #fff; }
.workflow-library-panel .form-select option { color: #212529; background: #fff; }
.workflow-list { display: grid; gap: .25rem; }
.workflow-section-label { margin: .85rem .55rem .35rem; color: rgba(255,255,255,.65); font-size: .65rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.workflow-list-group { margin-bottom: .65rem; }
.workflow-list-group h3 { margin: 0 .45rem .2rem; color: rgba(255,255,255,.8); font-size: .66rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.workflow-list-help { margin: 0 .45rem .25rem; color: rgba(255,255,255,.62); font-size: .58rem; line-height: 1.25; }
.workflow-draft-separator { height: 1px; margin: .8rem .45rem; background: rgba(255,255,255,.22); }
.workflow-drafts { padding: .32rem 0 .15rem; }
.workflow-list-item { display: grid; gap: .12rem; padding: .45rem .55rem; border-left: 3px solid rgba(255,255,255,.38); border-radius: .35rem; background: rgba(255,255,255,.08); color: #fff; text-decoration: none; }
.workflow-list-item strong { font-size: .88rem; font-weight: 600; line-height: 1.25; }
.workflow-list-item span { color: rgba(255,255,255,.65); font-size: .59rem; line-height: 1.2; }
.workflow-list-item:hover, .workflow-list-item.active { border-left-color: #9b80f3; background: #f5eaff; color: #352073; }
.workflow-list-item:hover span, .workflow-list-item.active span { color: #6c5577; }
.workflow-library-panel .text-muted { color: rgba(255,255,255,.68) !important; }
.workflow-workspace { display: flex; min-width: 0; flex-direction: column; padding: 1.15rem 1.25rem 1.75rem; }
.workflow-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .65rem; }
.workflow-save-group { display: flex; align-items: center; gap: .65rem; }
.workflow-metadata { display: grid; grid-template-columns: minmax(180px, .65fr) minmax(260px, 1.35fr) auto; align-items: end; gap: .65rem; padding: .7rem .8rem; border: 1px solid #dde1e7; border-radius: .8rem .8rem 0 0; background: #fff; box-shadow: 0 2px 7px rgba(38,45,59,.05); }
.workflow-metadata .form-label { margin-bottom: .2rem; }
.workflow-builder { display: flex; min-height: 460px; flex: 1; flex-direction: column; overflow: hidden; border: 1px solid #dde1e7; border-top: 0; border-radius: 0 0 .8rem .8rem; background: #fff; box-shadow: 0 2px 7px rgba(38,45,59,.05); }
.workflow-toolbar { display: flex; align-items: center; gap: .3rem; min-height: 45px; padding: .3rem .5rem; border-bottom: 1px solid #dde1e7; background: #fff; }
.workflow-toolbar-label { color: #495057; font-size: .65rem; font-weight: 700; }
.workflow-toolbar-status { overflow: hidden; max-width: min(28vw, 230px); color: #6c757d; font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.workflow-toolbar-status:empty { display: none; }
.workflow-help-button { font-weight: 700; }
.workflow-icon-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.workflow-tool-hover { display: inline-flex; width: 29px; height: 29px; flex: 0 0 29px; }
.workflow-tool-hover > .workflow-icon-button:disabled { pointer-events: none; }
.workflow-zoom-value { display: inline-flex; min-width: 34px; height: 29px; align-items: center; justify-content: center; color: #495057; font-size: .68rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.workflow-icon-button { position: relative; display: inline-flex; width: 29px; height: 29px; flex: 0 0 29px; align-items: center; justify-content: center; padding: 0; font-size: .88rem; line-height: 1; text-align: center; }
.workflow-icon-button > span { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.workflow-icon-button svg { position: absolute; left: 50%; top: 50%; display: block; width: 18px; height: 18px; transform: translate(-50%, -50%); fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.workflow-page.workflow-properties-hidden #toggle-workflow-properties svg { transform: translate(-50%, -50%) scaleX(-1); }
.workflow-toolbar-divider { align-self: stretch; width: 1px; margin: 0 .25rem; background: #dfe3e8; }
.workflow-editor-grid { display: grid; min-height: 0; flex: 1; grid-template-columns: minmax(0, 1fr) 205px; }
.workflow-page.workflow-properties-hidden .workflow-editor-grid { grid-template-columns: minmax(0, 1fr) 38px; }
.workflow-page.workflow-properties-hidden .workflow-properties { overflow: hidden; padding: .35rem; }
.workflow-page.workflow-properties-hidden .workflow-properties > :not(.workflow-properties-header) { display: none !important; }
.workflow-page.workflow-properties-hidden .workflow-properties-header { justify-content: center; margin: 0; }
.workflow-page.workflow-properties-hidden .workflow-properties-header h2 { display: none; }
.workflow-page.workflow-properties-hidden .workflow-properties-collapse .chevron-right { transform: rotate(135deg); }
.workflow-canvas-shell { display: grid; min-width: 0; min-height: 0; grid-template-columns: 17px minmax(0, 1fr); grid-template-rows: 17px minmax(0, 1fr); }
.workflow-scrollbar-top { grid-column: 2; grid-row: 1; min-width: 0; overflow-x: scroll; overflow-y: hidden; border-bottom: 1px solid #dde1e7; background: #f8faff; scrollbar-width: thin; }
.workflow-scrollbar-top-track { width: 2000px; height: 1px; }
.workflow-scrollbar-left { grid-column: 1; grid-row: 2; min-height: 0; overflow-x: hidden; overflow-y: scroll; border-right: 1px solid #dde1e7; background: #f8faff; scrollbar-width: thin; }
.workflow-scrollbar-left-track { width: 1px; height: 1000px; }
.workflow-canvas { position: relative; grid-column: 2; grid-row: 2; min-width: 0; min-height: 430px; overflow: auto; outline: none; background-color: #f8faff; background-image: radial-gradient(#c5d4e8 1px, transparent 1px); background-size: var(--workflow-grid-size, 20px) var(--workflow-grid-size, 20px); }
.workflow-stage { position: relative; width: 2000px; height: 1000px; }
.workflow-scene { position: absolute; left: 0; top: 0; width: 2000px; height: 1000px; transform-origin: top left; }
.workflow-edges, .workflow-nodes { position: absolute; inset: 0; width: 2000px; height: 1000px; }
.workflow-edges { pointer-events: auto; }
.workflow-nodes { pointer-events: none; }
.workflow-edge { fill: none; stroke: #667085; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.workflow-edge.selected { stroke: #0d6efd; stroke-width: 3; }
.workflow-edge-hit { fill: none; stroke: transparent; stroke-width: 14; pointer-events: stroke; cursor: pointer; }
.workflow-edge-preview { fill: none; stroke: #0d6efd; stroke-width: 2; stroke-dasharray: 6 4; pointer-events: none; }
.workflow-route-handle { fill: #fff; stroke: #0d6efd; stroke-width: 3; pointer-events: all; cursor: move; }
.workflow-edge.workflow-test-active { stroke: #0d6efd; stroke-width: 4; stroke-dasharray: 10 7; animation: workflow-wire-flow .45s linear infinite; }
.workflow-edge.workflow-test-complete { stroke: #198754; stroke-width: 3; }
.workflow-node { position: absolute; display: flex; width: 142px; min-height: 64px; flex-direction: column; justify-content: center; border: 2px solid #4384e6; border-radius: .55rem; padding: .35rem .5rem; background: #fff; color: #263448; text-align: left; box-shadow: 0 3px 8px rgba(26,45,73,.12); cursor: grab; touch-action: none; pointer-events: auto; }
.workflow-node:active { cursor: grabbing; }
.workflow-node.selected { outline: 3px solid rgba(13,110,253,.24); border-color: #0d6efd; }
.workflow-node.workflow-test-active { z-index: 3; border-color: #0d6efd; background: #eaf3ff; box-shadow: 0 0 0 5px rgba(13,110,253,.18), 0 4px 14px rgba(13,110,253,.3); animation: workflow-node-pulse .7s ease-in-out infinite alternate; }
.workflow-node.workflow-test-complete { border-color: #198754; background: #eefaf3; box-shadow: 0 0 0 3px rgba(25,135,84,.12); }
.workflow-node-type { color: #6c757d; font-size: .55rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.workflow-node strong { overflow: hidden; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.workflow-node-agent { color: #7b8490; font-size: .58rem; }
.workflow-port { position: absolute; top: 50%; width: 13px; height: 13px; border: 2px solid #fff; border-radius: 50%; background: #0d6efd; box-shadow: 0 0 0 1px #0b5ed7; transform: translateY(-50%); z-index: 2; }
.workflow-port-input { left: -8px; cursor: crosshair; }
.workflow-port-output { right: -8px; cursor: grab; }
.workflow-port-output:active { cursor: grabbing; }
.workflow-node.node-start .workflow-port-input,
.workflow-node.node-end .workflow-port-output { display: none; }
.workflow-node.node-start, .workflow-node.node-end { border-radius: 2rem; border-color: #268a62; background: #effaf5; }
.workflow-node.node-decision { border-color: #d38a16; background: #fff8ea; }
.workflow-node.node-timer { border-color: #d17b0f; background: #fff6e5; }
.workflow-node.node-web_session { border-color: #087f8c; background: #edfafa; }
.workflow-node.node-merge { border-color: #7652c7; background: #f7f2ff; }
.workflow-properties { padding: .75rem; border-left: 1px solid #dde1e7; background: #fff; }
.workflow-properties-header { display: flex; align-items: center; justify-content: space-between; gap: .4rem; margin-bottom: .55rem; }
.workflow-properties-collapse { display: inline-grid; width: 25px; height: 25px; flex: 0 0 25px; place-items: center; padding: 0; }
.chevron-right { transform: rotate(-45deg); }
.workflow-agent-placeholder { padding: .55rem; border: 1px dashed #c9ced6; border-radius: .45rem; background: #f7f8fa; }
.workflow-timer-properties { padding: .5rem; border: 1px solid #f0cf9b; border-radius: .45rem; background: #fff9ee; }
.workflow-print-heading { display: none; }

@keyframes workflow-wire-flow { to { stroke-dashoffset: -17; } }
@keyframes workflow-node-pulse { from { transform: scale(1); } to { transform: scale(1.025); } }
@media (prefers-reduced-motion: reduce) {
    .workflow-edge.workflow-test-active,
    .workflow-node.workflow-test-active { animation: none; }
}

@page workflow-landscape { size: landscape; margin: .35in; }
@media print {
    .workflow-designer-body { page: workflow-landscape; }
    body { background: #fff !important; }
    .navbar, footer, .workflow-library-panel, .workflow-header,
    .workflow-metadata, .workflow-toolbar, .workflow-properties, .workflow-scrollbar-top, .workflow-scrollbar-left { display: none !important; }
    .site-scroll-region, .workflow-page, .workflow-workspace,
    .workflow-builder, .workflow-editor-grid, .workflow-canvas-shell { display: block !important; width: auto !important; height: auto !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; margin: 0 !important; border: 0 !important; box-shadow: none !important; background: #fff !important; }
    .workflow-print-heading { display: block; margin: 0 0 .18in; color: #173b70; font-size: 16pt; font-weight: 700; }
    .workflow-canvas { width: 2000px !important; height: 1000px !important; min-height: 0 !important; overflow: visible !important; zoom: var(--workflow-print-scale, .48); print-color-adjust: exact; -webkit-print-color-adjust: exact; }
    .workflow-stage { width: 2000px !important; height: 1000px !important; }
    .workflow-scene { transform: none !important; }
    .workflow-node { break-inside: avoid; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

@media (max-width: 900px) {
    .workflow-page { grid-template-columns: 1fr; height: auto; }
    .workflow-page.workflow-sidebar-collapsed { grid-template-columns: 1fr; }
    .workflow-page.workflow-sidebar-collapsed .workflow-library-panel { max-height: 48px; }
    .workflow-library-panel { max-height: 165px; border-right: 0; border-bottom: 1px solid #dfe3e8; }
    .workflow-metadata { grid-template-columns: 1fr; }
    .workflow-editor-grid { grid-template-columns: minmax(0, 1fr); }
    .workflow-properties { border-top: 1px solid #dfe3e8; border-left: 0; }
    .workflow-page.workflow-properties-hidden .workflow-editor-grid { grid-template-columns: minmax(0, 1fr) 38px; }
    .workflow-page.workflow-properties-hidden .workflow-properties { grid-column: 2; grid-row: 1; border-top: 0; border-left: 1px solid #dde1e7; }
    .workflow-toolbar { flex-wrap: wrap; }
    #connect-help { max-width: min(65vw, 260px); }
}

@media (max-width: 575.98px) {
    .client-dashboard-page { padding-block: .75rem !important; }
    .client-dashboard-shell { padding: .75em; }
    .client-dashboard-tile { padding: .75em; }
}

.agent-toolbar-card { padding: 0; }
.agent-toolbar-card .card-body { padding: 1em; }
.agent-designer-layout {
    display: flex;
    gap: .75rem;
    align-items: start;
}
.agent-workspace { flex: 1 1 auto; min-width: 0; }
.agent-catalog {
    position: relative;
    flex: 0 0 auto;
    width: 260px;
    min-width: 200px;
    max-width: 480px;
    top: auto;
    max-height: calc(100vh - 6rem);
    padding: 0;
    overflow: hidden;
    border-radius: 9px;
}
.agent-catalog:hover { transform: none; }
.agent-catalog-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .5rem;
    padding: .55rem .6rem;
    border-bottom: 1px solid #e8edf2;
}
.agent-catalog-content { padding: .5rem; overflow-y: auto; overflow-x: hidden; }
.agent-catalog-search { position: relative; }
.agent-catalog-search-icon {
    position: absolute;
    top: 50%;
    left: .55rem;
    z-index: 2;
    transform: translateY(-50%);
    color: #6c757d;
    font-size: .82rem;
    pointer-events: none;
}
.agent-catalog-search .form-control { padding-left: 1.8rem; }
.agent-catalog-list { display: grid; gap: .2rem; }
.agent-catalog-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .4rem;
    padding: .32rem .45rem;
    color: #263238;
    text-decoration: none;
    border-radius: 6px;
}
.agent-catalog-item:hover { background: #eef5ff; color: var(--bs-primary); }
.agent-catalog-item.active { color: var(--bs-primary); background: transparent; font-weight: 600; }

/* Agent tests stay in a dedicated, scrollable result surface so long output
   never forces the Agent Designer workspace to reload or grow indefinitely. */
.agent-test-modal-body {
    min-height: 0;
    overflow: auto;
    background: #f8faff;
}
.agent-test-result { background: #fff; }
.agent-test-value { white-space: pre-wrap; overflow-wrap: anywhere; }
.agent-test-json { max-height: min(60vh, 650px); overflow: auto; white-space: pre-wrap; }
.agent-test-modal-body .table-responsive { max-height: 48vh; overflow: auto; }
.agent-test-modal-body .table-responsive thead th { position: sticky; top: 0; z-index: 1; background: #f2f6fc; }
.agent-catalog-item.active::after {
    content: "\2190";
    flex: 0 0 auto;
    margin-left: auto;
    color: var(--bs-primary);
    font-size: 1rem;
    line-height: 1.25;
    transform: scaleX(1.4) scaleY(.75);
    transform-origin: center;
}
.agent-catalog-item .badge { font-size: .62rem; }
.agent-catalog-item-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-catalog-resizer {
    position: absolute;
    z-index: 3;
    top: 0;
    right: 0;
    bottom: 0;
    width: 8px;
    cursor: ew-resize;
    touch-action: none;
}
.agent-catalog-resizer::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 4px;
    width: 1px;
    background: transparent;
}
.agent-catalog-resizer:hover::after,
.agent-catalog-resizer:focus::after { background: var(--bs-primary); }
.catalog-collapsed .agent-catalog { width: 48px !important; min-width: 48px; }
.catalog-collapsed .agent-catalog-resizer { display: none; }
.catalog-collapsed .agent-catalog-content,
.catalog-collapsed .agent-catalog-label { display: none; }
.catalog-collapsed .agent-catalog-header { justify-content: center; padding: .45em; border-bottom: 0; }
.agent-catalog-toggle,
.agent-catalog-expand,
.agent-summary-toggle {
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 32px;
    padding: 0;
}
.chevron-icon {
    display: block;
    width: 10px;
    height: 10px;
    border-right: 2.5px solid currentColor;
    border-bottom: 2.5px solid currentColor;
    transition: transform .15s ease;
}
.chevron-left { transform: rotate(135deg); }
.catalog-collapsed .chevron-left { transform: rotate(-45deg); }
.agent-designer-page .catalog-collapsed .agent-catalog-expand {
    display: inline-grid !important;
    flex: 0 0 32px;
    border-color: rgba(255,255,255,.75);
    color: #fff;
}
.agent-designer-page .catalog-collapsed .agent-catalog-expand:hover {
    border-color: #fff;
    background: #fff;
    color: #352073;
}
.catalog-collapsed .agent-catalog-open { display: inline-block !important; }
.agent-listing-description { width: 100%; max-width: none; }
.agent-listing-summary { padding-top: .15rem; }
.agent-toolbar-actions { padding-top: .15rem; }
.agent-toolbar-card .card-body { padding: .6rem .75rem; }
.agent-toolbar-card #agent_summary_details > p,
.agent-toolbar-card .agent-toolbar-actions { margin-top: .35rem !important; }
.chevron-down { transform: rotate(-135deg); }
.agent-summary-toggle.collapsed .chevron-down { transform: rotate(45deg); }
.agent-designer-page[aria-busy="true"] { opacity: .65; pointer-events: none; }
.agent-config-panel { width: min(760px, 94vw) !important; }
.agent-config-panel .offcanvas-header,
.agent-config-panel .offcanvas-body { padding: 1em; }
.agent-flow-grid {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 42px minmax(220px, .72fr) 42px minmax(260px, 1fr);
    align-items: start;
}
.agent-flow-grid-four {
    grid-template-columns: minmax(210px, 1fr) 26px minmax(155px, .58fr) 26px minmax(165px, .62fr) 26px minmax(210px, 1fr);
}
.agent-stage { border: 0; min-width: 0; height: auto; padding: 0; }
.agent-stage .card-header { padding: .55rem .65rem; }
.agent-stage .card-body { padding: .55rem .65rem; }
.agent-stage .card-header .h5 { font-size: 1rem; }
.agent-blackbox .card-body { min-height: 0; }
.agent-blackbox h3 { font-size: .95rem; margin-bottom: .4rem !important; }
.agent-stage-number {
    display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem;
    margin-right: .3rem; border-radius: 50%; color: white; background: var(--bs-primary);
    font-weight: 700; font-size: .75rem;
}
.agent-connector { display: grid; place-items: center; height: 54px; color: var(--bs-primary); font-size: 1.5rem; }
.agent-output-placeholder { color: #6c757d; padding: .4rem; border: 1px dashed #b8c2cc; border-radius: .4rem; }
.agent-output-placeholder p { margin-bottom: .3rem !important; }
.agent-result { padding: .5rem; border-left: 3px solid #19c3e6; background: #f7fafc; border-radius: 0 .4rem .4rem 0; }
.agent-result-value { white-space: pre-wrap; }
.agent-designer-page { min-height: 100%; background: #f7f8fb; }
.agent-designer-page .agent-designer-layout { min-height: 100%; gap: 0; align-items: stretch; border: 0; border-radius: 0; background: #f7f8fb; box-shadow: none; }
.agent-designer-page .agent-catalog { width: 230px; min-height: 100%; max-height: none; padding: 1.15rem .8rem; border-radius: 0; background: linear-gradient(180deg, #352073, #59306e); color: #fff; box-shadow: none !important; }
.agent-designer-page .agent-catalog-header { align-items: center; padding: 0 .35rem .9rem; border: 0; }
.agent-designer-page .agent-catalog-label { display: flex; align-items: center; gap: .55rem; font-size: 1.15rem; }
.agent-designer-page .agent-catalog-toggle { border-color: rgba(255,255,255,.65); color: #fff; }
.agent-designer-page .agent-catalog-toggle:hover { border-color: #fff; background: #fff; color: #352073; }
.agent-designer-page .agent-catalog-content { padding: 0; }
.agent-designer-page .agent-catalog-content .form-label { color: rgba(255,255,255,.85); }
.agent-designer-page .agent-catalog-content .form-select { border-color: rgba(255,255,255,.32); background-color: rgba(255,255,255,.12); color: #fff; }
.agent-designer-page .agent-catalog-content .form-select option { background: #fff; color: #212529; }
.agent-designer-page .agent-catalog-search .form-control { border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.12); color: #fff; }
.agent-designer-page .agent-catalog-search .form-control::placeholder { color: rgba(255,255,255,.7); }
.agent-designer-page .agent-catalog-search-icon { color: rgba(255,255,255,.75); }
.agent-designer-page .agent-catalog-item { color: rgba(255,255,255,.86); }
.agent-designer-page .agent-catalog-item:hover,
.agent-designer-page .agent-catalog-item.active { background: #f5eaff; color: #352073; }
.agent-designer-page .agent-catalog-item.active::after { color: #352073; }
.agent-designer-page .agent-catalog-content .text-muted { color: rgba(255,255,255,.7) !important; }
.agent-designer-page .agent-catalog-list { gap: .25rem; }
.agent-designer-page .agent-catalog-item {
    padding: .45rem .55rem;
    border-left: 3px solid rgba(255,255,255,.38);
    border-radius: .35rem;
    background: rgba(255,255,255,.08);
    color: #fff;
}
.agent-designer-page .agent-catalog-item-name {
    font-size: .88rem;
    font-weight: 600;
    line-height: 1.25;
}
.agent-designer-page .agent-catalog-item:hover,
.agent-designer-page .agent-catalog-item.active {
    border-left-color: #9b80f3;
    background: #f5eaff;
    color: #352073;
}
.agent-designer-page .agent-catalog-item.active::after { display: none; }
.agent-designer-page .agent-catalog-groups { display: grid; gap: .9rem; }
.agent-designer-page .agent-catalog-group-top { display: flex; align-items: center; justify-content: space-between; gap: .4rem; margin-bottom: .35rem; }
.agent-designer-page .agent-catalog-section-label { margin: .4rem .45rem .25rem; color: rgba(255,255,255,.65); font-size: .65rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.agent-designer-page .agent-catalog-group-heading { margin: .35rem .45rem .2rem; color: rgba(255,255,255,.8); font-size: .66rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.agent-designer-page .agent-catalog-group-help { margin: 0 .45rem .3rem; color: rgba(255,255,255,.65); font-size: .62rem; line-height: 1.3; }
.agent-designer-page .agent-catalog-published { padding-top: .7rem; border-top: 1px solid rgba(255,255,255,.22); }
.agent-designer-page .agent-catalog-item.is-disabled { opacity: .5; cursor: not-allowed; }
.agent-designer-page .agent-catalog-group-top .btn { border-color: rgba(255,255,255,.7); color: #fff; }
.agent-designer-page .agent-catalog-group-top .btn:hover { background: #fff; color: #352073; }
.agent-designer-page .catalog-collapsed .agent-catalog { padding: .4rem; }
.agent-designer-page .catalog-collapsed .agent-catalog-header { padding: .25rem 0; }
.agent-designer-page .agent-workspace { padding: 1.15rem 1.25rem 1.75rem; }
.agent-designer-page .agent-toolbar-card,
.agent-designer-page .agent-stage { border: 1px solid #dde1e7 !important; border-radius: .6rem; background: #fff; box-shadow: 0 2px 7px rgba(38,45,59,.05) !important; }
.agent-designer-page .agent-stage .card-header { border-color: #e4e8ef; }
.agent-designer-page .agent-stage-number { background: #0d6efd; }
.products-services-menu { min-width: 15rem; }
.client-area-menu { min-width: 15rem; }
.client-area-menu .dropdown-header {
    padding: .38rem .7rem .18rem;
    color: #707782;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .055em;
    text-transform: uppercase;
}
.client-area-menu .dropdown-item { padding: .28rem .7rem; font-size: .86rem; line-height: 1.25; }

.login-provider-menu {
  min-width: 16.25rem;
  padding: .32rem;
  border: 1px solid #dbe3ef;
  border-radius: .55rem;
  box-shadow: 0 .45rem 1.1rem rgba(15, 23, 42, .16);
}

.login-provider-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .4rem .5rem;
  border-radius: .35rem;
  font-size: .88rem;
  line-height: 1.15;
}

.login-provider-menu .dropdown-item:hover,
.login-provider-menu .dropdown-item:focus {
  color: #0d5bd7;
  background: #eef5ff;
}

.login-provider-menu .dropdown-divider {
  margin: .28rem .18rem;
}

.login-provider-icon {
  display: inline-grid;
  flex: 0 0 1.15rem;
  width: 1.15rem;
  height: 1.15rem;
  place-items: center;
  font-weight: 700;
  line-height: 1;
}

.provider-google {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.provider-google svg {
  display: block;
  width: 1rem;
  height: 1rem;
}

.provider-microsoft {
  grid-template-columns: repeat(2, .43rem);
  grid-template-rows: repeat(2, .43rem);
  gap: .08rem;
}

.provider-microsoft i {
  display: block;
  width: .43rem;
  height: .43rem;
}

.provider-microsoft i:nth-child(1) { background: #f25022; }
.provider-microsoft i:nth-child(2) { background: #7fba00; }
.provider-microsoft i:nth-child(3) { background: #00a4ef; }
.provider-microsoft i:nth-child(4) { background: #ffb900; }

.provider-linkedin {
  border-radius: .16rem;
  color: #fff;
  background: #0a66c2;
  font-family: Arial, sans-serif;
  font-size: .7rem;
}

.provider-options {
  color: #64748b;
  font-size: .72rem;
  letter-spacing: -.08rem;
}

.login-provider-menu .login-options-link {
  color: #526174;
  font-size: .82rem;
}
.client-area-menu .dropdown-divider { margin: .3rem 0; }
.client-area-menu .btn[data-bs-toggle="collapse"] { padding-block: .15rem; }
[id^="agentic-"],
@media (max-width: 991.98px) {
    .agent-flow-grid,
    .agent-flow-grid-four { grid-template-columns: 1fr; gap: 1rem; }
    .agent-connector { height: 24px; transform: rotate(90deg); }
}
@media (max-width: 767.98px) {
    .agent-designer-page .agent-workspace { padding: .9rem; }
    .agent-designer-page .agent-catalog { min-height: 0; padding: .8rem; }
    .products-services-menu { min-width: min(15rem, calc(100vw - 2rem)); }
    .agent-designer-layout,
    .agent-designer-layout.catalog-collapsed { display: block; }
    .agent-catalog {
        position: fixed;
        z-index: 1040;
        top: 4.75rem;
        bottom: .75rem;
        left: .75rem;
        width: min(300px, calc(100vw - 1.5rem));
        max-height: none;
        min-width: 0;
        max-width: none;
        transition: transform .2s ease;
    }
    .catalog-collapsed .agent-catalog { transform: translateX(calc(-100% - 1rem)); }
    .agent-catalog-resizer { display: none; }
    .agent-catalog-open { display: inline-block !important; }
}
