/*
 * 598 精旅選 Agency Apply — Shared Premium UI
 * Color palette: #1a5f7a primary, #155070 dark, #e8f4f8 light bg,
 *                #f7f9fa surface, #cfd8dc border, #2e7d32 success, #c62828 danger
 * Font: "Microsoft JhengHei", "PingFang TC", "Helvetica Neue", Arial, sans-serif
 */

/* =========================================================
   Reset + Base
   ========================================================= */
*,*::before,*::after{box-sizing:border-box}
body.ett-apply-body{
  margin:0;
  font-family:"Microsoft JhengHei","PingFang TC","Helvetica Neue",Arial,sans-serif;
  font-size:16px;
  line-height:1.65;
  color:#1e2a32;
  background:#f0f4f7;
}

/* =========================================================
   Layout
   ========================================================= */
.ett-apply-wrap{
  max-width:720px;
  margin:0 auto;
  padding:40px 16px 64px;
}
.ett-apply-wrap--wide{max-width:900px}

/* =========================================================
   Page Header / Brand Bar
   ========================================================= */
.ett-apply-topbar{
  background:#1a5f7a;
  color:#fff;
  padding:14px 20px;
  display:flex;
  align-items:center;
  gap:12px;
}
.ett-apply-topbar a{color:#e0f2f7;text-decoration:none;font-size:.9rem}
.ett-apply-topbar__logo{
  font-size:1.1rem;
  font-weight:700;
  color:#fff;
  text-decoration:none;
  letter-spacing:.02em;
}
.ett-apply-topbar__sep{color:#80b8c8;margin:0 4px}

/* =========================================================
   Page Intro
   ========================================================= */
.ett-page-intro{
  text-align:center;
  padding:32px 0 24px;
}
.ett-page-intro h1{
  font-size:1.65rem;
  font-weight:700;
  color:#1a5f7a;
  margin:0 0 10px;
  line-height:1.35;
}
.ett-page-intro p{
  margin:0;
  color:#4a5e6b;
  font-size:.97rem;
  max-width:480px;
  margin:0 auto;
}

/* =========================================================
   Cards / Surfaces
   ========================================================= */
.ett-card{
  background:#fff;
  border:1px solid #d8e3ea;
  border-radius:12px;
  padding:28px 28px;
  margin-bottom:20px;
  box-shadow:0 1px 4px rgba(26,95,122,.06);
}
.ett-card--tight{padding:20px 24px}
.ett-card__title{
  font-size:1.05rem;
  font-weight:700;
  color:#1a5f7a;
  margin:0 0 18px;
  padding-bottom:12px;
  border-bottom:1px solid #e8eff3;
}

/* =========================================================
   Forms
   ========================================================= */
.ett-form-group{margin-bottom:18px}
.ett-form-group--row{display:flex;gap:14px}
.ett-form-group--row .ett-form-group{flex:1;min-width:0;margin-bottom:0}
.ett-label{
  display:block;
  font-size:.88rem;
  font-weight:600;
  color:#2c3e47;
  margin-bottom:5px;
}
.ett-label .req{color:#c62828;margin-left:2px}
.ett-input,.ett-select,.ett-textarea{
  display:block;
  width:100%;
  padding:10px 13px;
  border:1px solid #c5d4dc;
  border-radius:8px;
  font-size:.95rem;
  font-family:inherit;
  color:#1e2a32;
  background:#fff;
  transition:border-color .18s,box-shadow .18s;
  -webkit-appearance:none;
  appearance:none;
}
.ett-input:focus,.ett-select:focus,.ett-textarea:focus{
  outline:none;
  border-color:#1a5f7a;
  box-shadow:0 0 0 3px rgba(26,95,122,.12);
}
.ett-input[readonly],.ett-input:disabled{
  background:#f5f8fa;
  color:#6b7d88;
  border-color:#dde6ec;
  cursor:default;
}
.ett-textarea{resize:vertical;min-height:90px}
.ett-helper{
  font-size:.82rem;
  color:#6b7d88;
  margin-top:4px;
}
.ett-error{
  font-size:.82rem;
  color:#c62828;
  margin-top:4px;
}
.ett-form-row{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.ett-form-row .ett-form-group{flex:1;min-width:140px}

/* password input wrapper */
.ett-input-pw{position:relative}
.ett-input-pw .ett-input{padding-right:44px}
.ett-pw-toggle{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  border:none;background:transparent;color:#6b7d88;cursor:pointer;
  font-size:.85rem;padding:4px 6px;
}

/* =========================================================
   Google Candidates
   ========================================================= */
.ett-candidates{margin:12px 0 0;display:flex;flex-direction:column;gap:8px}
.ett-candidate{
  border:1.5px solid #d2e4ec;
  border-radius:9px;
  padding:12px 14px;
  cursor:pointer;
  transition:border-color .16s,background .16s;
  display:flex;align-items:flex-start;gap:10px;
}
.ett-candidate:hover,.ett-candidate:focus{border-color:#1a5f7a;background:#f0f8fb;outline:none}
.ett-candidate.is-selected{border-color:#1a5f7a;background:#e4f2f8}
.ett-candidate__radio{
  width:18px;height:18px;border:2px solid #9db8c4;border-radius:50%;
  margin-top:2px;flex-shrink:0;position:relative;transition:border-color .16s;
}
.ett-candidate.is-selected .ett-candidate__radio{border-color:#1a5f7a}
.ett-candidate.is-selected .ett-candidate__radio::after{
  content:"";display:block;width:10px;height:10px;border-radius:50%;
  background:#1a5f7a;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
}
.ett-candidate__body{}
.ett-candidate__name{font-weight:600;font-size:.95rem;color:#1e2a32}
.ett-candidate__addr{font-size:.83rem;color:#5a7080;margin-top:2px}
.ett-no-results{
  padding:16px;text-align:center;color:#7a8f9a;font-size:.9rem;
  border:1px dashed #c5d4dc;border-radius:8px;
}

/* =========================================================
   CTAs / Buttons
   ========================================================= */
.ett-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:11px 24px;border-radius:8px;font-size:.97rem;font-weight:600;
  font-family:inherit;cursor:pointer;border:none;text-decoration:none;
  transition:background .18s,opacity .18s;
  white-space:nowrap;
}
.ett-btn:disabled,.ett-btn.is-loading{opacity:.55;cursor:not-allowed;pointer-events:none}
.ett-btn--primary{background:#1a5f7a;color:#fff}
.ett-btn--primary:hover{background:#155070;color:#fff}
.ett-btn--secondary{background:#fff;color:#1a5f7a;border:1.5px solid #1a5f7a}
.ett-btn--secondary:hover{background:#e8f4f8}
.ett-btn--danger{background:#c62828;color:#fff}
.ett-btn--ghost{background:transparent;color:#4a6674;border:1.5px solid #c5d4dc}
.ett-btn--ghost:hover{background:#f0f4f7}
.ett-btn--full{width:100%;display:flex}
.ett-btn--lg{padding:14px 28px;font-size:1.05rem}
.ett-btn-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:22px}
.ett-btn-row--end{justify-content:flex-end}
.ett-btn-row--center{justify-content:center}

/* =========================================================
   Badges / Status
   ========================================================= */
.ett-badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 10px;border-radius:99px;font-size:.8rem;font-weight:600;
  line-height:1.5;
}
.badge-info{background:#e3f0f8;color:#1a5f7a}
.badge-success{background:#e8f5e9;color:#2e7d32}
.badge-warning{background:#fff8e1;color:#7b5c00}
.badge-danger{background:#ffebee;color:#c62828}
.badge-muted{background:#eceff1;color:#546e7a}
.badge-published{background:#1a5f7a;color:#fff}
.badge-dot{display:inline-block;width:7px;height:7px;border-radius:50%}
.badge-success .badge-dot{background:#2e7d32}
.badge-info .badge-dot{background:#1a5f7a}
.badge-warning .badge-dot{background:#f9a825}
.badge-danger .badge-dot{background:#c62828}
.badge-published .badge-dot{background:#fff}
.badge-muted .badge-dot{background:#90a4ae}

/* =========================================================
   G4 Progress Stepper (vertical)
   ========================================================= */
.ett-stepper{display:flex;flex-direction:column;gap:0;padding:4px 0}
.ett-step{display:flex;gap:14px;position:relative;padding-bottom:20px}
.ett-step:last-child{padding-bottom:0}
.ett-step__track{display:flex;flex-direction:column;align-items:center;gap:0;flex-shrink:0;width:32px}
.ett-step__dot{
  width:32px;height:32px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-size:.85rem;font-weight:700;
  border:2px solid #c5d4dc;background:#fff;color:#9aacb6;flex-shrink:0;
  position:relative;z-index:1;
}
.ett-step.is-completed .ett-step__dot{background:#2e7d32;border-color:#2e7d32;color:#fff}
.ett-step.is-current  .ett-step__dot{background:#1a5f7a;border-color:#1a5f7a;color:#fff;
  box-shadow:0 0 0 4px rgba(26,95,122,.15)}
.ett-step__line{flex:1;width:2px;background:#dde6ec;margin:0}
.ett-step.is-completed .ett-step__line{background:#2e7d32}
.ett-step__body{padding-top:6px;padding-bottom:0}
.ett-step__label{
  font-size:.92rem;font-weight:600;
  color:#9aacb6;line-height:1.4;
}
.ett-step.is-completed .ett-step__label{color:#2e7d32}
.ett-step.is-current  .ett-step__label{color:#1a5f7a}
.ett-step__sub{font-size:.82rem;color:#7a8f9a;margin-top:2px}
.ett-step.is-current .ett-step__sub{color:#4a6674}

/* =========================================================
   G4 URL Block
   ========================================================= */
.ett-url-block{
  background:#f0f8fb;border:1px solid #c5dde8;border-radius:10px;
  padding:18px 20px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
}
.ett-url-block--muted{background:#f5f7f8;border-color:#dde6ec}
.ett-url-block__text{
  flex:1;font-size:.93rem;color:#2c3e47;word-break:break-all;
}
.ett-url-block--muted .ett-url-block__text{color:#7a8f9a}
.ett-url-tag{
  font-size:.77rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:#1a5f7a;background:#d7eef6;padding:2px 8px;border-radius:99px;
  display:inline-block;margin-bottom:4px;
}
.ett-url-tag--muted{color:#7a8f9a;background:#e8ecef}

/* =========================================================
   Status Summary Block
   ========================================================= */
.ett-status-block{
  display:flex;align-items:flex-start;gap:16px;
  background:#f7fafb;border:1px solid #d8e3ea;border-radius:10px;
  padding:18px 20px;margin-bottom:18px;
}
.ett-status-block__icon{font-size:1.8rem;line-height:1;flex-shrink:0}
.ett-status-block__main{flex:1}
.ett-status-block__title{font-size:1rem;font-weight:700;color:#1e2a32;margin:0 0 4px}
.ett-status-block__sub{font-size:.88rem;color:#4a5e6b;margin:0}

/* =========================================================
   Bill / Payment Section
   ========================================================= */
.ett-bill-row{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:10px 0;border-bottom:1px solid #edf1f4;
}
.ett-bill-row:last-child{border-bottom:none}
.ett-bill-label{font-size:.87rem;color:#4a5e6b}
.ett-bill-value{font-size:.95rem;font-weight:600;color:#1e2a32}
.ett-bill-amount{font-size:1.1rem;font-weight:700;color:#c62828}

/* Compact copy control (G4 URL + widget script) */
.ett-copy-btn{
  display:inline-flex;align-items:center;gap:4px;
  margin-left:8px;padding:2px 6px;border:none;border-radius:4px;
  background:transparent;color:#1a5f7a;font-size:.78rem;font-weight:600;
  cursor:pointer;vertical-align:middle;line-height:1.2;
}
.ett-copy-btn:hover,.ett-copy-btn:focus{background:#e8f4f8;outline:none}
.ett-copy-btn__icon{font-size:.85rem;line-height:1}
.ett-copy-btn__label{white-space:nowrap}
.ett-copy-target{word-break:break-all}
.ett-code-snip{
  display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap;
  background:#f5f7f8;border:1px solid #dde6ec;border-radius:8px;padding:10px 12px;
}
.ett-code-snip__pre{
  flex:1 1 220px;margin:0;padding:0;background:transparent;border:none;
  font-family:Consolas,"Courier New",monospace;font-size:.78rem;line-height:1.45;
  color:#1e2a32;white-space:pre-wrap;word-break:break-all;overflow-wrap:anywhere;
}
.ett-code-snip .ett-copy-btn{margin-left:0;flex:0 0 auto}

/* =========================================================
   Section Separator
   ========================================================= */
.ett-section-title{
  font-size:.82rem;font-weight:700;color:#6b7d88;
  text-transform:uppercase;letter-spacing:.08em;
  margin:28px 0 12px;padding-left:2px;
}
.ett-divider{border:none;border-top:1px solid #e8eff3;margin:20px 0}

/* =========================================================
   Alerts / Inline messages
   ========================================================= */
.ett-alert{
  padding:12px 16px;border-radius:8px;font-size:.9rem;margin-bottom:16px;
  display:flex;align-items:flex-start;gap:9px;
}
.ett-alert--error{background:#ffebee;color:#b71c1c;border:1px solid #ffcdd2}
.ett-alert--info{background:#e3f0f8;color:#1a5f7a;border:1px solid #b3d6e8}
.ett-alert--success{background:#e8f5e9;color:#1b5e20;border:1px solid #c8e6c9}
.ett-alert--warning{background:#fffde7;color:#6b4c00;border:1px solid #fff9c4}
.ett-alert__icon{flex-shrink:0;font-weight:700;margin-top:1px}

/* =========================================================
   Loading / Submitting
   ========================================================= */
.ett-spinner{
  display:inline-block;width:18px;height:18px;border-radius:50%;
  border:2.5px solid rgba(255,255,255,.35);
  border-top-color:#fff;
  animation:ett-spin .7s linear infinite;
}
.ett-spinner--dark{border-color:rgba(26,95,122,.2);border-top-color:#1a5f7a}
@keyframes ett-spin{to{transform:rotate(360deg)}}

/* =========================================================
   KWB Disclosure
   ========================================================= */
.ett-disclosure{
  font-size:.79rem;color:#8a9da8;text-align:center;
  padding:20px 0 0;border-top:1px solid #e8eff3;margin-top:32px;
}
.ett-disclosure a{color:#8a9da8;text-decoration:underline}

/* =========================================================
   Toast copy feedback
   ========================================================= */
.ett-toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(12px);
  background:#1a5f7a;color:#fff;padding:10px 20px;border-radius:8px;
  font-size:.9rem;font-weight:600;opacity:0;pointer-events:none;
  transition:opacity .25s,transform .25s;z-index:9999;
}
.ett-toast.is-visible{opacity:1;transform:translateX(-50%) translateY(0)}

/* =========================================================
   Google Search Dropdown
   ========================================================= */
.ett-search-dropdown{
  position:absolute;left:0;right:0;top:100%;z-index:200;
  background:#fff;
  border:1px solid #b8cdd8;border-top:none;
  border-radius:0 0 8px 8px;
  box-shadow:0 4px 16px rgba(26,95,122,.12);
  max-height:300px;overflow-y:auto;
  margin-top:0;
}
.ett-search-dropdown .ett-candidate{
  border-radius:0;
  border-left:none;border-right:none;border-top:none;
  border-bottom:1px solid #edf1f4;
}
.ett-search-dropdown .ett-candidate:last-child{border-bottom:none}
.ett-search-dropdown .ett-no-results{
  padding:14px 16px;font-size:.9rem;color:#6b7d88;
}

/* Selected store summary */
.ett-selected-store{
  display:flex;align-items:flex-start;gap:10px;
  background:#e3f0f8;border:1px solid #b3d6e8;border-radius:8px;
  padding:10px 14px;font-size:.9rem;
}
.ett-selected-store__icon{flex-shrink:0;color:#1a5f7a;font-weight:700;margin-top:1px}
.ett-selected-store__body{flex:1;min-width:0}
.ett-selected-store__name{font-weight:600;color:#1e2a32;margin-bottom:2px;word-break:break-word}
.ett-selected-store__addr{color:#4a5e6b;font-size:.85rem;word-break:break-word}

/* Disclosure brand name bold */
.ett-disclosure strong{font-weight:700;color:#4a5e6b}

/* Responsive
   ========================================================= */
@media(max-width:540px){
  .ett-apply-wrap{padding:24px 12px 48px}
  .ett-card{padding:18px 16px}
  .ett-form-group--row,.ett-form-row{flex-direction:column;gap:0}
  .ett-form-group--row .ett-form-group{margin-bottom:16px}
  .ett-btn-row{flex-direction:column}
  .ett-btn-row .ett-btn{width:100%;justify-content:center}
  .ett-url-block{flex-direction:column;gap:10px}
  .ett-status-block{flex-direction:column;gap:8px}
  .ett-page-intro h1{font-size:1.3rem}
}
