/* Trip2Event: account pages (My Profile, My app) */
.acc-body { min-height: 60dvh; padding-top: clamp(2rem, 5vw, 3.5rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
.acc-body .notice { margin-bottom: 1.25rem; }
.acc-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem; padding: clamp(1.3rem, 3vw, 2rem); border-radius: var(--r-xl); margin-bottom: 1.25rem; }
.acc-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 999px; background: var(--blush); }
.acc-tabs button { min-height: 46px; border: 0; border-radius: 999px; background: transparent; font-weight: 800; color: rgba(10, 10, 10, .7); transition: background-color .2s, color .2s; }
.acc-tabs button[aria-selected="true"] { background: var(--crimson); color: #fff; }
.acc-tabs button:focus-visible { outline: 2px solid var(--crimson); outline-offset: 2px; }
.acc-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.acc-form[hidden], .acc-card[hidden], #profilePanel[hidden], [data-google-wrap][hidden] { display: none; }
.acc-links { text-align: center; }
.link-btn { background: none; border: 0; padding: .4rem; color: var(--crimson); font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
.acc-fine { color: var(--fg-3); font-size: .875rem; }
.acc-fine .link, .acc-form .link { color: var(--crimson); font-weight: 700; }
.acc-id { display: flex; gap: 1rem; align-items: center; }
.acc-avatar { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--crimson); color: #fff; font-family: var(--font-display); font-size: 1.7rem; flex: none; }
.acc-id__text { min-width: 0; }
.acc-id__text p { color: var(--fg-2); word-break: break-word; }
.acc-plan { display: inline-block; margin-top: .35rem; padding: .25rem .7rem; border-radius: 999px; background: rgba(171, 29, 113, .1); color: var(--crimson) !important; font-weight: 800; font-size: .85rem; }
.acc-plan[hidden] { display: none; }
.acc-facts { display: grid; gap: 0; margin: 0; }
.acc-facts div { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-top: 1px solid var(--glass-line); }
.acc-facts dt { color: var(--fg-3); font-weight: 600; }
.acc-facts dd { margin: 0; font-weight: 700; text-align: right; word-break: break-word; }

/* My app */
.myapp-tabs { display: flex; gap: .6rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.myapp-pane[hidden] { display: none; }
.myapp-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
@media (min-width: 640px) { .myapp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .myapp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.myapp-card { display: flex; align-items: center; gap: 1rem; width: 100%; padding: 1.1rem 1.2rem; border-radius: 24px; text-align: left; color: var(--fg); border: 1px solid var(--glass-line); background: var(--glass); cursor: pointer; transition: transform .25s var(--ease), box-shadow .25s; }
.myapp-card:hover { transform: translateY(-3px); box-shadow: var(--glass-shadow); }
.myapp-card:focus-visible { outline: 2px solid var(--crimson); outline-offset: 3px; }
.myapp-card__ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 16px; background: var(--blush); color: var(--crimson); flex: none; }
.myapp-card__body { min-width: 0; flex: 1; }
.myapp-card__title { display: block; font-weight: 800; font-size: 1.05rem; line-height: 1.25; overflow-wrap: anywhere; }
.myapp-card__meta { display: block; color: var(--fg-3); font-size: .9rem; margin-top: .15rem; }
.myapp-card .go { color: rgba(10, 10, 10, .35); flex: none; }
.myapp-empty { padding: 2rem 1.4rem; text-align: center; border-radius: var(--r-lg); display: grid; justify-items: center; gap: .6rem; }
.myapp-empty p { color: var(--fg-2); max-width: 40ch; }
.myapp-loading { color: var(--fg-3); padding: 1rem 0; }
.myapp-note { color: var(--fg-3); font-size: .9rem; margin-top: 1.25rem; }

.pkg { display: flex; flex-direction: column; gap: .8rem; padding: 1.4rem; border-radius: var(--r-lg); }
.pkg.is-current { border-color: var(--crimson); box-shadow: inset 0 0 0 1.5px var(--crimson), var(--glass-shadow); }
.pkg__top { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.pkg__name { font-family: var(--font-display); font-size: 1.5rem; line-height: 1.1; }
.pkg__price { font-family: var(--font-display); font-size: 1.9rem; color: var(--crimson); line-height: 1; }
.pkg__badge { background: var(--crimson); color: #fff; font-size: .75rem; font-weight: 800; padding: .3rem .7rem; border-radius: 999px; white-space: nowrap; }
.pkg .checks li { font-size: .92rem; font-weight: 600; }
.pkg .checks li.is-off { color: var(--fg-3); font-weight: 500; }
.pkg .checks li.is-off .i { color: var(--fg-3); }
.pkg__buy { margin-top: auto; padding-top: .3rem; }

/* Continue with Google */
.acc-or { display: flex; align-items: center; gap: .9rem; color: var(--fg-3); font-weight: 700; font-size: .9rem; }
.acc-or::before, .acc-or::after { content: ""; flex: 1; height: 1px; background: var(--glass-line); }
.acc-google { display: grid; justify-items: center; gap: .8rem; text-align: center; }
.acc-google #googleBtn { min-height: 44px; display: flex; justify-content: center; max-width: 100%; }
.acc-google .notice { text-align: left; }

/* My tickets (on My Profile) */
.pt-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; }
.pt { border-radius: var(--r-lg); border: 1px solid var(--glass-line); background: var(--glass-strong); overflow: hidden; }
.pt > summary { display: flex; align-items: center; gap: .9rem; padding: .85rem 1rem; cursor: pointer; list-style: none; }
.pt > summary::-webkit-details-marker { display: none; }
.pt > summary:focus-visible { outline: 2px solid var(--crimson); outline-offset: -2px; }
.pt__thumb { flex: none; width: 54px; height: 54px; border-radius: 16px; background: linear-gradient(135deg, var(--a, #AB1D71), var(--b, #6D1248)); }
.pt__sum { min-width: 0; flex: 1; }
.pt__sum b { display: block; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.pt__sum small { display: block; color: var(--fg-3); font-size: .875rem; font-weight: 600; }
.pt__chev { flex: none; color: rgba(10, 10, 10, .4); transition: transform .2s; }
.pt[open] .pt__chev { transform: rotate(90deg); }
.pt__body { display: grid; justify-items: center; gap: 1rem; padding: .2rem 1rem 1.1rem; }
.pt__qr { width: min(210px, 70%); aspect-ratio: 1; padding: 8px; border-radius: 18px; background: #fff; border: 1px solid var(--glass-line); }
.pt__qr svg { width: 100%; height: 100%; display: block; shape-rendering: crispEdges; }
.pt__id { font-weight: 800; font-size: 1.15rem; letter-spacing: .04em; text-align: center; }
.pt__id small { display: block; color: var(--fg-3); font-size: .8rem; letter-spacing: 0; font-weight: 600; }
.pt__facts { width: 100%; margin: 0; display: grid; }
.pt__facts div { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-top: 1px solid var(--glass-line); }
.pt__facts dt { color: var(--fg-3); font-weight: 600; }
.pt__facts dd { margin: 0; font-weight: 700; text-align: right; overflow-wrap: anywhere; }
.pt__note { width: 100%; padding: .7rem .9rem; border-radius: 14px; background: rgba(179, 18, 58, .08); color: #8E0F2F; font-weight: 700; text-align: center; }
.pt__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
