/* ── GT Fish Store Frontend Styles ─────────────────────────────── */

/* Selector Cards Grid */
.gt-selector-wrapper { max-width: 900px; margin: 40px auto; padding: 0 20px; }
.gt-selector-step    { display: none; }
.gt-selector-step.active { display: block; animation: gtFadeIn .3s ease; }

@keyframes gtFadeIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }

.gt-selector-wrapper h2 { font-size: 1.8rem; margin-bottom: 8px; color: #1a5276; }
.gt-selector-wrapper p  { color: #666; margin-bottom: 24px; }

.gt-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 16px;
    margin-top: 20px;
}

.gt-card {
    background: #fff;
    border: 2px solid #e8f4fd;
    border-radius: 12px;
    padding: 20px 16px;
    text-align: center;
    cursor: pointer;
    transition: all .2s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.gt-card:hover  { border-color: #2196F3; box-shadow: 0 4px 16px rgba(33,150,243,.15); transform: translateY(-2px); }
.gt-card-icon   { font-size: 2rem; }
.gt-card-name   { font-weight: 700; font-size: 1rem; color: #1a5276; }
.gt-card-sub    { font-size: .8rem; color: #888; }
.gt-card-hours  { font-size: .75rem; color: #27ae60; }

.gt-breadcrumb  { display:flex; align-items:center; gap:12px; margin-bottom:24px; }
.gt-back        { color:#2196F3; cursor:pointer; font-size:.9rem; }
.gt-back:hover  { text-decoration:underline; }
.gt-loading     { text-align:center; padding:40px; color:#888; }

/* ── Order Tracking Stepper ─────────────────────────────────────── */
.gt-tracking-wrapper { max-width: 700px; margin: 40px auto; padding: 0 20px; }
.gt-tracking-wrapper h2 { font-size:1.8rem; color:#1a5276; margin-bottom:24px; }

.gt-tracking-form { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.gt-tracking-form input { flex:1; min-width:200px; padding:12px 16px; border:2px solid #ddd; border-radius:8px; font-size:1rem; }
.gt-tracking-form input:focus { outline:none; border-color:#2196F3; }

.gt-btn { padding:12px 24px; border:none; border-radius:8px; cursor:pointer; font-size:1rem; font-weight:600; }
.gt-btn-primary   { background:#1a5276; color:#fff; }
.gt-btn-primary:hover { background:#154360; }
.gt-btn-secondary { background:#eee; color:#333; }

.gt-order-summary { background:#f8f9fa; border-radius:12px; padding:20px; margin-bottom:28px; }
.gt-order-summary h3 { margin:0 0 8px; color:#1a5276; }

/* Stepper */
.gt-stepper { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:0; margin:32px 0; }

.gt-step { display:flex; flex-direction:column; align-items:center; gap:8px; min-width:80px; }
.gt-step-icon  { width:52px; height:52px; border-radius:50%; background:#e9ecef; display:flex; align-items:center; justify-content:center; font-size:1.4rem; transition:all .3s; border:3px solid #dee2e6; }
.gt-step-label { font-size:.7rem; text-align:center; color:#999; font-weight:600; max-width:80px; }

.gt-step.active .gt-step-icon   { background:#1a5276; border-color:#1a5276; animation:gtPulse 1.5s infinite; }
.gt-step.active .gt-step-label  { color:#1a5276; }
.gt-step.completed .gt-step-icon { background:#27ae60; border-color:#27ae60; }
.gt-step.completed .gt-step-label{ color:#27ae60; }

@keyframes gtPulse { 0%,100%{box-shadow:0 0 0 0 rgba(26,82,118,.4)} 50%{box-shadow:0 0 0 10px rgba(26,82,118,0)} }

.gt-step-line { flex:1; height:3px; background:#dee2e6; min-width:20px; transition:background .3s; }
.gt-step-line.completed { background:#27ae60; }

/* Rider info */
.gt-rider-info { background:#e8f8f5; border-radius:12px; padding:20px; margin-top:24px; border-left:4px solid #27ae60; }
.gt-rider-info h4 { margin:0 0 12px; color:#1e8449; }
.gt-rider-info p  { margin:4px 0; }

.gt-error { color:#e74c3c; font-size:.9rem; }

/* ── Delivery Section at Checkout ───────────────────────────────── */
#gt-delivery-section { background:#f8f9fa; border-radius:12px; padding:24px; margin-bottom:24px; }
#gt-delivery-section h3 { margin:0 0 8px; color:#1a5276; }
.gt-branch-note  { color:#27ae60; font-size:.9rem; margin-bottom:16px; }
.gt-fee-display  { margin-top:12px; padding:12px 16px; background:#fff; border-radius:8px; border:1px solid #ddd; }
.gt-free-delivery  { color:#27ae60; font-weight:700; }
.gt-fee-included   { color:#1a5276; }
.gt-fee-estimate   { color:#e67e22; }
.gt-delivery-choice label { display:block; padding:8px 0; cursor:pointer; }
.gt-delivery-choice input { margin-right:8px; }

/* Admin order delivery box */
.gt-order-delivery { background:#f0f7ff; border-radius:8px; padding:16px; margin-top:16px; border-left:4px solid #2196F3; }
.gt-order-delivery h3 { margin:0 0 8px; }

/* Responsive */
@media (max-width: 600px) {
    .gt-grid { grid-template-columns: repeat(2, 1fr); }
    .gt-stepper { gap:0; }
    .gt-step-line { min-width:10px; }
    .gt-step { min-width:50px; }
    .gt-step-icon { width:40px; height:40px; font-size:1.1rem; }
    .gt-step-label { font-size:.6rem; }
}
