/* ==========================================================================
   Gold Path AI Assistant — Bright Gold Theme
   ========================================================================== */

.gpc {

  /* --- Gold Path Brand Tokens -------------------------------------- */

  --gpc-ink:        #8a6418;
  --gpc-gold:       #d9a441;
  --gpc-gold-dark:  #b8862c;
  --gpc-wa:         #25d366;


  /* --- Surfaces ---------------------------------------------------- */

  --gpc-surface:    #ffffff;
  --gpc-surface-2:  #fffaf0;
  --gpc-line:       #ead8ad;
  --gpc-muted:      #777777;


  /* --- Shape ------------------------------------------------------- */

  --gpc-radius:     16px;
  --gpc-radius-sm:  10px;


  /* --- Shadow ------------------------------------------------------ */

  --gpc-shadow:
    0 12px 40px -12px rgb(180 130 40 / 25%),
    0 3px 12px rgb(0 0 0 / 10%);


  --gpc-ease:
    cubic-bezier(.22,.61,.36,1);


  /* --- Widget position --------------------------------------------- */

  position: fixed;

  right: 20px;
  bottom: 20px;

  z-index:2147483000;

  font-family: inherit;
  font-size:15px;
  line-height:1.55;

  color:var(--gpc-ink);

  text-wrap:pretty;

}


/* Stack above existing buttons */

.gpc[data-offset="stacked"] {
  bottom:92px;
}



/* ==========================================================================
   Launcher Button
   ========================================================================== */


.gpc__launcher {

  display:inline-flex;

  align-items:center;

  gap:9px;

  padding:12px 18px 12px 14px;

  border:0;

  border-radius:999px;


  background:
  linear-gradient(
    135deg,
    #e7b957,
    #d19a2e
  );


  color:#ffffff;


  font:inherit;

  font-weight:600;

  cursor:pointer;


  box-shadow:var(--gpc-shadow);


  transition:
  transform .18s var(--gpc-ease),
  background .18s var(--gpc-ease);

}


.gpc__launcher:hover {

  background:
  linear-gradient(
    135deg,
    #f0c766,
    #b8862c
  );


  transform:translateY(-2px);

}


.gpc__launcher:active {

  transform:translateY(0);

}


.gpc__launcher:focus-visible {

  outline:2px solid var(--gpc-gold);

  outline-offset:3px;

}


.gpc__launcher svg {

  width:20px;

  height:20px;

  color:#ffffff;

}


.gpc[data-open="true"] .gpc__launcher {

  display:none;

}



/* ==========================================================================
   Chat Panel
   ========================================================================== */


.gpc__panel {

  display:none;


  width:min(380px, calc(100vw - 32px));


  height:min(560px, calc(100vh - 120px));


  flex-direction:column;


  overflow:hidden;


  background:#ffffff;


  border:

  1px solid var(--gpc-line);


  border-radius:var(--gpc-radius);


  box-shadow:var(--gpc-shadow);

}


.gpc[data-open="true"] .gpc__panel {

  display:flex;

  animation:gpc-rise .26s var(--gpc-ease);

}



@keyframes gpc-rise {

  from {

    opacity:0;

    transform:
    translateY(10px)
    scale(.985);

  }


  to {

    opacity:1;

    transform:none;

  }

}



@media(prefers-reduced-motion:reduce){

  .gpc[data-open="true"] .gpc__panel {

    animation:none;

  }


  .gpc__launcher {

    transition:none;

  }

}




/* ==========================================================================
   Header
   ========================================================================== */


.gpc__head {

  display:flex;

  align-items:center;

  gap:10px;


  padding:

  14px 14px 14px 16px;


  background:

  linear-gradient(
    135deg,
    #e4b44d,
    #f3d27d
  );


  color:#ffffff;

}


.gpc__head b {

  font-size:15px;

  font-weight:700;

}


.gpc__head small {

  display:block;

  color:#fff7df;

  font-size:12px;

}



.gpc__head .gpc__dot {

  width:8px;

  height:8px;

  border-radius:50%;

  background:#25d366;

}



.gpc__close {

  margin-left:auto;

  background:none;

  border:0;

  color:#ffffff;

  font-size:22px;

  cursor:pointer;

}


.gpc__close:hover {

  opacity:.75;

}



/* ==========================================================================
   Messages
   ========================================================================== */


.gpc__log {

  flex:1;

  overflow-y:auto;


  padding:16px;


  display:flex;

  flex-direction:column;


  gap:12px;


  background:#fffaf0;


  overscroll-behavior:contain;

}



.gpc__msg {

  max-width:88%;

  padding:10px 13px;


  border-radius:var(--gpc-radius-sm);

}



.gpc__msg--bot {

  background:#ffffff;


  border:

  1px solid var(--gpc-line);


  align-self:flex-start;


  border-bottom-left-radius:4px;

}



.gpc__msg--user {

  background:#d9a441;


  color:#ffffff;


  align-self:flex-end;


  border-bottom-right-radius:4px;

}



/* Links */


.gpc__links {

  display:flex;

  flex-direction:column;

  gap:6px;

  margin-top:8px;

}



.gpc__links a {

  font-size:13px;

  color:var(--gpc-gold-dark);

  text-decoration:none;

}



.gpc__links a:hover {

  text-decoration:underline;

}



/* Chips */


.gpc__chips {

  display:flex;

  flex-wrap:wrap;

  gap:7px;

}



.gpc__chip {

  background:#ffffff;

  border:

  1px solid var(--gpc-line);


  border-radius:999px;


  padding:7px 13px;


  font-size:13px;


  color:var(--gpc-ink);


  cursor:pointer;

}


.gpc__chip:hover {

  border-color:var(--gpc-gold);

}

/* ==========================================================================
   Typing Indicator
   ========================================================================== */

.gpc__typing {

  display:flex;

  gap:4px;

  padding:12px 14px;

}


.gpc__typing i {

  width:6px;

  height:6px;

  border-radius:50%;

  background:var(--gpc-gold);


  animation:gpc-blink 1.1s infinite;

}


.gpc__typing i:nth-child(2){

  animation-delay:.18s;

}


.gpc__typing i:nth-child(3){

  animation-delay:.36s;

}



@keyframes gpc-blink {

  0%,60%,100% {

    opacity:.25;

  }

  30% {

    opacity:1;

  }

}



/* ==========================================================================
   WhatsApp Handoff
   ========================================================================== */


.gpc__wa {

  display:flex;

  align-items:center;

  justify-content:center;


  gap:8px;


  width:100%;


  padding:12px 14px;


  margin-top:2px;


  background:#25d366;


  color:#ffffff;


  border:0;


  border-radius:var(--gpc-radius-sm);


  font:inherit;


  font-weight:700;


  cursor:pointer;


  transition:.15s ease;

}


.gpc__wa:hover {

  filter:brightness(.95);

}


.gpc__wa svg {

  width:18px;

  height:18px;

  fill:currentColor;

}



/* Handoff card */

.gpc__msg--handoff {

  max-width:100%;

  align-self:stretch;


  border:

  1px solid var(--gpc-gold);


  border-radius:var(--gpc-radius-sm);


  background:#fffdf5;


  padding:14px;

}



.gpc__handoffTitle {

  font-weight:700;

  margin-bottom:3px;

}



.gpc__handoffMeta {

  font-size:12.5px;

  color:var(--gpc-muted);

  margin-bottom:10px;

}



.gpc__waNum {

  display:block;

  text-align:center;


  margin-top:9px;


  font-size:13.5px;

  font-weight:600;


  color:var(--gpc-muted);


  text-decoration:none;

}


.gpc__waNum:hover {

  color:var(--gpc-ink);

}



/* ==========================================================================
   Lead Form
   ========================================================================== */


.gpc__form {

  display:grid;

  gap:8px;

  margin-bottom:10px;

}



.gpc__form input {


  padding:10px 12px;


  border:

  1px solid var(--gpc-line);


  border-radius:var(--gpc-radius-sm);


  font:inherit;


  background:#ffffff;

}



.gpc__form input:focus {

  outline:2px solid var(--gpc-gold);

  border-color:transparent;

}



.gpc__skip {

  background:none;

  border:0;

  color:var(--gpc-muted);

  font-size:12px;

  cursor:pointer;

  text-decoration:underline;

}



/* ==========================================================================
   Message Composer
   ========================================================================== */


.gpc__composer {

  display:flex;


  gap:8px;


  padding:12px;


  background:#ffffff;


  border-top:

  1px solid var(--gpc-line);

}



.gpc__composer textarea {

  flex:1;


  resize:none;


  max-height:96px;


  padding:10px 12px;


  border:

  1px solid var(--gpc-line);


  border-radius:var(--gpc-radius-sm);


  font:inherit;


  font-size:14.5px;


  color:#555555;

}



.gpc__composer textarea:focus {

  outline:2px solid var(--gpc-gold);

  border-color:transparent;

}



.gpc__send {


  border:0;


  border-radius:var(--gpc-radius-sm);


  padding:0 16px;


  background:

  linear-gradient(
    135deg,
    #e4b44d,
    #c99127
  );


  color:#ffffff;


  font-weight:700;


  cursor:pointer;

}



.gpc__send:hover:not(:disabled){

  background:#b8862c;

}



.gpc__send:disabled {

  opacity:.45;

}



/* ==========================================================================
   Legal Text
   ========================================================================== */


.gpc__legal {

  padding:0 12px 10px;


  font-size:11.5px;


  color:var(--gpc-muted);


  background:#ffffff;

}



/* ==========================================================================
   Welcome Screen
   ========================================================================== */


.gpc__welcome {


  background:#ffffff;


  padding:16px 14px 12px;


  border:

  1px solid var(--gpc-line);


  border-radius:var(--gpc-radius-sm);

}



.gpc__welcomeTitle {

  font-weight:700;


  margin-bottom:14px;


  color:var(--gpc-ink);


}



.gpc__welcomeButtons {

  display:grid;

  gap:10px;

}



.gpc__welcomeButton {


  width:100%;


  padding:11px 14px;


  border:

  1px solid var(--gpc-line);


  border-radius:999px;


  background:#ffffff;


  color:var(--gpc-ink);


  font-weight:600;


  cursor:pointer;


}



.gpc__welcomeButton:hover {


  background:#fff7df;


  border-color:var(--gpc-gold);


}



/* ==========================================================================
   Mobile - Keep Right Bottom Floating Style
   ========================================================================== */


/* ======================================================================
   Mobile - Floating right beside Back To Top button
   ====================================================================== */

@media (max-width:600px){

  .gpc {

    right:85px !important;  /* beside back-to-top */
    left:auto !important;

    bottom:24px !important; /* same height */

  }



  /* Chat window when opened */
  .gpc__panel {

    position:fixed;

    right:12px;

    left:auto;

    bottom:80px;


    width:

    calc(100vw - 24px);


    height:

    calc(100vh - 140px);


    max-width:none;


    border-radius:16px;

  }


  .gpc__launcher {

    padding:12px 16px;

  }




  .gpc__msg {

    max-width:92%;

    font-size:14px;

  }



  .gpc__composer textarea {


    font-size:16px;

    /* prevents iPhone zoom */

  }



}



@media(max-width:380px){


  .gpc__panel {

    width:320px;

    height:480px;

  }


}