/**
 * Attendance Hub — Tissue brand theme (เช็คอินของฉัน · ทีมวันนี้ · แผนที่)
 * Presentation only — IDs/classes for JS untouched
 */
body.mt-tissue-brand #s-attendance-hub.ah-att-wrap,
body.mt-tissue-brand #s-attendance-hub .ah-att-top,
body.mt-tissue-brand #s-attendance-hub .ah-att-scroll {
  background: transparent !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-hdr {
  background: rgba(245, 248, 252, 0.92) !important;
  backdrop-filter: blur(16px) saturate(1.3);
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
  border-bottom: 1px solid rgba(255, 255, 255, 0.75);
  box-shadow: var(--mt-tissue-shadow-sm, 0 8px 28px -6px rgba(90, 159, 212, 0.14));
  padding-top: calc(14px + env(safe-area-inset-top, 0px));
}

body.mt-tissue-brand #s-attendance-hub .ah-att-hdr h2 {
  color: var(--mt-tissue-navy, #0A3A63) !important;
  font-weight: 700;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-sub {
  color: var(--mt-tissue-blue-500, #1E88E5) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-back {
  background: rgba(255, 255, 255, 0.82) !important;
  color: var(--mt-tissue-blue-700, #0F4C81) !important;
  border-radius: 14px !important;
  box-shadow: var(--mt-tissue-shadow-sm);
  border: none;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-tabs {
  background: rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: none !important;
  box-shadow: none !important;
  padding: 10px 12px 12px;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-tab {
  background: rgba(255, 255, 255, 0.88) !important;
  color: var(--mt-tissue-muted, #6b7f94) !important;
  border-radius: 999px !important;
  border: none !important;
  box-shadow: var(--mt-tissue-shadow-sm);
  padding: 9px 16px;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-tab.on {
  background: linear-gradient(145deg, #D6E8F7 0%, #5BA3D9 55%, #1E88E5 100%) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px -4px rgba(90, 159, 212, 0.32);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-card,
body.mt-tissue-brand #s-attendance-hub .ah-att-team-card,
body.mt-tissue-brand #s-attendance-hub .ah-att-sum-box,
body.mt-tissue-brand #s-attendance-hub .ah-att-map-dock,
body.mt-tissue-brand #s-attendance-hub .ah-att-schedule-bar,
body.mt-tissue-brand #s-attendance-hub .ah-att-zone-filter,
body.mt-tissue-brand #s-attendance-hub .ah-att-zone-group,
body.mt-tissue-brand #s-attendance-hub .ah-att-schedule-dropdown.ah-att-sched-card,
body.mt-tissue-brand #s-attendance-hub .ah-att-pending-banner,
body.mt-tissue-brand #s-attendance-hub .ah-att-tl-card {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 248, 252, 0.82) 100%) !important;
  border: none !important;
  border-radius: 24px !important;
  box-shadow: var(--mt-tissue-shadow-md) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-card-h,
body.mt-tissue-brand #s-attendance-hub .ah-att-map-title,
body.mt-tissue-brand #s-attendance-hub .ah-att-schedule-h,
body.mt-tissue-brand #s-attendance-hub .ah-att-schedule-list-h,
body.mt-tissue-brand #s-attendance-hub .ah-att-feed-h,
body.mt-tissue-brand #s-attendance-hub .ah-att-zone-filter label {
  color: var(--mt-tissue-blue-700, #0F4C81) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-person {
  background: rgba(255, 255, 255, 0.9) !important;
  border: none !important;
  border-radius: 20px !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-person-name,
body.mt-tissue-brand #s-attendance-hub .ah-att-team-card-name,
body.mt-tissue-brand #s-attendance-hub .ah-att-sched-name {
  color: var(--mt-tissue-text, #3d4f63) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-person-meta,
body.mt-tissue-brand #s-attendance-hub .ah-att-my-status,
body.mt-tissue-brand #s-attendance-hub .ah-att-checkin-hint,
body.mt-tissue-brand #s-attendance-hub .ah-att-live,
body.mt-tissue-brand #s-attendance-hub .ah-att-sum-l {
  color: var(--mt-tissue-muted, #6b7f94) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-sum-n {
  color: var(--mt-tissue-blue-500, #1E88E5) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-checkin-state-btn.checkin {
  background: linear-gradient(145deg, #C8E6C9 0%, #66BB6A 50%, #43A047 100%) !important;
  color: #1e4d32 !important;
  border-radius: 999px !important;
  box-shadow: var(--mt-tissue-shadow-sm) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-checkin-state-btn.checkout {
  background: linear-gradient(145deg, #D6E8F7 0%, #5BA3D9 50%, #1E88E5 100%) !important;
  color: #0A3A63 !important;
  border-radius: 999px !important;
  box-shadow: var(--mt-tissue-shadow-sm) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-btn-primary {
  background: linear-gradient(145deg, #C8E6C9 0%, #43A047 100%) !important;
  color: #1e4d32 !important;
  border-radius: 999px !important;
  border: none !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-btn-outline {
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--mt-tissue-blue-700, #0F4C81) !important;
  border: none !important;
  border-radius: 20px !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-night-card {
  background: linear-gradient(145deg, rgba(240, 246, 252, 0.95) 0%, rgba(227, 238, 248, 0.75) 100%) !important;
  border: none !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-night-title {
  color: #9b6b8a !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-night-hint {
  color: var(--mt-tissue-muted, #6b7f94) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-btn-night {
  background: linear-gradient(145deg, #C5DCF0 0%, #8BB4D9 100%) !important;
  color: #5c3d4f !important;
  border: none !important;
  border-radius: 999px !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-team-nudge,
body.mt-tissue-brand #s-attendance-hub .ah-att-team-nudge.is-urgent {
  background: linear-gradient(145deg, #EF5350 0%, #C62828 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgba(198, 40, 40, 0.3) !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-team-view,
body.mt-tissue-brand #s-attendance-hub .ah-att-view-btn {
  background: rgba(255, 255, 255, 0.88) !important;
  color: var(--mt-tissue-blue-700, #0F4C81) !important;
  border-radius: 16px !important;
  border: none !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-team-acc-chip {
  background: rgba(245, 248, 252, 0.9) !important;
  color: var(--mt-tissue-text, #3d4f63) !important;
  border-radius: 999px !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-map {
  border: none !important;
  border-radius: 20px !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-map-filter {
  background: rgba(255, 255, 255, 0.88) !important;
  color: var(--mt-tissue-muted, #6b7f94) !important;
  border-radius: 999px !important;
  border: none !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-map-filter.on {
  background: linear-gradient(145deg, #D6E8F7 0%, #1E88E5 100%) !important;
  color: #fff !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-map-online-item,
body.mt-tissue-brand #s-attendance-hub .ah-att-map-chip {
  background: rgba(255, 255, 255, 0.92) !important;
  border: none !important;
  border-radius: 18px !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-map-online-item.on,
body.mt-tissue-brand #s-attendance-hub .ah-att-map-online-item:active,
body.mt-tissue-brand #s-attendance-hub .ah-att-map-chip.on,
body.mt-tissue-brand #s-attendance-hub .ah-att-map-chip:active {
  background: linear-gradient(145deg, rgba(220, 238, 251, 0.95) 0%, rgba(184, 217, 242, 0.65) 100%) !important;
  box-shadow: 0 0 0 2px rgba(143, 193, 232, 0.35);
}

body.mt-tissue-brand #s-attendance-hub .ah-att-pending-banner {
  background: linear-gradient(145deg, #fff8ee 0%, #fde8c8 100%) !important;
  border: none !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-zone-toggle {
  background: linear-gradient(145deg, rgba(220, 238, 251, 0.9) 0%, rgba(245, 248, 252, 0.7) 100%) !important;
  color: var(--mt-tissue-blue-700, #0F4C81) !important;
  border-radius: 16px 16px 0 0;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-zone-filter select,
body.mt-tissue-brand #s-attendance-hub .ah-att-schedule-toggle {
  border: none !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand #s-attendance-hub #ah-att-osa-checkout-warn {
  background: linear-gradient(145deg, #F0F6FC 0%, #E3EEF8 100%) !important;
  border: none !important;
  border-radius: 16px !important;
  color: #b85c6e !important;
}

body.mt-tissue-brand #s-attendance-hub .ah-att-checkin-in-time {
  background: rgba(200, 230, 212, 0.45) !important;
  border: none !important;
  border-radius: 14px !important;
  color: #3d8b5a !important;
}

/* Modals */
body.mt-tissue-brand .ah-att-modal,
body.mt-tissue-brand .ah-att-popup {
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 248, 252, 0.94) 100%) !important;
  border-radius: 28px 28px 0 0 !important;
  box-shadow: var(--mt-tissue-shadow-lg) !important;
}

body.mt-tissue-brand .ah-att-modal-hdr,
body.mt-tissue-brand .ah-att-popup-hdr {
  background: transparent !important;
  border-bottom-color: rgba(143, 193, 232, 0.2) !important;
}

body.mt-tissue-brand .ah-att-modal-card,
body.mt-tissue-brand .ah-att-pending-item {
  border: none !important;
  border-radius: 20px !important;
  box-shadow: var(--mt-tissue-shadow-sm) !important;
  background: rgba(255, 255, 255, 0.92) !important;
}

body.mt-tissue-brand .ah-att-modal-close {
  background: rgba(245, 248, 252, 0.9) !important;
  border-radius: 14px !important;
  color: var(--mt-tissue-blue-700, #0F4C81) !important;
}

body.mt-tissue-brand .ah-att-popup-field select,
body.mt-tissue-brand .ah-att-popup-field input,
body.mt-tissue-brand .ah-att-popup-field textarea {
  border: none !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: var(--mt-tissue-shadow-sm);
}

body.mt-tissue-brand .ah-att-popup-actions .btn-submit {
  background: linear-gradient(145deg, #D6E8F7 0%, #1E88E5 100%) !important;
  color: #fff !important;
  border-radius: 999px !important;
}

body.mt-tissue-brand .ah-att-popup-actions .btn-cancel {
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--mt-tissue-muted, #6b7f94) !important;
  border-radius: 999px !important;
}

/* Mobile shell override */
body.mt-tissue-brand.mobile-app-enabled:not(.mobile-app-deep) #s-attendance-hub .ah-att-top {
  background: transparent !important;
  box-shadow: none !important;
}

body.mt-tissue-brand.mobile-app-enabled:not(.mobile-app-deep) #s-attendance-hub .ah-att-tabs {
  box-shadow: none !important;
}

@media (max-width: 959px) {
  body.mt-tissue-brand #s-attendance-hub .ah-att-night-card {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(240, 246, 252, 0.75) 100%) !important;
  }

  body.mt-tissue-brand #s-attendance-hub .ah-att-btn-night {
    width: 100%;
    padding: 10px 14px;
  }
}