/* MotoTribo UI refinement - loaded after biker.css. */

:root {
    --mototribo-topbar-height: 72px;
    --mototribo-content-max: 1240px;
    --mototribo-radius: 14px;
}

/* Busca unificada */
.mototribo-search-page { max-width: 1180px; margin: 0 auto; color: #171A1D; }
.search-hero { position: relative; overflow: hidden; padding: 2.1rem; border-radius: 18px; color: #fff; background: linear-gradient(125deg, #103F45 0%, #176B73 68%, #20808A 100%); box-shadow: 0 18px 40px rgba(23,107,115,.18); }
.search-hero::after { content: ""; position: absolute; right: -58px; top: -82px; width: 265px; height: 295px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 270'%3E%3Cpolygon points='120,10 220,68 220,202 120,260 20,202 20,68' fill='none' stroke='%23e9a23b' stroke-opacity='.18' stroke-width='16' stroke-linejoin='round'/%3E%3Cpolygon points='120,38 194,81 194,189 120,232 46,189 46,81' fill='none' stroke='%23e9a23b' stroke-opacity='.13' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; transform: rotate(8deg); }
.search-hero-copy { position: relative; z-index: 1; max-width: 690px; }
.search-eyebrow { display: block; margin-bottom: .35rem; color: #E9A23B; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.search-hero h1 { margin-bottom: .45rem; color: #fff; font-size: clamp(1.55rem, 3vw, 2.25rem); }
.search-hero p { margin: 0; color: rgba(255,255,255,.76); }
.search-main-form { position: relative; z-index: 2; display: flex; align-items: center; gap: .7rem; max-width: 850px; margin-top: 1.55rem; padding: .4rem; padding-left: 1rem; background: #fff; border-radius: 12px; box-shadow: 0 12px 25px rgba(0,0,0,.13); }
.search-main-form > i { color: #176B73; font-size: 1.25rem; }
.search-main-form input { flex: 1; min-width: 0; padding: .7rem 0; border: 0; outline: 0; color: #25282A; background: transparent; }
.search-main-form button { min-height: 43px; padding: .55rem 1.4rem; border: 0; border-radius: 9px; color: #171A1D; background: #E9A23B; font-weight: 800; }
.search-welcome-state, .search-empty-state { margin-top: 1rem; padding: 3.5rem 1rem; text-align: center; background: #fff; border-radius: 16px; box-shadow: 0 10px 28px rgba(23,26,29,.06); }
.search-state-icon { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-bottom: 1rem; color: #176B73; background: #E8F3F3; border-radius: 18px; font-size: 1.8rem; }
.search-welcome-state h2, .search-empty-state h2 { margin-bottom: .35rem; font-size: 1.25rem; }
.search-welcome-state p, .search-empty-state p { color: #7B8387; }
.search-suggestions { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-top: 1.25rem; }
.search-suggestions span, .search-query-chip { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .75rem; color: #536064; background: #F2F6F5; border-radius: 999px; font-size: .76rem; font-weight: 700; }
.search-error-state .search-state-icon { color: #B65246; background: #FAECEA; }
.search-result-summary { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding: 1.8rem .2rem 1rem; }
.search-result-summary h2 { margin: 0; font-size: 1.3rem; }
.search-section { margin-bottom: 1rem; padding: 1.25rem; background: #fff; border-radius: 16px; box-shadow: 0 10px 28px rgba(23,26,29,.055); }
.search-section > header { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.search-section > header h3 { margin: 0; font-size: 1rem; }
.search-section > header p { margin: .1rem 0 0; color: #8A9295; font-size: .73rem; }
.search-section-icon, .search-card-placeholder { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 42px; height: 42px; color: #176B73; background: #E8F3F3; border-radius: 11px; font-size: 1.15rem; }
.search-count { margin-left: auto; min-width: 27px; padding: .25rem .5rem; text-align: center; color: #176B73; background: #E8F3F3; border-radius: 999px; font-size: .72rem; font-weight: 800; }
.search-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.search-person-card, .search-detail-card { display: flex; align-items: center; gap: .8rem; min-width: 0; padding: .85rem; color: inherit; background: #F7F9F8; border: 1px solid #EDF1F0; border-radius: 12px; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.search-person-card:hover, .search-detail-card:hover { color: inherit; border-color: rgba(23,107,115,.35); box-shadow: 0 8px 20px rgba(23,107,115,.08); transform: translateY(-2px); }
.search-person-card > img { flex: 0 0 auto; width: 54px; height: 54px; object-fit: cover; border: 2px solid #fff; border-radius: 14px; box-shadow: 0 4px 12px rgba(23,26,29,.1); }
.search-person-card > div, .search-detail-card > div { display: grid; min-width: 0; flex: 1; }
.search-person-card strong, .search-detail-card strong { overflow: hidden; color: #25282A; font-size: .86rem; text-overflow: ellipsis; white-space: nowrap; }
.search-person-card span, .search-detail-card span { overflow: hidden; margin-top: .16rem; color: #727B7E; font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.search-person-card .search-card-handle { margin-top: .08rem; color: #176B73; font-weight: 700; }
.search-person-card small, .search-detail-card small { margin-top: .2rem; color: #90989A; font-size: .68rem; }
.search-person-card > .ph-caret-right { color: #176B73; }
@media (max-width: 767.98px) { .search-hero { padding: 1.4rem 1rem; border-radius: 14px; } .search-main-form { padding-left: .75rem; } .search-main-form button { padding: .55rem .8rem; } .search-card-grid { grid-template-columns: 1fr; } .search-result-summary { align-items: flex-start; flex-direction: column; } }

/* Ficha de emergência */
.mototribo-emergency-page { max-width: 1180px; margin: 0 auto; color: #25282A; }
.emergency-hero { position: relative; display: flex; align-items: center; gap: 1rem; min-height: 145px; padding: 1.6rem 1.8rem; overflow: hidden; color: #fff; background: linear-gradient(125deg, #103F45 0%, #176B73 72%, #1E7982 100%); border-radius: 17px; box-shadow: 0 16px 38px rgba(23,107,115,.17); }
.emergency-hero::after, .garage-hero::after { position: absolute; top: -82px; right: -58px; width: 265px; height: 295px; content: ""; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 270'%3E%3Cpolygon points='120,10 220,68 220,202 120,260 20,202 20,68' fill='none' stroke='%23e9a23b' stroke-opacity='.18' stroke-width='16' stroke-linejoin='round'/%3E%3Cpolygon points='120,38 194,81 194,189 120,232 46,189 46,81' fill='none' stroke='%23e9a23b' stroke-opacity='.13' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; transform: rotate(8deg); pointer-events: none; }
.emergency-hero > *, .garage-hero > * { position: relative; z-index: 1; }
.emergency-hero-icon { display: grid; place-items: center; flex: 0 0 auto; width: 64px; height: 64px; color: #fff; background: #C9574D; border: 5px solid rgba(255,255,255,.15); border-radius: 18px; font-size: 1.7rem; }
.emergency-hero-copy { flex: 1; min-width: 0; }
.emergency-hero-copy > span, .emergency-section-heading small, .emergency-contact-form-wrap > div small, .emergency-edit-guidance > span + h2::before { color: #E9A23B; font-size: .65rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.emergency-hero-copy h1 { margin: .18rem 0 .25rem; color: #fff; font-size: clamp(1.45rem, 3vw, 2rem); }
.emergency-hero-copy p { max-width: 650px; margin: 0; color: rgba(255,255,255,.74); font-size: .8rem; }
.emergency-status { display: inline-flex; align-items: center; gap: .35rem; padding: .5rem .7rem; border-radius: 999px; font-size: .7rem; font-weight: 800; white-space: nowrap; }
.emergency-status.is-active { color: #DDF8EC; background: rgba(47,158,119,.24); }
.emergency-status.is-inactive { color: #FFE0DD; background: rgba(201,87,77,.26); }
.emergency-edit-button, .emergency-back-button { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 39px; padding: .5rem .85rem; color: #103F45; background: #fff; border: 0; border-radius: 9px; font-size: .73rem; font-weight: 800; white-space: nowrap; }
.emergency-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(320px, .85fr); gap: 1rem; margin-top: 1rem; }
.emergency-main-column, .emergency-side-column { display: grid; align-content: start; gap: 1rem; min-width: 0; }
.emergency-vital-card, .emergency-contacts-card, .emergency-guidance-card, .emergency-edit-card, .emergency-edit-guidance, .emergency-empty-state { margin: 0; padding: 1.3rem; border: 1px solid rgba(37,40,42,.07); border-radius: 15px; box-shadow: 0 9px 28px rgba(23,26,29,.055); }
.emergency-section-heading { display: flex; align-items: center; gap: .7rem; margin-bottom: 1rem; }
.emergency-section-heading > span { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; color: #176B73; background: #E8F2F2; border-radius: 11px; font-size: 1.15rem; }
.emergency-section-heading h2 { margin: .1rem 0 0; font-size: 1rem; }
.emergency-section-heading b { display: grid; place-items: center; min-width: 26px; height: 26px; margin-left: auto; color: #176B73; background: #E8F2F2; border-radius: 50%; font-size: .68rem; }
.emergency-blood-panel { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 1rem; align-items: center; padding: 1rem 1.15rem; color: #6E312C; background: linear-gradient(110deg, #FCECEA, #FFF8F7); border: 1px solid #F4D4D0; border-radius: 12px; }
.emergency-blood-panel > span { grid-column: 2; color: #A95A52; font-size: .65rem; font-weight: 800; text-transform: uppercase; }
.emergency-blood-panel strong { grid-row: 1 / 3; display: grid; place-items: center; min-width: 70px; min-height: 62px; color: #fff; background: #C9574D; border-radius: 13px; font-size: 1.5rem; }
.emergency-blood-panel small { grid-column: 2; color: #8D6864; font-size: .7rem; }
.emergency-medical-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; margin-top: .8rem; }
.emergency-info-card { display: flex; gap: .7rem; min-width: 0; padding: .9rem; background: #F7F9F8; border: 1px solid #EBEFEE; border-radius: 11px; }
.emergency-info-card > span { display: grid; place-items: center; flex: 0 0 auto; width: 35px; height: 35px; color: #176B73; background: #E8F2F2; border-radius: 9px; }
.emergency-info-card.is-warning > span { color: #B87920; background: #FFF1DC; }
.emergency-info-card small { color: #969D9F; font-size: .58rem; font-weight: 800; text-transform: uppercase; }
.emergency-info-card h3 { margin: .1rem 0 .28rem; font-size: .78rem; }
.emergency-info-card p { margin: 0; color: #697174; font-size: .72rem; line-height: 1.45; white-space: pre-line; }
.emergency-vital-card > footer { margin-top: 1rem; padding-top: .8rem; color: #92999B; border-top: 1px solid #EDF0EF; font-size: .65rem; }
.emergency-inline-empty { display: flex; align-items: center; gap: .5rem; margin-top: .8rem; padding: .8rem; color: #6E777A; background: #F5F7F7; border-radius: 10px; font-size: .72rem; }
.emergency-guidance-card { display: flex; align-items: center; gap: 1rem; background: linear-gradient(110deg, #FFF8EC, #fff); }
.emergency-guidance-card > span { display: grid; place-items: center; flex: 0 0 auto; width: 50px; height: 50px; color: #B87920; background: #FFF0D7; border-radius: 13px; font-size: 1.35rem; }
.emergency-guidance-card small { color: #B87920; font-size: .6rem; font-weight: 800; text-transform: uppercase; }
.emergency-guidance-card h2 { margin: .12rem 0 .25rem; font-size: .88rem; }
.emergency-guidance-card p { margin: 0; color: #757D7F; font-size: .71rem; line-height: 1.5; }
.emergency-contact-list { display: grid; gap: .55rem; }
.emergency-contact-item { display: flex; align-items: center; gap: .65rem; padding: .75rem; background: #F7F9F8; border: 1px solid #EBEFEE; border-radius: 11px; }
.emergency-contact-priority { display: grid; place-items: center; flex: 0 0 auto; width: 30px; height: 30px; color: #fff; background: #176B73; border-radius: 9px; font-size: .7rem; font-weight: 900; }
.emergency-contact-item > div { flex: 1; min-width: 0; }
.emergency-contact-item h3 { overflow: hidden; margin: 0; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.emergency-contact-item p { margin: .1rem 0; color: #8A9294; font-size: .64rem; }
.emergency-contact-item a { color: #176B73; font-size: .69rem; font-weight: 750; }
.emergency-contact-item form button { display: grid; place-items: center; width: 30px; height: 30px; color: #B85A52; background: #FAECEA; border: 0; border-radius: 8px; }
.emergency-contact-empty { padding: 1.1rem; text-align: center; color: #8A9294; background: #F7F9F8; border-radius: 11px; }
.emergency-contact-empty > i { color: #176B73; font-size: 1.5rem; }.emergency-contact-empty p { margin: .25rem 0 0; color: #596164; font-size: .75rem; font-weight: 800; }.emergency-contact-empty small { font-size: .65rem; }
.emergency-contact-form-wrap { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #EBEFEE; }
.emergency-contact-form-wrap h3 { margin: .12rem 0 .7rem; font-size: .84rem; }
.emergency-contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
.emergency-contact-form label, .emergency-field { display: grid; gap: .27rem; margin: 0; }
.emergency-contact-form label > span, .emergency-field > span:first-child { color: #596164; font-size: .65rem; font-weight: 800; }
.emergency-contact-form input, .emergency-contact-form select, .emergency-field input, .emergency-field select, .emergency-field textarea { width: 100%; min-height: 40px; padding: .55rem .7rem; color: #303537; background: #F8FAF9; border: 1px solid #DDE4E2; border-radius: 9px; font-size: .72rem; outline: none; }
.emergency-contact-form input:focus, .emergency-contact-form select:focus, .emergency-field input:focus, .emergency-field select:focus, .emergency-field textarea:focus { background: #fff; border-color: #176B73; box-shadow: 0 0 0 3px rgba(23,107,115,.09); }
.emergency-primary-button { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 40px; padding: .55rem .85rem; color: #fff; background: #176B73; border: 0; border-radius: 9px; font-size: .72rem; font-weight: 800; }
.emergency-contact-form .emergency-primary-button { grid-column: 1 / -1; }
.emergency-empty-state { display: flex; align-items: center; flex-direction: column; min-height: 330px; margin-top: 1rem; justify-content: center; text-align: center; }
.emergency-empty-state > span { display: grid; place-items: center; width: 66px; height: 66px; margin-bottom: 1rem; color: #176B73; background: #E8F2F2; border-radius: 18px; font-size: 1.8rem; }
.emergency-empty-state h2 { margin: 0 0 .35rem; font-size: 1.1rem; }.emergency-empty-state p { max-width: 520px; color: #7B8387; font-size: .78rem; }
.emergency-edit-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .7fr); gap: 1rem; margin-top: 1rem; }.emergency-edit-layout > .alert { grid-column: 1 / -1; margin: 0; }
.emergency-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }.emergency-field-wide { grid-column: 1 / -1; }.emergency-field > small { color: #92999B; font-size: .63rem; }.emergency-field textarea { resize: vertical; line-height: 1.5; }.emergency-field > span.field-validation-error { color: #B75249; font-size: .64rem; }
.emergency-edit-guidance { position: sticky; top: calc(var(--mototribo-topbar-height) + 1rem); align-self: start; }.emergency-edit-guidance > span { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: .8rem; color: #176B73; background: #E8F2F2; border-radius: 14px; font-size: 1.35rem; }.emergency-edit-guidance h2 { margin: 0 0 .35rem; font-size: .95rem; }.emergency-edit-guidance p { color: #778083; font-size: .72rem; line-height: 1.5; }.emergency-edit-guidance ul { display: grid; gap: .5rem; margin: 1rem 0; padding: 0; list-style: none; }.emergency-edit-guidance li { display: flex; gap: .4rem; color: #616A6D; font-size: .68rem; }.emergency-edit-guidance li i { color: #176B73; }.emergency-edit-actions { display: grid; gap: .5rem; margin-top: 1.2rem; }.emergency-cancel-button { color: #626B6E; background: #EDF1F0; border: 0; font-size: .72rem; font-weight: 800; }
@media (max-width: 991.98px) { .emergency-layout, .emergency-edit-layout { grid-template-columns: 1fr; }.emergency-edit-guidance { position: static; }.emergency-side-column { order: 2; } }
@media (max-width: 767.98px) { .emergency-hero { align-items: flex-start; flex-wrap: wrap; padding: 1.25rem 1rem; }.emergency-hero-copy { flex-basis: calc(100% - 80px); }.emergency-status { margin-left: 80px; }.emergency-edit-button, .emergency-back-button { margin-left: auto; }.emergency-medical-grid, .emergency-form-grid { grid-template-columns: 1fr; }.emergency-field-wide { grid-column: auto; } }
@media (max-width: 479.98px) { .emergency-hero-icon { width: 52px; height: 52px; }.emergency-hero-copy { flex-basis: calc(100% - 68px); }.emergency-status { margin-left: 0; }.emergency-edit-button, .emergency-back-button { flex: 1; }.emergency-contact-form { grid-template-columns: 1fr; }.emergency-contact-form .emergency-primary-button { grid-column: auto; }.emergency-blood-panel { grid-template-columns: 58px 1fr; }.emergency-blood-panel strong { min-width: 58px; min-height: 56px; }.emergency-guidance-card { align-items: flex-start; }.emergency-vital-card, .emergency-contacts-card, .emergency-guidance-card, .emergency-edit-card, .emergency-edit-guidance { padding: 1rem; } }

.emergency-qr-card { margin: 0; padding: 1.3rem; border: 1px solid rgba(37,40,42,.07); border-radius: 15px; box-shadow: 0 9px 28px rgba(23,26,29,.055); }
.emergency-qr-content { display: grid; grid-template-columns: 185px 1fr; gap: 1.25rem; align-items: center; }
.emergency-qr-preview { position: relative; padding: .8rem .8rem 1.65rem; text-align: center; background: #fff; border: 1px solid #DDE5E3; border-radius: 13px; box-shadow: 0 7px 20px rgba(23,26,29,.08); }
.emergency-qr-preview[hidden], .emergency-qr-download[hidden] { display: none !important; }
.emergency-qr-preview img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; }
.emergency-qr-preview span { position: absolute; right: 0; bottom: .45rem; left: 0; color: #176B73; font-size: .62rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.emergency-qr-copy h3 { margin: 0 0 .3rem; font-size: .9rem; }.emergency-qr-copy p { margin: 0 0 .8rem; color: #747D80; font-size: .72rem; line-height: 1.5; }.emergency-qr-copy label { display: block; margin-bottom: .3rem; color: #596164; font-size: .65rem; font-weight: 800; }.emergency-qr-copy select { width: 100%; min-height: 40px; padding: .5rem .65rem; color: #303537; background: #F8FAF9; border: 1px solid #DDE4E2; border-radius: 9px; font-size: .72rem; }.emergency-qr-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }.emergency-qr-download { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; min-height: 40px; padding: .55rem .8rem; color: #176B73; background: #E8F2F2; border: 0; border-radius: 9px; font-size: .72rem; font-weight: 800; }
.emergency-qr-empty { display: flex; align-items: center; gap: .8rem; padding: 1rem; background: #F7F9F8; border-radius: 11px; }.emergency-qr-empty > i { display: grid; place-items: center; width: 46px; height: 46px; color: #176B73; background: #E8F2F2; border-radius: 12px; font-size: 1.3rem; }.emergency-qr-empty h3 { margin: 0; font-size: .8rem; }.emergency-qr-empty p { margin: .15rem 0; color: #7B8387; font-size: .68rem; }.emergency-qr-empty a { color: #176B73; font-size: .68rem; font-weight: 800; }
@media (max-width: 575.98px) { .emergency-qr-content { grid-template-columns: 1fr; }.emergency-qr-preview { width: min(210px, 100%); margin: 0 auto; } }

/* Consulta pública do QR de emergência */
.emergency-public-body { min-height: 100vh; margin: 0; color: #25282A; background: #EEF2F1; font-family: "Plus Jakarta Sans", sans-serif; }.emergency-public-header { display: flex; align-items: center; justify-content: center; height: 72px; background: #103F45; }.emergency-public-header img { width: 175px; height: 54px; object-fit: contain; }.emergency-public-page { width: min(680px, calc(100% - 1.5rem)); margin: 1rem auto 2rem; }.emergency-public-page section { box-sizing: border-box; }
.emergency-public-alert { display: flex; align-items: center; gap: .85rem; padding: 1.2rem; color: #fff; background: linear-gradient(120deg, #A9433B, #C9574D); border-radius: 15px; box-shadow: 0 12px 28px rgba(169,67,59,.18); }.emergency-public-alert > i { display: grid; place-items: center; flex: 0 0 auto; width: 52px; height: 52px; background: rgba(255,255,255,.15); border-radius: 14px; font-size: 1.5rem; }.emergency-public-alert span { font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.emergency-public-alert h1 { margin: .1rem 0 .25rem; color: #fff; font-size: 1.1rem; }.emergency-public-alert p { margin: 0; color: rgba(255,255,255,.84); font-size: .7rem; }.emergency-public-alert a { color: #fff; font-weight: 900; text-decoration: underline; }
.emergency-public-moto { display: flex; align-items: center; gap: .65rem; margin-top: .7rem; padding: .8rem 1rem; background: #fff; border-radius: 12px; }.emergency-public-moto > i { color: #176B73; font-size: 1.35rem; }.emergency-public-moto div { display: grid; }.emergency-public-moto span { color: #92999B; font-size: .58rem; font-weight: 800; text-transform: uppercase; }.emergency-public-moto strong { font-size: .76rem; }
.emergency-public-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .7rem; margin-top: .7rem; }.emergency-public-blood { display: flex; align-items: center; justify-content: space-between; padding: 1rem; color: #8E3932; background: #FCECEA; border: 1px solid #F1CEC9; border-radius: 12px; }.emergency-public-blood span { font-size: .68rem; font-weight: 800; text-transform: uppercase; }.emergency-public-blood strong { font-size: 1.45rem; }.emergency-public-detail { display: flex; gap: .6rem; padding: 1rem; background: #fff; border-radius: 12px; }.emergency-public-detail > i { color: #176B73; font-size: 1.2rem; }.emergency-public-detail.is-alert > i { color: #C17D19; }.emergency-public-detail span { color: #7B8387; font-size: .58rem; font-weight: 800; text-transform: uppercase; }.emergency-public-detail p { margin: .2rem 0 0; font-size: .72rem; line-height: 1.45; white-space: pre-line; }
.emergency-public-contacts { margin-top: .7rem; padding: 1rem; background: #fff; border-radius: 12px; }.emergency-public-contacts h2 { margin: 0 0 .7rem; font-size: .85rem; }.emergency-public-contacts > a { display: flex; align-items: center; gap: .65rem; padding: .7rem; color: inherit; background: #F7F9F8; border-radius: 9px; text-decoration: none; }.emergency-public-contacts > a + a { margin-top: .45rem; }.emergency-public-contacts > a > b { display: grid; place-items: center; width: 29px; height: 29px; color: #fff; background: #176B73; border-radius: 8px; font-size: .68rem; }.emergency-public-contacts > a > span { display: grid; flex: 1; }.emergency-public-contacts strong { font-size: .74rem; }.emergency-public-contacts small { color: #858E90; font-size: .62rem; }.emergency-public-contacts > a > i { color: #176B73; font-size: 1rem; }.emergency-public-footer { padding: 1rem; color: #7C8587; text-align: center; font-size: .62rem; }.emergency-public-error { margin-top: 2rem; padding: 3rem 1rem; text-align: center; background: #fff; border-radius: 15px; }.emergency-public-error > i { color: #C9574D; font-size: 2.5rem; }.emergency-public-error h1 { margin: .7rem 0 .3rem; font-size: 1.15rem; }.emergency-public-error p { color: #7B8387; font-size: .75rem; }
@media (max-width: 575.98px) { .emergency-public-grid { grid-template-columns: 1fr; }.emergency-public-alert { align-items: flex-start; }.emergency-public-header { height: 62px; }.emergency-public-header img { width: 155px; } }

/* Minha garagem */
.mototribo-garage-page { max-width: 1180px; margin: 0 auto; color: #25282A; }.garage-hero { position: relative; display: flex; align-items: center; gap: 1rem; min-height: 145px; padding: 1.6rem 1.8rem; overflow: hidden; color: #fff; background: linear-gradient(125deg,#103F45 0%,#176B73 70%,#207C85 100%); border-radius: 17px; box-shadow: 0 16px 38px rgba(23,107,115,.17); }.garage-hero-icon { display: grid; place-items: center; flex: 0 0 auto; width: 64px; height: 64px; color: #103F45; background: #E9A23B; border: 5px solid rgba(255,255,255,.13); border-radius: 18px; font-size: 1.75rem; }.garage-hero-copy { flex: 1; min-width: 0; }.garage-hero-copy span,.garage-section-heading span { color: #E9A23B; font-size: .65rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }.garage-hero-copy h1 { margin: .18rem 0 .25rem; color: #fff; font-size: clamp(1.45rem,3vw,2rem); }.garage-hero-copy p { margin: 0; color: rgba(255,255,255,.74); font-size: .8rem; }.garage-add-button { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 41px; padding: .55rem .9rem; color: #171A1D; background: #E9A23B; border: 0; border-radius: 9px; font-size: .73rem; font-weight: 850; white-space: nowrap; }
.garage-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 1rem; background: #fff; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.04); }.garage-summary article { display: flex; align-items: center; gap: .7rem; min-width: 0; padding: 1rem; }.garage-summary article + article { border-left: 1px solid #E9EDEC; }.garage-summary article > span { display: grid; place-items: center; flex: 0 0 auto; width: 39px; height: 39px; color: #176B73; background: #E8F2F2; border-radius: 10px; font-size: 1.05rem; }.garage-summary article:nth-child(2) > span { color: #B87920; background: #FFF1DB; }.garage-summary article div { display: grid; min-width: 0; }.garage-summary strong { overflow: hidden; color: #25282A; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }.garage-summary small { margin-top: .15rem; color: #90989A; font-size: .6rem; }
.garage-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding: 1.5rem .15rem .75rem; }.garage-section-heading h2 { margin: .12rem 0 0; font-size: 1.05rem; }.garage-section-heading > small { padding: .35rem .6rem; color: #176B73; background: #E8F2F2; border-radius: 999px; font-size: .65rem; font-weight: 800; }.garage-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }.garage-motorcycle-card { overflow: hidden; margin: 0; border: 1px solid rgba(37,40,42,.07); border-radius: 15px; box-shadow: 0 9px 28px rgba(23,26,29,.055); transition: transform .17s ease,box-shadow .17s ease; }.garage-motorcycle-card:hover { box-shadow: 0 15px 34px rgba(23,26,29,.1); transform: translateY(-3px); }.garage-motorcycle-card.is-primary { border-color: rgba(233,162,59,.55); }.garage-card-cover { position: relative; display: block; height: 195px; overflow: hidden; background: linear-gradient(140deg,#DDE7E5,#BFCFCD); }.garage-card-cover > img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }.garage-motorcycle-card:hover .garage-card-cover > img { transform: scale(1.035); }.garage-card-cover > span { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: .4rem; width: 100%; height: 100%; color: #176B73; }.garage-card-cover > span i { font-size: 2.8rem; }.garage-card-cover > span small { font-size: .65rem; }.garage-card-cover-shade { position: absolute; inset: 0; background: linear-gradient(180deg,transparent 50%,rgba(12,35,38,.7)); pointer-events: none; }.garage-card-cover b,.garage-card-cover em { position: absolute; z-index: 1; bottom: .7rem; padding: .34rem .55rem; border-radius: 7px; font-size: .61rem; font-style: normal; }.garage-card-cover b { left: .7rem; color: #27200F; background: #E9A23B; }.garage-card-cover em { right: .7rem; color: #fff; background: rgba(15,21,22,.67); letter-spacing: .08em; }.garage-card-body { padding: 1rem; }.garage-card-title { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }.garage-card-title span { display: block; color: #8B9395; font-size: .61rem; }.garage-card-title h3 { overflow: hidden; margin: .12rem 0 0; font-size: .92rem; text-overflow: ellipsis; white-space: nowrap; }.garage-card-title > div { min-width: 0; }.garage-card-title > a { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; color: #176B73; background: #E8F2F2; border-radius: 9px; }.garage-card-specs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: .85rem 0; padding: .7rem 0; border-top: 1px solid #EDF0EF; border-bottom: 1px solid #EDF0EF; }.garage-card-specs > span { display: grid; min-width: 0; padding: 0 .45rem; }.garage-card-specs > span + span { border-left: 1px solid #E7EBEA; }.garage-card-specs i { color: #176B73; font-size: .85rem; }.garage-card-specs strong { overflow: hidden; margin-top: .22rem; font-size: .67rem; text-overflow: ellipsis; white-space: nowrap; }.garage-card-specs small { color: #969D9F; font-size: .55rem; }.garage-card-actions { display: flex; gap: .5rem; }.garage-maintenance-button,.garage-qr-button { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; border-radius: 9px; font-size: .69rem; font-weight: 800; }.garage-maintenance-button { flex: 1; gap: .35rem; color: #fff; background: #176B73; }.garage-qr-button { width: 40px; color: #176B73; background: #E8F2F2; font-size: 1rem; }.garage-card-secondary-actions { display: flex; gap: .45rem; margin-top: .5rem; }.garage-card-secondary-actions form:first-child { flex: 1; }.garage-card-secondary-actions button { display: inline-flex; align-items: center; justify-content: center; gap: .3rem; width: 100%; min-height: 34px; padding: .4rem .55rem; color: #73613F; background: #FFF4E4; border: 0; border-radius: 8px; font-size: .62rem; font-weight: 800; }.garage-card-secondary-actions button.is-danger { width: 35px; color: #B3544B; background: #FAECEA; }.garage-new-card { display: flex; align-items: center; justify-content: center; flex-direction: column; min-height: 380px; padding: 1.5rem; color: #697174; text-align: center; background: rgba(255,255,255,.5); border: 2px dashed #C9D6D4; border-radius: 15px; }.garage-new-card:hover { color: #176B73; background: #fff; border-color: #176B73; }.garage-new-card > span { display: grid; place-items: center; width: 54px; height: 54px; color: #176B73; background: #E8F2F2; border-radius: 15px; font-size: 1.4rem; }.garage-new-card h3 { margin: .75rem 0 .2rem; font-size: .88rem; }.garage-new-card p { margin: 0; color: #92999B; font-size: .68rem; }.garage-empty-state { display: flex; align-items: center; justify-content: center; flex-direction: column; min-height: 360px; margin-top: 1rem; padding: 2rem; text-align: center; border: 1px solid rgba(37,40,42,.07); border-radius: 15px; }.garage-empty-state > span { display: grid; place-items: center; width: 68px; height: 68px; color: #176B73; background: #E8F2F2; border-radius: 18px; font-size: 2rem; }.garage-empty-state h2 { margin: .85rem 0 .3rem; font-size: 1.05rem; }.garage-empty-state p { max-width: 530px; color: #7B8387; font-size: .76rem; }.garage-primary-button { display: inline-flex; align-items: center; gap: .35rem; color: #fff; background: #176B73; border: 0; font-size: .72rem; font-weight: 800; }
@media (max-width: 991.98px) { .garage-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }.garage-summary article:nth-child(3) { border-left: 0; border-top: 1px solid #E9EDEC; }.garage-summary article:nth-child(4) { border-top: 1px solid #E9EDEC; }.garage-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 767.98px) { .garage-hero { align-items: flex-start; flex-wrap: wrap; padding: 1.25rem 1rem; }.garage-hero-copy { flex-basis: calc(100% - 80px); }.garage-add-button { margin-left: auto; }.garage-grid { grid-template-columns: 1fr; }.garage-new-card { min-height: 180px; } }
@media (max-width: 479.98px) { .garage-hero-icon { width: 52px; height: 52px; }.garage-hero-copy { flex-basis: calc(100% - 68px); }.garage-add-button { width: 100%; }.garage-summary { grid-template-columns: 1fr; }.garage-summary article + article { border-top: 1px solid #E9EDEC; border-left: 0; }.garage-card-cover { height: 185px; } }

.garage-details-hero { position: relative; height: 340px; overflow: hidden; color: #fff; background: #164B51; border-radius: 17px 17px 0 0; }.garage-details-hero > img,.garage-details-placeholder { width: 100%; height: 100%; object-fit: cover; }.garage-details-placeholder { display: grid; place-items: center; color: rgba(255,255,255,.55); background: linear-gradient(140deg,#176B73,#103F45); font-size: 5rem; }.garage-details-overlay { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(8,25,27,.15),rgba(8,25,27,.82)); }.garage-details-back { position: absolute; top: 1rem; left: 1rem; display: inline-flex; align-items: center; gap: .35rem; padding: .5rem .7rem; color: #fff; background: rgba(13,35,38,.62); border-radius: 9px; backdrop-filter: blur(6px); font-size: .68rem; font-weight: 800; }.garage-details-identity { position: absolute; right: 1.4rem; bottom: 1.2rem; left: 1.4rem; }.garage-details-identity > span { color: #E9A23B; font-size: .65rem; font-weight: 800; text-transform: uppercase; }.garage-details-identity h1 { margin: .15rem 0; color: #fff; font-size: 1.65rem; }.garage-details-identity p { margin: 0; color: rgba(255,255,255,.78); font-size: .72rem; }.garage-details-identity b { margin-left: .4rem; padding: .25rem .45rem; color: #fff; background: rgba(0,0,0,.4); border-radius: 6px; font-size: .6rem; letter-spacing: .08em; }.garage-details-primary { position: absolute; right: 1rem; top: 1rem; padding: .42rem .6rem; color: #26200F; background: #E9A23B; border-radius: 8px; font-size: .64rem; font-weight: 850; }.garage-details-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); background: #fff; border-radius: 0 0 14px 14px; box-shadow: 0 8px 26px rgba(23,26,29,.05); }.garage-details-stats article { display: flex; align-items: center; gap: .6rem; padding: 1rem; }.garage-details-stats article + article { border-left: 1px solid #E8ECEB; }.garage-details-stats article > span { display: grid; place-items: center; width: 38px; height: 38px; color: #176B73; background: #E8F2F2; border-radius: 10px; }.garage-details-stats article div { display: grid; min-width: 0; }.garage-details-stats strong { overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }.garage-details-stats small { color: #939B9D; font-size: .58rem; }.garage-details-layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(300px,.75fr); gap: 1rem; margin-top: 1rem; }.garage-details-layout > main,.garage-details-layout > aside { display: grid; align-content: start; gap: 1rem; min-width: 0; }.garage-gallery-card,.garage-detail-actions-card,.garage-detail-security { margin: 0; padding: 1.25rem; border: 1px solid rgba(37,40,42,.07); border-radius: 15px; box-shadow: 0 9px 28px rgba(23,26,29,.05); }.garage-detail-heading { display: flex; align-items: center; gap: .65rem; margin-bottom: 1rem; }.garage-detail-heading > span { display: grid; place-items: center; width: 41px; height: 41px; color: #176B73; background: #E8F2F2; border-radius: 11px; }.garage-detail-heading small { color: #B87920; font-size: .58rem; font-weight: 800; text-transform: uppercase; }.garage-detail-heading h2 { margin: .1rem 0 0; font-size: .9rem; }.garage-detail-heading b { margin-left: auto; color: #176B73; font-size: .68rem; }.garage-photo-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; }.garage-photo-item { position: relative; overflow: hidden; aspect-ratio: 1.25; border-radius: 11px; }.garage-photo-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }.garage-photo-item:hover img { transform: scale(1.04); }.garage-photo-item > span { position: absolute; top: .45rem; left: .45rem; padding: .3rem .45rem; color: #27200F; background: #E9A23B; border-radius: 6px; font-size: .57rem; font-weight: 850; }.garage-photo-actions { position: absolute; right: .4rem; bottom: .4rem; display: flex; gap: .3rem; opacity: 0; transition: opacity .15s ease; }.garage-photo-item:hover .garage-photo-actions { opacity: 1; }.garage-photo-actions button { display: grid; place-items: center; width: 30px; height: 30px; color: #176B73; background: #fff; border: 0; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,.18); }.garage-photo-actions button.is-danger { color: #B4534B; }.garage-photo-upload { display: flex; align-items: center; gap: .7rem; margin-top: .85rem; padding: .75rem; background: #F7F9F8; border: 1px dashed #C7D5D2; border-radius: 11px; }.garage-photo-upload > input { position: absolute; width: 1px; height: 1px; opacity: 0; }.garage-photo-upload > label { display: flex; align-items: center; gap: .6rem; flex: 1; min-width: 0; cursor: pointer; }.garage-photo-upload label > span { display: grid; place-items: center; width: 38px; height: 38px; color: #176B73; background: #E8F2F2; border-radius: 10px; }.garage-photo-upload label > div { display: grid; min-width: 0; }.garage-photo-upload label strong { overflow: hidden; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }.garage-photo-upload label small { color: #92999B; font-size: .58rem; }.garage-photo-upload button:disabled { opacity: .45; }.garage-gallery-empty { padding: 2rem 1rem; text-align: center; color: #7C8587; background: #F7F9F8; border-radius: 11px; }.garage-gallery-empty > i { color: #176B73; font-size: 1.8rem; }.garage-gallery-empty h3 { margin: .5rem 0 .2rem; color: #34393B; font-size: .82rem; }.garage-gallery-empty p { margin: 0; font-size: .67rem; }.garage-detail-actions-card > a { display: flex; align-items: center; gap: .65rem; padding: .75rem; color: inherit; background: #F7F9F8; border-radius: 10px; }.garage-detail-actions-card > a + a { margin-top: .5rem; }.garage-detail-actions-card > a > i:first-child { display: grid; place-items: center; width: 34px; height: 34px; color: #176B73; background: #E8F2F2; border-radius: 9px; }.garage-detail-actions-card > a > span { display: grid; flex: 1; }.garage-detail-actions-card strong { font-size: .7rem; }.garage-detail-actions-card small { color: #8C9496; font-size: .58rem; }.garage-detail-actions-card > a > i:last-child { color: #176B73; }.garage-detail-security { display: flex; gap: .75rem; color: #69562F; background: linear-gradient(110deg,#FFF7E9,#fff); }.garage-detail-security > i { color: #B87920; font-size: 1.4rem; }.garage-detail-security small { color: #B87920; font-size: .58rem; font-weight: 800; text-transform: uppercase; }.garage-detail-security h2 { margin: .15rem 0 .25rem; font-size: .8rem; }.garage-detail-security p { margin: 0; color: #7C735F; font-size: .65rem; line-height: 1.45; }
@media(max-width:991.98px){.garage-details-layout{grid-template-columns:1fr}.garage-photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:767.98px){.garage-details-hero{height:280px}.garage-details-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.garage-details-stats article:nth-child(3){border-top:1px solid #E8ECEB;border-left:0}.garage-details-stats article:nth-child(4){border-top:1px solid #E8ECEB}.garage-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:479.98px){.garage-details-hero{height:235px}.garage-details-primary{top:3.8rem}.garage-details-stats{grid-template-columns:1fr}.garage-details-stats article+article{border-top:1px solid #E8ECEB;border-left:0}.garage-photo-grid{grid-template-columns:1fr}.garage-photo-upload{align-items:stretch;flex-direction:column}.garage-photo-upload button{width:100%}}

/* Brand */
.roadlez-brand {
    display: flex;
    align-items: center;
    min-width: 0;
    text-decoration: none;
}

.roadlez-wordmark {
    display: block;
    width: 176px;
    height: 54px;
    object-fit: contain;
    object-position: left center;
}

.sidebar .sidebar-header {
    min-height: var(--mototribo-topbar-height);
    padding: .55rem 1.15rem;
}

.sidebar .sidebar-body {
    height: calc(100dvh - var(--mototribo-topbar-height));
    max-height: calc(100dvh - var(--mototribo-topbar-height));
    padding-bottom: 1.5rem;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(138, 145, 149, .55) transparent;
}

.sidebar-mobile-close {
    position: absolute;
    top: 50%;
    right: .8rem;
    display: inline-grid;
    width: 28px;
    height: 28px;
    padding: 0;
    place-items: center;
    color: #fff;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 8px;
    font-size: 1rem;
    transform: translateY(-50%);
}

.sidebar-mobile-close:hover,
.sidebar-mobile-close:focus-visible {
    color: #fff;
    background: rgba(255, 255, 255, .2);
    outline: 2px solid rgba(255, 255, 255, .65);
    outline-offset: 2px;
}

.sidebar-mobile-backdrop { display: none; }

@media (max-width: 1199.98px) {
    .sidebar .sidebar-body { -webkit-overflow-scrolling: touch; }

    body.sidebar-main .sidebar-mobile-backdrop {
        position: fixed;
        inset: 0;
        z-index: 11110;
        display: block;
        width: 100%;
        height: 100%;
        padding: 0;
        background: rgba(9, 20, 23, .56);
        border: 0;
        cursor: default;
        backdrop-filter: blur(2px);
    }
}

/* Unified utility topbar */
.iq-top-navbar,
.iq-navbar {
    min-height: var(--mototribo-topbar-height);
}

.iq-top-navbar {
    background: linear-gradient(90deg, #103F46 0%, #176B73 100%) !important;
    border-color: rgba(255, 255, 255, .08) !important;
    box-shadow: 0 8px 24px rgba(16, 63, 70, .12);
}

.iq-top-navbar .iq-navbar {
    background: transparent !important;
}

.iq-top-navbar .navbar-inner {
    min-height: var(--mototribo-topbar-height);
    gap: 1rem;
}

.topbar-search-area {
    flex: 1 1 560px;
    max-width: 720px;
}

.topbar-search-area .iq-search-bar,
.topbar-search-area .searchbox {
    width: 100%;
}

.topbar-search-area .search-input {
    width: 100%;
    min-height: 42px;
    color: #fff;
    background: rgba(255, 255, 255, .11) !important;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 10px;
    padding-left: 2.85rem;
}

.topbar-search-area .search-input::placeholder { color: rgba(255, 255, 255, .65); }
.topbar-search-area .search-input:focus {
    border-color: rgba(233, 162, 59, .8);
    box-shadow: 0 0 0 .2rem rgba(233, 162, 59, .16);
}

.topbar-search-area .search-link,
.mototribo-top-actions > .nav-item > a:not(.btn),
.mototribo-top-actions .dropdown-toggle {
    color: #fff !important;
}

.mototribo-top-actions { gap: .25rem; margin-left: auto; flex-wrap: nowrap; }
.iq-top-navbar .navbar-list.mototribo-top-actions > li.nav-item {
    display: flex; align-items: center; width: auto; min-width: 0; margin: 0; padding: 0;
}
.mototribo-top-actions > .nav-item > a:not(.btn),
.mototribo-top-actions .dropdown-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 34px !important;
    min-width: 34px;
    height: 34px !important;
    min-height: 34px;
    padding: 0 !important;
    border-radius: 50%;
    transition: background-color .2s ease, color .2s ease;
}

.mototribo-top-actions > .nav-item > a:not(.btn):hover,
.mototribo-top-actions .dropdown-toggle:hover {
    color: #E9A23B !important;
    background: rgba(255, 255, 255, .1);
}

.topbar-create-button {
    display: inline-grid;
    place-items: center;
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    color: #171A1D;
    background: #E9A23B;
    border-color: #E9A23B;
    border-radius: 50%;
    font-weight: 700;
}
.topbar-create-button i { font-size: 1.05rem !important; }

.topbar-create-button:hover {
    color: #171A1D;
    background: #F2B553;
    border-color: #F2B553;
}

.mototribo-top-actions .user-dropdown > a {
    justify-content: flex-start;
    width: auto !important;
    min-width: 0;
    height: 42px !important;
    padding: 0 .35rem 0 .25rem !important;
    border-radius: 24px;
    gap: .55rem;
}
.mototribo-top-actions .user-dropdown > a::after { display: none; }

.mototribo-top-actions .user-dropdown img {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    object-fit: cover;
    border: 2px solid rgba(233, 162, 59, .85);
    border-color: rgba(233, 162, 59, .85) !important;
}

/* Menu do usuário: toda a linha é interativa e possui estados visíveis. */
.user-dropdown .caption-menu .nav-links {
    width: 100%;
    padding-inline: .65rem;
    color: #25282A;
    border-radius: .5rem;
    text-decoration: none;
    cursor: pointer;
    transition: color .18s ease, background-color .18s ease, transform .18s ease;
}

.user-dropdown .caption-menu .nav-links > i,
.user-dropdown .caption-menu .nav-links > span {
    color: inherit;
}

.user-dropdown .caption-menu .nav-links:hover,
.user-dropdown .caption-menu .nav-links:focus-visible {
    color: #176B73;
    background-color: #E8F2F2;
    transform: translateX(2px);
}

.user-dropdown .caption-menu .nav-links:focus-visible,
.user-dropdown .caption-menu .btn-logout:focus-visible {
    outline: 3px solid rgba(23, 107, 115, .3);
    outline-offset: 2px;
}

.user-dropdown .caption-menu .btn-logout {
    width: 100%;
    color: #fff;
    background-color: #B42318;
    text-decoration: none;
    cursor: pointer;
    transition: color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.user-dropdown .caption-menu .btn-logout > i,
.user-dropdown .caption-menu .btn-logout > span {
    color: inherit;
}

.user-dropdown .caption-menu .btn-logout:hover,
.user-dropdown .caption-menu .btn-logout:focus-visible {
    color: #fff;
    background-color: #8F1D14;
    box-shadow: 0 6px 16px rgba(180, 35, 24, .22);
}

.topbar-user-copy {
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    padding-right: .2rem;
    line-height: 1.15;
}
.topbar-user-copy strong { overflow: hidden; max-width: 126px; color: #fff; font-size: .72rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.topbar-user-copy small { color: rgba(255,255,255,.65); font-size: .62rem; }
.mototribo-top-actions > .nav-item > a i { font-size: 1.15rem !important; }

/* Profile */
.mototribo-profile-page { margin-top: -.75rem; }

.profile-hero {
    position: relative;
    min-height: 285px;
    overflow: hidden;
    border-radius: 0 0 18px 18px;
    background: #103F46;
}

.profile-cover-image { width: 100%; height: 285px; object-fit: cover; object-position: center 56%; }
.profile-cover-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(16,63,70,.04) 35%, rgba(16,63,70,.76) 100%); }
.profile-hero-label {
    position: absolute;
    right: 1.35rem;
    bottom: 1rem;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: rgba(255,255,255,.9);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.profile-content-row { position: relative; z-index: 2; margin-top: -52px; }
.mototribo-profile-card { margin-bottom: 1rem; border: 0; border-radius: 16px; box-shadow: 0 16px 38px rgba(23,26,29,.11); }
.mototribo-profile-card .card-body { padding: 1.45rem 1.75rem; }
.profile-center { margin-top: -84px; }
.profile-avatar { width: 142px; height: 142px; object-fit: cover; border: 5px solid #fff; border-radius: 50%; box-shadow: 0 8px 24px rgba(16,63,70,.25); }
.profile-status-dot { position: absolute; right: 10px; bottom: 10px; width: 18px; height: 18px; border: 4px solid #fff; border-radius: 50%; background: #E9A23B; }
.profile-display-name { margin: .55rem 0 0; color: #25282A; font-size: 1.35rem; font-weight: 800; letter-spacing: -.025em; }
.profile-kicker { margin: .1rem 0 .45rem; color: #176B73; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.profile-location { display: flex; justify-content: center; gap: .8rem; color: #747A7E; }
.profile-location li { display: inline-flex; align-items: center; gap: .3rem; }
.profile-rider-details { display: flex; flex-direction: column; align-items: flex-start; gap: .65rem; }
.profile-rider-details li { display: flex; align-items: center; gap: .55rem; color: #555E62; }
.profile-rider-details i { display: grid; place-items: center; width: 34px; height: 34px; color: #176B73; background: #E8F2F2; border-radius: 9px; font-size: 1.1rem; }
.profile-social-link { display: inline-flex; align-items: center; gap: .35rem; margin-top: .65rem; color: #176B73; font-weight: 600; }
.profile-right { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; }
.profile-primary-action, .profile-secondary-action { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: .55rem 1rem; border-radius: 10px; font-weight: 700; }
.profile-primary-action { color: #fff; background: #176B73; border-color: #176B73; }
.profile-primary-action:hover { color: #fff; background: #103F46; border-color: #103F46; }
.profile-secondary-action { color: #176B73; border: 1px solid #176B73; }
.profile-tabs-card { overflow: hidden; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; }
.profile-tabs-card .nav-item { padding: .55rem; border-right: 1px solid rgba(37,40,42,.07); }
.profile-tabs-card .nav-item:last-child { border-right: 0; }
.profile-tabs-card .nav-link { gap: .3rem !important; padding: .45rem; color: #697276; border-radius: 10px; }
.profile-tabs-card .nav-link .icon { display: grid; place-items: center; width: 34px; height: 34px; color: #176B73; background: #E8F2F2; border-radius: 9px; font-size: 1.15rem; }
.profile-tabs-card .nav-link p { font-size: .78rem; font-weight: 700; }
.profile-tabs-card .nav-link.active { color: #103F46; background: rgba(233,162,59,.12); }
.profile-tabs-card .nav-link.active .icon { color: #171A1D; background: #E9A23B; }
.profile-tab-content .card { border: 1px solid rgba(37,40,42,.07); border-radius: 14px; }

.mobile-brand-wrap .roadlez-wordmark { width: 150px; height: 48px; }
.mobile-brand-wrap .sidebar-toggle { color: #fff; }

/* Page rhythm */
.main-content .content-inner { padding-top: 2rem; }
.mototribo-page-container { max-width: var(--mototribo-content-max); }

.feed-welcome {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.5rem;
    padding: .25rem .15rem;
}

.feed-eyebrow {
    display: block;
    margin-bottom: .3rem;
    color: #176B73;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.feed-welcome h1 {
    margin: 0;
    font-size: clamp(1.65rem, 3vw, 2.2rem);
    font-weight: 750;
    letter-spacing: -.035em;
}

.feed-welcome p { margin: .25rem 0 0; color: #747A7E; }
.feed-discover-button { display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; }

.feed-layout .card {
    border: 1px solid rgba(37, 40, 42, .075);
    border-radius: var(--mototribo-radius);
}

/* Composer */
.moto-composer { overflow: hidden; }
.composer-avatar,
.post-author-avatar {
    flex: 0 0 auto;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px rgba(23, 107, 115, .18);
}

.composer-input {
    min-height: 76px;
    padding: .85rem 1rem;
    resize: none;
    background: #F7F8F7;
    border-color: transparent;
    border-radius: 12px;
}

.composer-input:hover { border-color: #DDE1DF; }
.composer-actions {
    background: linear-gradient(90deg, rgba(23, 107, 115, .08), rgba(233, 162, 59, .07));
    border-top: 1px solid rgba(23, 107, 115, .1);
}

.composer-action {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .45rem .65rem;
    color: #445055;
    border-radius: 8px;
    font-size: .8rem;
    font-weight: 600;
}

.composer-action i { color: #176B73; font-size: 1.2rem; }
.composer-action:hover { color: #103F46; background: rgba(255, 255, 255, .76); }

/* Post cards */
.moto-post-card { overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.moto-post-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 .8rem 2rem rgba(23, 26, 29, .075);
}

.post-author-name {
    display: block;
    color: #25282A;
    font-weight: 700;
    line-height: 1.35;
}

.post-author-name:hover { color: #176B73; }
.post-more-button { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; color: #747A7E; border-radius: 50%; }
.post-more-button:hover { color: #176B73; background: #E8F2F2; }
.post-copy { color: #313538; font-size: .94rem; line-height: 1.7; white-space: pre-wrap; }

.post-media {
    overflow: hidden;
    margin-right: -1.5rem;
    margin-left: -1.5rem;
}

.post-media img { display: block; width: 100%; max-height: 560px; object-fit: cover; }
.post-action {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-width: 44px;
    color: #667075;
    background: transparent;
    border: 0;
    border-radius: 8px;
}

.post-action:hover,
.post-action.active { color: #176B73; background: #E8F2F2; }
.post-action.btn-like:hover { color: #C84C44; background: #F9EAE8; }

/* Right rail */
.feed-widgets-sticky { position: sticky; top: calc(var(--mototribo-topbar-height) + 1rem); }
.feed-widget .card-header { padding: 1.15rem 1.25rem; }
.feed-widget .card-title { font-size: 1rem; font-weight: 700; }
.weather-widget { overflow: hidden; border: 0; color: #fff; background: linear-gradient(145deg, #176B73, #103F46); }
.weather-widget .card-body { padding: 1.15rem 1.25rem; }
.weather-widget-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.weather-widget-heading .card-title { display: flex; align-items: center; gap: .3rem; color: #fff; }
.weather-widget-label { display: block; margin-bottom: .2rem; color: rgba(255,255,255,.7); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.weather-widget-icon { width: 58px; height: 58px; margin: -.7rem -.45rem 0 0; filter: drop-shadow(0 4px 8px rgba(0,0,0,.16)); }
.weather-widget-current { display: flex; align-items: center; gap: .9rem; margin-top: .7rem; }
.weather-widget-current strong { font-size: 2.7rem; font-weight: 700; line-height: 1; }
.weather-widget-current div { display: flex; flex-direction: column; }
.weather-widget-current small { color: rgba(255,255,255,.68); font-size: .72rem; }
.weather-widget-description { font-size: .9rem; font-weight: 600; text-transform: capitalize; }
.weather-widget-details { display: flex; flex-wrap: wrap; gap: .55rem 1rem; margin-top: .9rem; color: rgba(255,255,255,.82); font-size: .72rem; }
.weather-widget-details span { display: inline-flex; align-items: center; gap: .25rem; }
.weather-widget-summary { margin: .8rem 0 0; padding-top: .7rem; border-top: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.78); font-size: .72rem; }
.weather-widget-tip { display: flex; gap: .45rem; margin: .65rem 0 0; padding: .55rem .65rem; border-radius: 9px; color: #fff; background: rgba(255,255,255,.1); font-size: .72rem; line-height: 1.4; }
.weather-widget-tip i { flex: 0 0 auto; margin-top: .1rem; color: #F5C267; font-size: 1rem; }
.weather-widget-unavailable { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; }
.weather-widget-unavailable > i { font-size: 2rem; color: #F5C267; }
.weather-widget-unavailable > div { display: flex; flex: 1 1 160px; flex-direction: column; }
.weather-widget-unavailable span { color: rgba(255,255,255,.7); font-size: .72rem; }
.weather-widget-unavailable .btn { color: #fff; border-color: rgba(255,255,255,.55); }
.weather-widget-unavailable .btn:hover { color: #103F46; background: #fff; border-color: #fff; }
.widget-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .45rem;
    padding: .9rem 0;
    color: #8A9195;
    font-size: .78rem;
    text-align: center;
}
.widget-empty i { color: #176B73; font-size: 1.55rem; }

/* Authentication */
.settings-page { max-width: 1120px; margin: 0 auto; color: #25282A; }
.settings-module-hero { min-height: 150px; }
.settings-page-heading { display: flex; align-items: center; gap: .9rem; margin-bottom: 1.2rem; padding: 1.15rem 1.3rem; background: linear-gradient(110deg,#103F46,#176B73); border-radius: 15px; box-shadow: 0 13px 32px rgba(23,107,115,.15); }
.settings-heading-icon { display: grid; flex: 0 0 50px; width: 50px; height: 50px; place-items: center; color: #103F46; background: #E9A23B; border-radius: 14px; font-size: 1.4rem; }
.settings-page-heading > div:last-child { min-width: 0; }
.settings-page-heading span { color: #F5C267; font-size: .63rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.settings-page-heading h1 { margin: .12rem 0 .2rem; color: #fff; font-size: 1.45rem; }
.settings-page-heading p { margin: 0; color: rgba(255,255,255,.72); font-size: .76rem; }
.settings-navigation-card, .settings-content-card, .settings-password-card { overflow: hidden; border: 1px solid rgba(37,40,42,.07); border-radius: 15px; box-shadow: 0 9px 28px rgba(23,26,29,.06); }
.settings-navigation-card { position: sticky; top: calc(var(--mototribo-topbar-height) + 1rem); }
.settings-navigation-card .card-body { padding: .75rem; }
.settings-navigation-card .nav-link { display: flex; align-items: center; min-height: 44px; color: #596367; border-radius: 10px !important; font-size: .78rem; font-weight: 700; }
.settings-navigation-card .nav-link i { color: #176B73; font-size: 1.05rem; }
.settings-navigation-card .nav-link:hover { color: #176B73; background: #F0F6F5; }
.settings-navigation-card .nav-link.active { color: #fff; background: #176B73; box-shadow: 0 7px 16px rgba(23,107,115,.2); }
.settings-navigation-card .nav-link.active i { color: #fff; }
.settings-navigation-card hr { margin: .45rem .5rem; border-color: #E6ECEA; }
.settings-content-card .card-header, .settings-password-card .card-header { padding: 1rem 1.25rem; background: #F5F8F7; border-bottom: 1px solid #E8EEEC; }
.settings-content-card .card-title, .settings-password-card .card-title { margin: 0; color: #103F46; font-size: 1rem; font-weight: 800; }
.settings-content-card .card-body, .settings-password-card .card-body { padding: 1.25rem; }
.settings-content-card .card-body > .d-flex { gap: 1rem; min-height: 68px; }
.settings-content-card .card-body > .d-flex > div { min-width: 0; }
.settings-content-card h6 { color: #303638; font-size: .82rem; font-weight: 800; }
.settings-content-card .table thead th { color: #6D777A; background: #F5F8F7; font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; }
.settings-content-card .table td { padding-top: .8rem; padding-bottom: .8rem; border-bottom: 1px solid #EEF2F1; font-size: .75rem; }
.settings-content-card .form-check-input:checked { background-color: #176B73; border-color: #176B73; }
.settings-password-page { max-width: 900px; }
.settings-password-card .form-group { margin-bottom: 1rem; }
.settings-password-card .form-label { color: #4E595D; font-size: .73rem; }
.settings-password-card .form-control { min-height: 43px; border-color: #DDE5E3; border-radius: 9px; }
.settings-password-card .form-control:focus { border-color: #176B73; box-shadow: 0 0 0 .2rem rgba(23,107,115,.12); }
@media (max-width: 991.98px) { .settings-navigation-card { position: static; }.settings-navigation-card .nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }.settings-navigation-card hr { display: none; } }
@media (max-width: 575.98px) { .settings-page-heading { align-items: flex-start; padding: 1rem; }.settings-heading-icon { flex-basis: 44px; width: 44px; height: 44px; }.settings-navigation-card .nav { grid-template-columns: 1fr; }.settings-content-card .card-body > .d-flex { align-items: flex-start !important; flex-direction: column; }.settings-content-card .card-body > .d-flex .btn { width: 100%; }.settings-password-card .d-flex { align-items: stretch !important; flex-direction: column; }.settings-password-card .btn { width: 100%; } }

.roadlez-module-page { color: #25282A; }
.roadlez-module-hero {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 150px;
    margin-bottom: 1.25rem;
    padding: 1.55rem 1.75rem;
    overflow: hidden;
    color: #fff;
    background: linear-gradient(125deg, #103F46 0%, #176B73 68%, #20808A 100%);
    border-radius: 17px;
    box-shadow: 0 16px 38px rgba(23,107,115,.17);
}
.roadlez-module-hero::after { position: absolute; right: -58px; top: -82px; width: 265px; height: 295px; content: ""; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 270'%3E%3Cpolygon points='120,10 220,68 220,202 120,260 20,202 20,68' fill='none' stroke='%23e9a23b' stroke-opacity='.18' stroke-width='16' stroke-linejoin='round'/%3E%3Cpolygon points='120,38 194,81 194,189 120,232 46,189 46,81' fill='none' stroke='%23e9a23b' stroke-opacity='.13' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; transform: rotate(8deg); pointer-events: none; }
.roadlez-module-hero-icon { display: grid; z-index: 1; flex: 0 0 64px; width: 64px; height: 64px; place-items: center; color: #103F46; background: #E9A23B; border: 5px solid rgba(255,255,255,.14); border-radius: 18px; font-size: 1.75rem; }
.roadlez-module-hero-copy { position: relative; z-index: 1; flex: 1; min-width: 0; }
.roadlez-module-hero-copy > span { color: #F5C267; font-size: .65rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.roadlez-module-hero-copy h1 { margin: .18rem 0 .25rem; color: #fff; font-size: clamp(1.45rem,3vw,2rem); }
.roadlez-module-hero-copy p { max-width: 680px; margin: 0; color: rgba(255,255,255,.76); font-size: .82rem; }
.roadlez-module-primary { position: relative; z-index: 1; display: inline-flex; align-items: center; min-height: 42px; color: #25200F; background: #E9A23B; border: 0; border-radius: 10px; font-size: .75rem; font-weight: 800; white-space: nowrap; }
.roadlez-module-primary:hover { color: #171A1D; background: #F1B24F; transform: translateY(-1px); }
.roadlez-module-progress { position: relative; z-index: 1; display: grid; min-width: 135px; padding: .8rem 1rem; text-align: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); border-radius: 12px; }
.roadlez-module-progress strong { color: #F5C267; font-size: 1.65rem; line-height: 1; }
.roadlez-module-progress span { margin-top: .25rem; color: rgba(255,255,255,.72); font-size: .62rem; }
.roadlez-module-page > .row { row-gap: 1rem; }
.roadlez-module-page > .row > [class*="col-"] > .card,
.roadlez-module-page .card-biker-ride,
.roadlez-module-form-page .card,
.roadlez-module-details-page .card,
.maintenance-history-card {
    overflow: hidden;
    margin-bottom: 0;
    border: 1px solid rgba(37,40,42,.07);
    border-radius: 15px;
    box-shadow: 0 9px 28px rgba(23,26,29,.06);
}
.roadlez-module-page > .row > [class*="col-"] > .card,
.roadlez-module-page .card-biker-ride { height: 100%; transition: transform .18s ease, box-shadow .18s ease; }
.roadlez-module-page > .row > [class*="col-"] > .card:hover,
.roadlez-module-page .card-biker-ride:hover { box-shadow: 0 15px 34px rgba(23,26,29,.11); transform: translateY(-3px); }
.roadlez-module-page .card-body { padding: 1.15rem 1.25rem; }
.roadlez-module-page .card-title { color: #25282A; font-weight: 800; }
.roadlez-module-page .card-img-top { height: 190px !important; object-fit: cover; }
.roadlez-module-page > .card { border: 1px dashed rgba(23,107,115,.22); border-radius: 15px; background: linear-gradient(145deg,#fff,#F3F8F7); box-shadow: 0 10px 30px rgba(23,26,29,.05); }
.roadlez-module-page > .card .fs-1 { display: inline-grid !important; width: 68px; height: 68px; margin-right: auto; margin-left: auto; place-items: center; color: #176B73 !important; background: #E8F3F3; border-radius: 18px; }
.establishment-page > .card.mb-4 { border-style: solid; background: #fff; }
.establishment-page > .card.mb-4 form { gap: .8rem 1rem !important; }
.establishment-page > .card.mb-4 .form-control,
.establishment-page > .card.mb-4 .form-select { min-height: 39px; border-color: #DFE7E5; border-radius: 9px; }
.roadlez-module-form-page .card-header { padding: 1.15rem 1.35rem; color: #fff; background: linear-gradient(100deg,#103F46,#176B73); border: 0; }
.roadlez-module-form-page .card-header .card-title { margin: 0; color: #fff; }
.roadlez-module-form-page .card-body { padding: 1.5rem; }
.roadlez-module-form-page .form-group { margin-bottom: 1rem; }
.roadlez-module-form-page .form-label { color: #455055; font-size: .74rem; }
.roadlez-module-form-page .form-control,
.roadlez-module-form-page .form-select { min-height: 43px; border-color: #DDE5E3; border-radius: 9px; }
.roadlez-module-form-page textarea.form-control { min-height: auto; }
.roadlez-module-form-page .form-control:focus,
.roadlez-module-form-page .form-select:focus { border-color: #176B73; box-shadow: 0 0 0 .2rem rgba(23,107,115,.12); }
.roadlez-module-details-page > [class*="col-"] > .card { height: auto; }
.roadlez-module-details-page .bg-light { background: #F1F6F5 !important; border: 1px solid #E4ECEA; }
.roadlez-module-subheader { padding: 1.15rem 1.3rem; background: linear-gradient(120deg,#103F46,#176B73); border-radius: 14px; box-shadow: 0 12px 30px rgba(23,107,115,.14); }
.roadlez-module-subheader h4, .roadlez-module-subheader p { color: #fff !important; }
.roadlez-module-subheader p { opacity: .72; }
.maintenance-history-card { border-left: 4px solid #176B73; }
.badge-page > h5 { display: flex; align-items: center; gap: .35rem; color: #103F46; font-size: .9rem; font-weight: 800; }
.badge-page .card { position: relative; }
.badge-page .card:not(.opacity-50) { border-color: rgba(233,162,59,.35) !important; background: linear-gradient(155deg,#fff 45%,#FFF9ED); }
.badge-page .card.opacity-50 { opacity: .68 !important; filter: grayscale(.65); }
.badge-page .avatar-80 { filter: drop-shadow(0 7px 10px rgba(23,26,29,.12)); }
@media (max-width: 767.98px) {
    .roadlez-module-hero { align-items: flex-start; flex-wrap: wrap; padding: 1.25rem 1rem; }
    .roadlez-module-hero-icon { flex-basis: 52px; width: 52px; height: 52px; font-size: 1.4rem; }
    .roadlez-module-hero-copy { flex-basis: calc(100% - 68px); }
    .roadlez-module-primary { width: 100%; justify-content: center; }
    .roadlez-module-progress { width: 100%; }
    .roadlez-module-subheader { align-items: stretch !important; flex-direction: column; }
    .roadlez-module-subheader > .d-flex { width: 100%; }
    .roadlez-module-subheader .btn { flex: 1; }
}

.auth-roadlez-brand img { width: min(320px, 78vw); height: 110px; object-fit: contain; }
.sign-in-page .bg-primary { background: linear-gradient(145deg, #103F46, #176B73) !important; }
.sign-in-page .main-circle { border-color: rgba(233, 162, 59, .16) !important; }

[data-bs-theme="dark"] .feed-welcome p { color: #AEB5B8; }
[data-bs-theme="dark"] .composer-input { color: #E1E5E6; background: #1D2124; }
[data-bs-theme="dark"] .composer-actions { background: linear-gradient(90deg, rgba(23, 107, 115, .22), rgba(233, 162, 59, .08)); }
[data-bs-theme="dark"] .composer-action { color: #C7CDCF; }
[data-bs-theme="dark"] .composer-action:hover { color: #fff; background: rgba(255, 255, 255, .07); }
[data-bs-theme="dark"] .post-author-name,
[data-bs-theme="dark"] .post-copy { color: #E1E5E6; }
[data-bs-theme="dark"] .post-action { color: #B5BCBF; }

/* ═══════════ Comments Panel ═══════════ */
.comments-panel { padding: 0 0 .5rem; }
.comment-item > a > img,
.comment-item > a { flex: 0 0 28px; width: 28px; height: 28px; object-fit: cover; display: block; }
.comment-composer > img { flex: 0 0 32px; width: 32px; height: 32px; object-fit: cover; }

.comment-composer {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .85rem 0;
    border-top: 1px solid #EEF0F0;
}
.comment-input-wrap {
    position: relative;
    flex: 1;
}
.comment-input {
    min-height: 38px;
    padding: .45rem 2.8rem .45rem .85rem;
    border-color: #DDE2E1;
    border-radius: 50rem;
    font-size: .78rem;
}
.comment-input:focus { border-color: #176B73; box-shadow: 0 0 0 .15rem rgba(23,107,115,.1); }
.comment-send-btn {
    position: absolute;
    top: 50%;
    right: .35rem;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    padding: 0;
    color: #fff;
    background: #176B73;
    border: 0;
    border-radius: 50%;
    font-size: .85rem;
    transform: translateY(-50%);
    transition: background .15s ease, opacity .15s ease;
}
.comment-send-btn:hover { background: #103F46; }
.comment-send-btn:disabled { background: #C4CDCE; opacity: .6; cursor: default; }

.comments-list { padding: 0; }

.comment-item {
    display: flex;
    gap: .55rem;
    padding: .5rem 0;
}
.comment-item + .comment-item { border-top: 1px solid rgba(238,240,240,.6); }

.comment-reply { padding-left: 2.6rem; }
.comment-reply::before {
    content: '';
    display: block;
    width: 14px;
    height: 14px;
    margin-top: .35rem;
    border-left: 2px solid #D4DBDC;
    border-bottom: 2px solid #D4DBDC;
    border-radius: 0 0 0 6px;
    flex: 0 0 14px;
}

.comment-body { min-width: 0; flex: 1; }
.comment-bubble {
    padding: .5rem .75rem;
    background: #F3F5F5;
    border-radius: 0 12px 12px 12px;
}
.comment-author {
    display: block;
    color: #25282A;
    font-size: .72rem;
    font-weight: 800;
    text-decoration: none;
}
.comment-author:hover { color: #176B73; }
.comment-text { margin: .15rem 0 0; color: #3A4144; font-size: .78rem; line-height: 1.5; }

.comment-meta {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: .25rem;
    padding-left: .75rem;
}
.comment-time { color: #9AA1A4; font-size: .64rem; }
.comment-action-btn {
    padding: 0;
    color: #7A8386;
    background: none;
    border: 0;
    font-size: .64rem;
    font-weight: 700;
    cursor: pointer;
    transition: color .15s ease;
}
.comment-action-btn:hover { color: #176B73; }
.comment-action-btn i { margin-right: .2rem; font-size: .72rem; vertical-align: middle; }

.comment-load-more {
    display: block;
    width: 100%;
    margin-top: .25rem;
    padding: .45rem;
    color: #176B73;
    background: #E8F2F2;
    border: 0;
    border-radius: 8px;
    font-size: .72rem;
    font-weight: 700;
    text-align: center;
}
.comment-load-more:hover { background: #D8EAEA; }

[data-bs-theme="dark"] .comment-bubble { background: rgba(255,255,255,.06); }
[data-bs-theme="dark"] .comment-author { color: #E1E5E6; }
[data-bs-theme="dark"] .comment-text { color: #C4CDCE; }
[data-bs-theme="dark"] .comment-composer { border-top-color: rgba(255,255,255,.08); }
[data-bs-theme="dark"] .comment-input { border-color: rgba(255,255,255,.12); background: rgba(255,255,255,.04); color: #E1E5E6; }
[data-bs-theme="dark"] .comment-item + .comment-item { border-top-color: rgba(255,255,255,.06); }

@media (max-width: 1199.98px) {
    .iq-top-navbar .navbar-inner { padding-top: .35rem; padding-bottom: .35rem; }
    .main-content .content-inner { padding-top: 1.5rem; }
}

@media (max-width: 991.98px) {
    .profile-hero, .profile-cover-image { min-height: 230px; height: 230px; }
    .profile-content-row { margin-top: -34px; }
    .profile-center { order: -1; margin-top: -76px; margin-bottom: 1rem; }
    .profile-left { order: 2; }
    .profile-right { order: 3; justify-content: center; }
    .profile-rider-details { align-items: center; margin-bottom: .5rem !important; }
}

@media (max-width: 767.98px) {
    :root { --mototribo-topbar-height: 64px; }
    .feed-welcome { align-items: flex-start; }
    .feed-discover-button { display: none; }
    .feed-welcome p { font-size: .82rem; }
    .composer-action span { display: none; }
    .composer-action { padding: .45rem; }
    .post-media { margin-right: -1rem; margin-left: -1rem; }
    .mototribo-page-container { padding-right: .75rem; padding-left: .75rem; }
    .mototribo-top-actions { gap: .1rem; }
    .mototribo-top-actions > .nav-item > a:not(.btn), .mototribo-top-actions .dropdown-toggle { width: 32px !important; min-width: 32px; height: 32px !important; min-height: 32px; }
    .mototribo-top-actions .user-dropdown > a { width: 34px !important; min-width: 34px; height: 34px !important; padding: 0 !important; }
    .mototribo-top-actions .user-dropdown img { width: 30px; height: 30px; }
    .profile-hero, .profile-cover-image { min-height: 190px; height: 190px; }
    .profile-cover-image { object-position: 46% center; }
    .profile-hero-label { display: none; }
    .mototribo-profile-card .card-body { padding: 1.25rem 1rem; }
    .profile-avatar { width: 118px; height: 118px; }
    .profile-tabs-card .nav-item { min-width: 92px; }
}

/* Topbar sizing guard: neutralizes dimensions inherited from SocialV. */
.iq-top-navbar .navbar-inner {
    width: 100%;
    min-width: 0;
}

.iq-top-navbar .topbar-search-area {
    min-width: 0;
}

.iq-top-navbar ul.navbar-list.mototribo-top-actions {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 0;
    max-width: max-content;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
}

.iq-top-navbar ul.navbar-list.mototribo-top-actions > li.nav-item {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 0 !important;
    height: 36px;
    margin: 0 !important;
    padding: 0 !important;
}

.iq-top-navbar ul.navbar-list.mototribo-top-actions > li.nav-item > a.topbar-create-button,
.iq-top-navbar ul.navbar-list.mototribo-top-actions > li.nav-item > a:not(.topbar-create-button):not(#drop-down-arrow) {
    display: inline-flex !important;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    border-radius: 50% !important;
}

.iq-top-navbar ul.navbar-list.mototribo-top-actions > li.user-dropdown > a#drop-down-arrow {
    display: inline-flex !important;
    flex: 0 0 36px;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
}

.iq-top-navbar .mototribo-top-actions .topbar-user-avatar {
    display: block;
    width: 34px !important;
    min-width: 34px;
    height: 34px !important;
    object-fit: cover;
}

.iq-top-navbar .mototribo-top-actions i {
    display: block;
    margin: 0 !important;
    line-height: 1 !important;
}

@media (max-width: 575.98px) {
    .iq-top-navbar ul.navbar-list.mototribo-top-actions { gap: .05rem; }
    .iq-top-navbar ul.navbar-list.mototribo-top-actions > li.nav-item > a.topbar-create-button { display: none !important; }
}

/* Roadlez footer */
.roadlez-footer {
    position: relative;
    overflow: hidden;
    margin-top: 1.5rem;
    padding: 0 !important;
    color: #667174;
    background: #fff;
    border-top: 1px solid #e7ebea;
    box-shadow: 0 -8px 24px rgba(16,63,70,.035);
    width: calc(100% - var(--sidebar-width));
}
.roadlez-footer::after {
    position: absolute;
    right: -34px;
    bottom: -64px;
    width: 150px;
    height: 130px;
    content: "";
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 140'%3E%3Cpolygon points='80,5 150,44 150,96 80,135 10,96 10,44' fill='none' stroke='%23176B73' stroke-opacity='.055' stroke-width='13'/%3E%3C/svg%3E") center / contain no-repeat;
    transform: rotate(8deg);
    pointer-events: none;
}
.roadlez-footer-stripes { display: flex; height: 5px; transform: skewX(-32deg); transform-origin: left; }
.roadlez-footer-stripes span:first-child { width: 34%; background: #176B73; }
.roadlez-footer-stripes span:last-child { width: 13%; margin-left: 5px; background: #E9A23B; }
.roadlez-footer-content { position: relative; z-index: 1; display: flex; min-height: 64px; align-items: center; justify-content: space-between; gap: 1rem; padding-top: .8rem; padding-bottom: .8rem; }
.roadlez-footer-links { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.roadlez-footer a { color: #176B73; font-weight: 600; text-decoration: none; }
.roadlez-footer a:hover, .roadlez-footer a:focus-visible { color: #E28B23; text-decoration: underline; }
.roadlez-footer p { margin: 0; font-size: .75rem; }
.roadlez-auth-footer { margin-top: 0; }
.roadlez-auth-footer .roadlez-footer-content { max-width: 1180px; margin-inline: auto; padding-inline: 1.25rem; }
@media (max-width: 767.98px) {
    .roadlez-footer-content { flex-direction: column; justify-content: center; padding: 1rem; text-align: center; }
    .roadlez-footer-links { justify-content: center; gap: .65rem 1.25rem; }
}
@media (max-width: 1199.98px) {
    .roadlez-footer { width: 100%; margin-left: 0; }
}

/* Login Roadlez */
.roadlez-login-body { min-height: 100vh; margin: 0; background: #EEF2F1; }
.roadlez-login-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr); }
.roadlez-login-brand-panel { position: relative; display: flex; overflow: hidden; flex-direction: column; justify-content: space-between; min-height: 620px; padding: clamp(2rem,4vw,4.5rem); color: #fff; background: radial-gradient(circle at 76% 58%,rgba(255,255,255,.09),transparent 27%),linear-gradient(145deg,#0D363D 0%,#176B73 62%,#103F46 100%); }
.roadlez-login-brand-panel::after { position: absolute; right: -80px; bottom: -112px; width: 350px; height: 350px; content: ""; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 300'%3E%3Cpolygon points='150,18 268,84 268,216 150,282 32,216 32,84' fill='none' stroke='%23ffffff' stroke-opacity='.055' stroke-width='17'/%3E%3C/svg%3E") center/contain no-repeat; transform: rotate(8deg); pointer-events: none; }
.roadlez-login-logo { position: relative; z-index: 1; display: inline-flex; width: min(235px,50vw); }
.roadlez-login-logo img { width: 100%; max-height: 78px; object-fit: contain; object-position: left center; }
.roadlez-login-brand-copy { position: relative; z-index: 1; max-width: 680px; }
.roadlez-login-brand-copy > span { color: #F5C267; font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.roadlez-login-brand-copy h1 { max-width: 650px; margin: .7rem 0 1rem; color: #fff; font-size: clamp(2.35rem,4.4vw,4.5rem); font-weight: 700; line-height: 1.06; text-transform: none; }
.roadlez-login-brand-copy p { max-width: 560px; margin: 0; color: rgba(255,255,255,.76); font-size: clamp(.9rem,1.2vw,1.08rem); }
.roadlez-login-hex-stripes { position: absolute; z-index: 1; bottom: 108px; left: -50px; display: flex; gap: 8px; transform: skewX(-31deg); }
.roadlez-login-hex-stripes span { display: block; height: 7px; }
.roadlez-login-hex-stripes span:first-child { width: clamp(190px,28vw,390px); background: #E9A23B; }
.roadlez-login-hex-stripes span:last-child { width: clamp(90px,13vw,180px); background: rgba(255,255,255,.82); }
.roadlez-login-benefits { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: .8rem 1.6rem; color: rgba(255,255,255,.82); font-size: .78rem; }
.roadlez-login-benefits span { display: flex; align-items: center; gap: .45rem; }
.roadlez-login-benefits i { color: #F5C267; font-size: 1rem; }
.roadlez-login-form-panel { position: relative; display: grid; overflow: hidden; align-items: center; justify-items: center; padding: clamp(2rem,5vw,5rem) clamp(2rem,5vw,5rem) 6.5rem; background: #fff; }
.roadlez-login-form-panel::before,.roadlez-login-form-panel::after { position: absolute; top: 28px; right: -38px; height: 8px; content: ""; transform: skewX(-32deg); }
.roadlez-login-form-panel::before { width: 220px; background: #176B73; }.roadlez-login-form-panel::after { top: 42px; width: 125px; background: #E9A23B; }
.roadlez-login-form-wrap { width: min(100%,430px); }
.roadlez-login-heading > span,.roadlez-login-heading > small { display: block; color: #176B73; font-size: .7rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.roadlez-login-heading h2 { margin: .3rem 0 .35rem; color: #17282B; font-size: clamp(1.7rem,2.5vw,2.25rem); font-weight: 700; text-transform: none; }
.roadlez-login-heading p { margin: 0 0 2rem; color: #748083; }
.roadlez-login-form { margin-top: 1.75rem; }.roadlez-login-form .form-group { margin-bottom: 1.15rem; }.roadlez-login-form .form-label { margin-bottom: .4rem; color: #263639; font-size: .78rem; }
.roadlez-login-field > i { position: absolute; z-index: 2; top: 50%; left: .9rem; color: #176B73; font-size: 1.05rem; transform: translateY(-50%); }
.roadlez-login-field { position: relative; }.roadlez-login-field .form-control { min-height: 48px; padding-left: 2.65rem; color: #253437; background: #F8FAF9; border-color: #D9E0DF; border-radius: 10px; }.roadlez-login-field .form-control:focus { background: #fff; border-color: #176B73; box-shadow: 0 0 0 .2rem rgba(23,107,115,.13); }
.roadlez-login-field .btn { right: .15rem !important; }.roadlez-login-form .form-check-label { color: #536164; font-size: .75rem; }.roadlez-login-form a { color: #176B73; font-weight: 700; }
.roadlez-login-submit { min-height: 48px; margin-top: 1.35rem; color: #173136; background: #E9A23B; border: 0; border-radius: 10px; font-weight: 800; }.roadlez-login-submit:hover,.roadlez-login-submit:focus { color: #173136; background: #F2B553; }
.roadlez-login-join { margin: 1.5rem 0 0; color: #738083; text-align: center; font-size: .8rem; }
.roadlez-waitlist-form { margin-top: 2rem; }.roadlez-waitlist-confirmation > span { display: grid; width: 62px; height: 62px; margin-bottom: 1.4rem; place-items: center; color: #103F46; background: #E9A23B; border-radius: 18px; font-size: 1.8rem; box-shadow: 0 12px 28px rgba(233,162,59,.22); }.roadlez-waitlist-confirmation .roadlez-login-heading p { margin-bottom: 1.5rem; }.roadlez-waitlist-note { display: flex; align-items: flex-start; gap: .8rem; margin: 1.5rem 0 .4rem; padding: 1rem; color: #536164; background: #F3F7F6; border: 1px solid #E1E8E7; border-radius: 12px; }.roadlez-waitlist-note i { flex: 0 0 auto; color: #176B73; font-size: 1.3rem; }.roadlez-waitlist-note p { margin: 0; font-size: .78rem; }
.roadlez-login-panel-legal { position: absolute; right: clamp(1.5rem,4vw,4rem); bottom: 1.6rem; left: clamp(1.5rem,4vw,4rem); display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1rem; color: #849092; border-top: 1px solid #E7EBEA; font-size: .68rem; }.roadlez-login-panel-legal nav { display: flex; gap: 1.25rem; }.roadlez-login-panel-legal a { color: #176B73; font-weight: 700; }.roadlez-login-panel-legal p { margin: 0; text-align: right; }
@media (max-width: 991.98px) { .roadlez-login-shell { grid-template-columns: 1fr; }.roadlez-login-brand-panel { min-height: 330px; padding: 2rem; }.roadlez-login-brand-copy h1 { max-width: 560px; font-size: clamp(2rem,7vw,3.4rem); }.roadlez-login-hex-stripes { bottom: 75px; }.roadlez-login-form-panel { min-height: 650px; padding: 4rem 1.5rem 7rem; } }
@media (max-width: 575.98px) { .roadlez-login-brand-panel { min-height: 270px; }.roadlez-login-logo { width: 170px; }.roadlez-login-brand-copy h1 { margin-bottom: .65rem; font-size: 2rem; }.roadlez-login-brand-copy p { font-size: .82rem; }.roadlez-login-benefits { display: none; }.roadlez-login-hex-stripes { bottom: 25px; }.roadlez-login-form-panel { min-height: 620px; padding: 4rem 1.25rem 8rem; }.roadlez-login-panel-legal { right: 1.25rem; bottom: 1.25rem; left: 1.25rem; flex-direction: column; gap: .55rem; text-align: center; }.roadlez-login-panel-legal nav { gap: 1rem; }.roadlez-login-panel-legal p { text-align: center; } }

/* SocialV-inspired profile composition, adapted to MotoTribo. */
.mototribo-profile-page .profile-hero {
    min-height: 252px;
    height: 252px;
    border-radius: 12px 12px 0 0;
}

.mototribo-profile-page .profile-cover-image {
    height: 252px;
    object-position: center 54%;
}

.mototribo-profile-page .profile-cover-overlay {
    background: linear-gradient(180deg, rgba(16,63,70,.03), rgba(16,63,70,.2));
}

.mototribo-profile-page .profile-hero-label { display: none; }
.mototribo-profile-page .profile-content-row { margin-top: -14px; }

.mototribo-profile-page .mototribo-profile-card {
    position: relative;
    margin-top: 0 !important;
    min-height: 170px;
    margin-bottom: 1rem;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(23,26,29,.08);
}

.mototribo-profile-page .mototribo-profile-card .card-body {
    min-height: 170px;
    padding: 1.45rem 2rem 1.25rem;
}

.profile-summary-grid { min-height: 136px; }
.mototribo-profile-page .profile-center { align-self: flex-start; margin-top: -118px; }

.mototribo-profile-page .profile-avatar {
    width: 126px;
    height: 126px;
    border: 5px solid #fff;
    border-radius: 12px;
    box-shadow: 0 8px 22px rgba(16,63,70,.18);
}

.profile-status-badge {
    position: absolute;
    right: 50%;
    bottom: -10px;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .2rem .55rem;
    color: #fff;
    background: #176B73;
    border: 2px solid #fff;
    border-radius: 50rem;
    font-size: .62rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    transform: translateX(50%);
}

.mototribo-profile-page .profile-display-name { margin-top: 1rem; font-size: 1.2rem; }
.mototribo-profile-page .profile-kicker { margin-bottom: 0; color: #7B8387; font-size: .68rem; letter-spacing: .04em; text-transform: none; }
.mototribo-profile-page .profile-hero-copy .profile-kicker {
    display: inline-block;
    color: rgba(255, 255, 255, .82);
    text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
}
.mototribo-profile-page .profile-hero-copy .profile-kicker:hover,
.mototribo-profile-page .profile-hero-copy .profile-kicker:focus-visible {
    color: #fff;
}

.profile-contact-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .5rem;
    padding-bottom: .15rem;
}

.profile-contact-list span,
.profile-contact-list a {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    overflow: hidden;
    max-width: 100%;
    color: #667075;
    font-size: .76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-contact-list i { color: #176B73; font-size: 1.05rem; }
.mototribo-profile-page .profile-right { flex-direction: column; align-items: stretch; justify-content: flex-end; }

.profile-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; }
.profile-facts > div { min-width: 0; padding: .2rem .7rem; text-align: center; border-left: 1px solid #E8EAEB; }
.profile-facts > div:first-child { border-left: 0; }
.profile-facts strong { display: block; overflow: hidden; color: #25282A; font-size: .95rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.profile-facts span { display: block; margin-top: .1rem; color: #8A9195; font-size: .66rem; }

.profile-card-edit {
    position: absolute;
    top: .8rem;
    right: .8rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 32px;
    padding: .35rem .7rem;
    color: #176B73;
    background: #E8F2F2;
    border: 0;
    border-radius: 8px;
    font-size: .7rem;
    font-weight: 700;
}

.profile-card-edit:hover { color: #fff; background: #176B73; }
.profile-visitor-actions { position: absolute; top: 50%; right: .8rem; z-index: 2; display: flex; align-items: center; justify-content: flex-end; gap: .4rem; margin: 0; white-space: nowrap; transform: translateY(-50%); }

.mototribo-profile-page .profile-tabs-card { margin-bottom: 1rem; border-radius: 10px; }
.mototribo-profile-page .profile-tabs-card .nav-item { padding: 0; }
.mototribo-profile-page .profile-tabs-card .nav-link { min-height: 108px; padding: 1rem .5rem; border-radius: 0; }
.mototribo-profile-page .profile-tabs-card .nav-link .icon { width: 38px; height: 38px; padding: 0 !important; }
.mototribo-profile-page .profile-tabs-card .nav-link.active { color: #176B73; background: #fff; box-shadow: inset 0 -3px #E9A23B; }

@media (max-width: 991.98px) {
    .mototribo-profile-page .profile-hero,
    .mototribo-profile-page .profile-cover-image { min-height: 220px; height: 220px; }
    .mototribo-profile-page .profile-content-row { margin-top: -12px; }
    .mototribo-profile-page .profile-center { order: -1; margin-top: -96px; }
    .mototribo-profile-page .profile-left { order: 2; margin-top: 1rem; }
    .mototribo-profile-page .profile-right { order: 3; margin-top: 1rem; }
    .profile-contact-list { align-items: center; }
    .profile-facts { max-width: 480px; margin: 0 auto; }
    .profile-card-edit span { display: none; }
    .profile-card-edit { width: 34px; padding: 0; justify-content: center; }
}

@media (max-width: 575.98px) {
    .mototribo-profile-page .profile-hero,
    .mototribo-profile-page .profile-cover-image { min-height: 170px; height: 170px; }
    .mototribo-profile-page .mototribo-profile-card .card-body { padding: 1.25rem 1rem; }
    .mototribo-profile-page .profile-center { margin-top: -76px; }
    .mototribo-profile-page .profile-avatar { width: 104px; height: 104px; }
    .profile-facts > div { padding: .2rem .35rem; }
    .profile-facts strong { font-size: .8rem; }
    .mototribo-profile-page .profile-tabs-card .nav-link { min-height: 92px; }
}

/* Profile showcase */
.profile-showcase-page { max-width: 1180px; margin: 0 auto; }
.profile-identity-card { position: relative; z-index: 2; display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 2rem; min-height: 148px; margin: -18px 12px 1rem; padding: 1.25rem 1.5rem; border: 0; border-radius: 14px; box-shadow: 0 12px 32px rgba(23,26,29,.09); }
.profile-identity-main { display: flex; align-items: flex-end; gap: 1.25rem; min-width: 0; }
.profile-identity-avatar-wrap { position: relative; flex: 0 0 auto; margin-top: -76px; }
.profile-showcase-page .profile-avatar { width: 132px; height: 132px; object-fit: cover; border: 5px solid #fff; border-radius: 14px; box-shadow: 0 8px 24px rgba(16,63,70,.2); }
.profile-level-pill { position: absolute; right: 50%; bottom: -9px; padding: .24rem .65rem; color: #fff; background: #176B73; border: 2px solid #fff; border-radius: 30px; font-size: .64rem; font-weight: 800; white-space: nowrap; transform: translateX(50%); }
.profile-identity-copy { min-width: 0; padding-bottom: .15rem; }
.profile-eyebrow { color: #176B73; font-size: .68rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.profile-identity-copy h1 { display: flex; align-items: center; gap: .4rem; margin: .22rem 0 .4rem; color: #25282A; font-size: clamp(1.35rem, 2.6vw, 1.75rem); font-weight: 800; letter-spacing: -.03em; }
.profile-verified-badge { color: #176B73; font-size: 1.15rem; }
.profile-identity-meta { display: flex; flex-wrap: wrap; gap: .55rem 1rem; color: #747A7E; font-size: .76rem; }
.profile-identity-meta span { display: inline-flex; align-items: center; gap: .35rem; }
.profile-identity-meta i { color: #176B73; font-size: 1rem; }
.profile-identity-actions { display: flex; align-items: center; gap: .55rem; flex: 0 0 auto; }
.profile-showcase-page .profile-primary-action, .profile-showcase-page .profile-secondary-action { gap: .4rem; min-height: 40px; border-radius: 9px; }
.profile-highlights { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 1rem; background: #fff; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.04); }
.profile-highlights > div { display: grid; grid-template-columns: 42px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: .7rem; padding: 1rem 1.2rem; border-left: 1px solid #E8EAEB; }
.profile-highlights > div:first-child { border-left: 0; }
.profile-highlight-icon { grid-row: 1 / 3; display: grid; place-items: center; width: 42px; height: 42px; color: #176B73; background: #E8F2F2; border-radius: 11px; font-size: 1.25rem; }
.profile-highlights strong { overflow: hidden; color: #25282A; font-size: .88rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.profile-highlights small { color: #8A9195; font-size: .68rem; }
.profile-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(285px, .75fr); gap: 1rem; align-items: start; }
.profile-dashboard-main, .profile-dashboard-side { display: grid; gap: 1rem; }
.profile-content-card { margin: 0; padding: 1.35rem; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.04); }
.profile-card-heading { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.15rem; }
.profile-card-heading > div > span { display: block; margin-bottom: .08rem; color: #8A9195; font-size: .66rem; font-weight: 700; letter-spacing: .045em; text-transform: uppercase; }
.profile-card-heading h2 { margin: 0; color: #25282A; font-size: 1.05rem; font-weight: 800; }
.profile-card-heading-compact { margin-bottom: 1rem; }
.profile-section-icon { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; color: #176B73; background: #E8F2F2; border-radius: 11px; font-size: 1.25rem; }
.profile-section-icon-gold { color: #7A4B08; background: #FFF1D9; }
.profile-bio { margin: 0; color: #596267; font-size: .9rem; line-height: 1.75; white-space: pre-line; }
.profile-empty-state { display: flex; align-items: center; gap: .65rem; padding: 1rem; color: #747A7E; background: #F6F8F7; border-radius: 10px; }
.profile-empty-state > i { color: #176B73; font-size: 1.35rem; }
.profile-empty-state p { flex: 1; margin: 0; font-size: .82rem; }
.profile-empty-state a { color: #176B73; font-size: .75rem; font-weight: 800; }
.profile-journey-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.profile-journey-grid > div { display: grid; grid-template-columns: 38px 1fr; grid-template-rows: auto auto; column-gap: .7rem; padding: .85rem; background: #F6F8F7; border-radius: 10px; }
.profile-journey-grid i { grid-row: 1 / 3; display: grid; place-items: center; width: 38px; height: 38px; color: #176B73; background: #fff; border-radius: 9px; font-size: 1.1rem; }
.profile-journey-grid span { color: #8A9195; font-size: .66rem; }
.profile-journey-grid strong { color: #354044; font-size: .8rem; }
.profile-destination-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.profile-destination-grid > a { display: flex; align-items: center; gap: .7rem; padding: .9rem; color: #354044; background: #F6F8F7; border: 1px solid transparent; border-radius: 10px; transition: .2s ease; }
.profile-destination-grid > a:hover { color: #176B73; background: #EDF5F4; border-color: #CFE2E1; transform: translateY(-1px); }
.profile-destination-grid > a > i:first-child { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; color: #176B73; background: #fff; border-radius: 9px; font-size: 1.1rem; }
.profile-destination-grid > a > span { display: grid; flex: 1; }
.profile-destination-grid strong { font-size: .79rem; }
.profile-destination-grid small { color: #8A9195; font-size: .65rem; }
.profile-destination-grid > a > i:last-child { color: #9AA1A4; }
.profile-detail-list { display: grid; gap: .8rem; margin: 0; padding: 0; list-style: none; }
.profile-detail-list li { display: flex; align-items: center; gap: .7rem; }
.profile-detail-list li > i { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; color: #176B73; background: #F0F5F4; border-radius: 9px; font-size: 1rem; }
.profile-detail-list span { display: grid; min-width: 0; }
.profile-detail-list small { color: #8A9195; font-size: .64rem; }
.profile-detail-list strong { overflow: hidden; color: #354044; font-size: .75rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.profile-social-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .55rem; }
.profile-social-grid a { display: flex; align-items: center; gap: .45rem; padding: .65rem; color: #596267; background: #F6F8F7; border-radius: 9px; font-size: .72rem; font-weight: 700; }
.profile-social-grid a:hover { color: #176B73; background: #E8F2F2; }
.profile-social-grid i { color: #176B73; font-size: 1.05rem; }
.profile-safety-card { display: flex; gap: .9rem; padding: 1.25rem; color: #fff; background: linear-gradient(135deg, #103F46, #176B73); border-radius: 14px; box-shadow: 0 10px 28px rgba(16,63,70,.16); }
.profile-safety-card > span { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; color: #171A1D; background: #E9A23B; border-radius: 11px; font-size: 1.3rem; }
.profile-safety-card small { color: rgba(255,255,255,.7); font-size: .63rem; text-transform: uppercase; }
.profile-safety-card h2 { margin: .08rem 0 .35rem; color: #fff; font-size: .95rem; font-weight: 800; }
.profile-safety-card p { margin: 0 0 .55rem; color: rgba(255,255,255,.75); font-size: .71rem; line-height: 1.45; }
.profile-safety-card a { color: #E9A23B; font-size: .72rem; font-weight: 800; }
.profile-section-tabs { display: flex; overflow-x: auto; margin-bottom: 1rem; padding: .35rem; background: #fff; border: 1px solid rgba(37,40,42,.07); border-radius: 12px; box-shadow: 0 8px 26px rgba(23,26,29,.04); scrollbar-width: thin; }
.profile-section-tabs button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .42rem; flex: 1 0 125px; min-height: 48px; padding: .6rem .75rem; color: #747A7E; background: transparent; border: 0; border-radius: 9px; font-size: .76rem; font-weight: 750; white-space: nowrap; }
.profile-section-tabs button:hover { color: #176B73; background: #F3F7F6; }
.profile-section-tabs button.active { color: #fff; background: #176B73; box-shadow: 0 5px 14px rgba(23,107,115,.18); }
.profile-section-tabs button i { font-size: 1.05rem; }
.profile-section-tabs button small { display: grid; place-items: center; min-width: 19px; height: 19px; padding: 0 .3rem; color: #176B73; background: #E8F2F2; border-radius: 20px; font-size: .61rem; }
.profile-section-tabs button.active small { color: #103F46; background: #fff; }
.profile-sections-content > .tab-pane { outline: none; }
.profile-posts-layout { display: grid; gap: 1rem; max-width: 760px; margin: 0 auto; }
.profile-tab-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 260px; margin: 0; padding: 2rem; text-align: center; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.04); }
.profile-tab-empty > i { display: grid; place-items: center; width: 60px; height: 60px; margin-bottom: .9rem; color: #176B73; background: #E8F2F2; border-radius: 16px; font-size: 1.75rem; }
.profile-tab-empty h2 { margin: 0 0 .35rem; color: #25282A; font-size: 1.05rem; font-weight: 800; }
.profile-tab-empty p { max-width: 510px; margin: 0 0 1rem; color: #7B8387; font-size: .8rem; line-height: 1.55; }
.profile-photo-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.profile-photo-gallery a { overflow: hidden; aspect-ratio: 1; background: #E8EAEB; border-radius: 12px; }
.profile-photo-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.profile-photo-gallery a:hover img { transform: scale(1.035); }
.profile-club-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.profile-club-card { overflow: hidden; margin: 0; color: #354044; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.04); transition: transform .2s ease, box-shadow .2s ease; }
.profile-club-card:hover { color: #176B73; box-shadow: 0 13px 30px rgba(23,26,29,.09); transform: translateY(-2px); }
.profile-club-banner { height: 92px; overflow: hidden; background: #103F46; }
.profile-club-banner img { width: 100%; height: 100%; object-fit: cover; }
.profile-club-body { display: flex; align-items: flex-start; gap: .75rem; padding: 0 1rem 1rem; }
.profile-club-body > img { flex: 0 0 62px; width: 62px; height: 62px; margin-top: -22px; object-fit: cover; background: #fff; border: 4px solid #fff; border-radius: 12px; box-shadow: 0 5px 16px rgba(16,63,70,.16); }
.profile-club-body > div { min-width: 0; padding-top: .7rem; }
.profile-club-body h2 { overflow: hidden; margin: 0 0 .2rem; color: #25282A; font-size: .9rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.profile-club-body p, .profile-club-body span { margin: 0; color: #8A9195; font-size: .66rem; }
.profile-card-handle { display: block; overflow: hidden; margin-bottom: .15rem !important; color: #176B73 !important; font-size: .67rem !important; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.profile-visitor-actions .btn-follow.is-following { color: #176B73; background: #E8F2F2; border-color: #CFE2E1; }
.profile-friend-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.profile-badges-shell { padding: 1.25rem; background: #fff; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.04); }
.profile-badges-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.profile-badges-heading span { color: #B87920; font-size: .65rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.profile-badges-heading h2 { margin: .18rem 0 0; color: #25282A; font-size: 1.05rem; }
.profile-badges-manage { display: inline-flex; align-items: center; gap: .35rem; min-height: 36px; padding: .45rem .75rem; color: #176B73; background: #E8F2F2; border: 0; border-radius: 9px; font-size: .72rem; font-weight: 800; }
.profile-badge-group + .profile-badge-group { margin-top: 1.35rem; }
.profile-badge-group-title { display: flex; align-items: center; gap: .5rem; margin-bottom: .7rem; color: #596164; font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.profile-badge-group-title::after { content: ""; flex: 1; height: 1px; background: #E8ECEB; }
.profile-badge-group-title small { order: 2; display: grid; place-items: center; min-width: 21px; height: 21px; color: #176B73; background: #E8F2F2; border-radius: 50%; font-size: .62rem; }
.profile-badge-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.profile-badge-card { position: relative; display: flex; align-items: flex-start; flex-direction: row; gap: .8rem; min-width: 0; margin: 0; padding: 1rem; overflow: hidden; border: 1px solid #EBEFEE; border-radius: 12px; box-shadow: none; }
.profile-badge-card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 3px; background: linear-gradient(90deg, #176B73, #E9A23B); }
.profile-badge-icon { display: grid; place-items: center; flex: 0 0 auto; width: 58px; height: 58px; overflow: hidden; color: #B87920; background: #FFF4E4; border: 1px solid #F5DEB9; border-radius: 15px; font-size: 1.65rem; }
.profile-badge-icon img { width: 100%; height: 100%; object-fit: contain; padding: .25rem; }
.profile-badge-copy { min-width: 0; }
.profile-badge-earned { display: inline-flex; align-items: center; gap: .2rem; color: #176B73; font-size: .57rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.profile-badge-copy h3 { margin: .18rem 1rem .25rem 0; color: #25282A; font-size: .86rem; }
.profile-badge-copy p { display: -webkit-box; overflow: hidden; margin: 0 0 .45rem; color: #7B8387; font-size: .7rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.profile-badge-copy small { color: #9A7A4A; font-size: .62rem; }
.profile-badge-visible { position: absolute; top: .65rem; right: .65rem; display: grid; place-items: center; width: 24px; height: 24px; color: #176B73; background: #E8F2F2; border-radius: 7px; font-size: .75rem; }
.profile-friend-card { display: flex; flex-direction: row; align-items: center; gap: .75rem; margin: 0; padding: .85rem; color: #354044; border: 1px solid rgba(37,40,42,.07); border-radius: 12px; box-shadow: 0 8px 24px rgba(23,26,29,.04); transition: transform .2s ease, box-shadow .2s ease; }
.profile-friend-card:hover { color: #176B73; box-shadow: 0 12px 28px rgba(23,26,29,.08); transform: translateY(-1px); }
.profile-friend-card > a { display: flex; align-items: center; gap: .75rem; flex: 1; min-width: 0; color: inherit; }
.profile-friend-card > a > img { flex: 0 0 52px; width: 52px; height: 52px; object-fit: cover; border-radius: 12px; }
.profile-friend-card > a > span { display: grid; flex: 1; min-width: 0; }
.profile-friend-card strong { overflow: hidden; color: #25282A; font-size: .78rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.profile-friend-card small { overflow: hidden; color: #8A9195; font-size: .64rem; text-overflow: ellipsis; white-space: nowrap; }
.profile-friend-card > i { color: #A0A7AA; }
.profile-friend-remove-card { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; padding: 0; color: #B13B3B; background: #FCEDED; border: 0; border-radius: 8px; }
.profile-friend-remove-card:hover { color: #fff; background: #B13B3B; }
.profile-friend-action.is-friend:not(:disabled):hover { color: #fff; background: #B13B3B; border-color: #B13B3B; }

@media (max-width: 991.98px) {
    .profile-highlights { grid-template-columns: repeat(2, 1fr); }
    .profile-highlights > div:nth-child(3) { border-left: 0; }
    .profile-highlights > div:nth-child(n+3) { border-top: 1px solid #E8EAEB; }
    .profile-dashboard-grid { grid-template-columns: 1fr; }
    .profile-dashboard-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .profile-dashboard-side .profile-safety-card { grid-column: 1 / -1; }
    .profile-club-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .profile-friend-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .profile-badge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
    .profile-identity-card { align-items: center; margin-inline: 7px; }
    .profile-identity-main { align-items: center; }
    .profile-identity-avatar-wrap { margin-top: -58px; }
    .profile-showcase-page .profile-avatar { width: 108px; height: 108px; }
    .profile-identity-meta { display: grid; gap: .25rem; }
}

@media (max-width: 575.98px) {
    .profile-identity-card { display: grid; gap: 1rem; padding: 1rem; }
    .profile-identity-main { align-items: flex-end; gap: .8rem; }
    .profile-identity-avatar-wrap { margin-top: -50px; }
    .profile-showcase-page .profile-avatar { width: 92px; height: 92px; border-width: 4px; }
    .profile-eyebrow { font-size: .58rem; }
    .profile-identity-copy h1 { font-size: 1.1rem; }
    .profile-identity-actions, .profile-showcase-page .profile-primary-action { width: 100%; }
    .profile-highlights, .profile-journey-grid, .profile-destination-grid, .profile-dashboard-side { grid-template-columns: 1fr; }
    .profile-highlights > div { border-top: 1px solid #E8EAEB; border-left: 0; }
    .profile-highlights > div:first-child { border-top: 0; }
    .profile-content-card { padding: 1rem; }
    .profile-photo-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .profile-club-grid { grid-template-columns: 1fr; }
    .profile-friend-grid { grid-template-columns: 1fr; }
    .profile-badge-grid { grid-template-columns: 1fr; }
    .profile-badges-shell { padding: 1rem; }
    .profile-badges-heading { align-items: flex-start; flex-direction: column; }
}

/* Profile editor */
.profile-edit-page { max-width: 1120px; margin: 0 auto; }
.profile-edit-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.5rem; }
.profile-edit-eyebrow { display: block; margin-bottom: .25rem; color: #176B73; font-size: .68rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.profile-edit-heading h1 { margin: 0; color: #25282A; font-size: clamp(1.6rem, 3vw, 2rem); font-weight: 800; letter-spacing: -.035em; }
.profile-edit-heading p { max-width: 680px; margin: .3rem 0 0; color: #747A7E; line-height: 1.55; }
.profile-edit-back { display: inline-flex; align-items: center; gap: .4rem; flex: 0 0 auto; color: #176B73; background: #E8F2F2; border: 0; border-radius: 9px; font-weight: 700; }
.profile-edit-back:hover { color: #fff; background: #176B73; }

.profile-edit-preview,
.profile-edit-section { overflow: hidden; border: 1px solid rgba(37,40,42,.075); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.045); }
.profile-edit-preview { position: sticky; top: calc(var(--mototribo-topbar-height) + 1rem); }
.profile-edit-cover { height: 126px; overflow: hidden; background: #103F46; }
.profile-cover-form { position: relative; }
.profile-edit-cover img { width: 100%; height: 100%; object-fit: cover; object-position: center 56%; }
.profile-cover-picker { position: absolute; right: .65rem; bottom: .65rem; display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .6rem; color: #fff; background: rgba(23,26,29,.72); border: 1px solid rgba(255,255,255,.25); border-radius: 8px; font-size: .66rem; font-weight: 700; cursor: pointer; backdrop-filter: blur(8px); }
.profile-cover-picker:hover { background: #176B73; }
.profile-cover-submit { position: absolute; left: .65rem; bottom: .65rem; z-index: 3; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; width: auto; min-height: 34px; margin: 0; padding: .35rem .65rem; color: #171A1D; background: #E9A23B; border: 0; border-radius: 8px; font-size: .7rem; font-weight: 800; box-shadow: 0 4px 14px rgba(23,26,29,.18); }
.profile-cover-submit:hover { color: #fff; background: #103F46; }
.profile-cover-submit:disabled { display: none; }
.profile-edit-preview .card-body { padding: 0 1.35rem 1.35rem; }
.profile-edit-avatar-wrap { position: relative; display: inline-block; margin-top: -58px; }
.profile-edit-avatar { width: 116px; height: 116px; object-fit: cover; border: 5px solid #fff; border-radius: 14px; box-shadow: 0 8px 24px rgba(16,63,70,.18); }
.profile-edit-preview h2 { margin: .65rem 0 0; color: #25282A; font-size: 1.15rem; font-weight: 800; }
.profile-avatar-form { display: grid; gap: .7rem; }
.profile-avatar-picker { display: flex; align-items: center; gap: .65rem; padding: .7rem .8rem; text-align: left; background: #F5F7F6; border: 1px dashed #BEC8C8; border-radius: 10px; cursor: pointer; transition: border-color .2s ease, background-color .2s ease; }
.profile-avatar-picker:hover { background: #EDF5F4; border-color: #176B73; }
.profile-avatar-picker > i { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; color: #176B73; background: #DDEEEE; border-radius: 9px; font-size: 1.15rem; }
.profile-avatar-picker span { min-width: 0; }
.profile-avatar-picker strong, .profile-avatar-picker small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-avatar-picker strong { color: #303638; font-size: .76rem; }
.profile-avatar-picker small { color: #8A9195; font-size: .66rem; }
.profile-avatar-submit { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 40px; color: #fff; background: #176B73; border: 0; border-radius: 9px; font-weight: 700; }
.profile-avatar-submit:hover { color: #fff; background: #103F46; }
.profile-avatar-submit:disabled { color: #899294; background: #E6EAEA; opacity: 1; }
.profile-photo-tip { display: flex; align-items: flex-start; gap: .55rem; margin-top: 1rem; padding-top: 1rem; color: #7A8386; text-align: left; border-top: 1px solid #ECEEEE; }
.profile-photo-tip i { flex: 0 0 auto; color: #E9A23B; font-size: 1.05rem; }
.profile-photo-tip p { margin: 0; font-size: .66rem; line-height: 1.55; }

.profile-edit-section { margin-bottom: 1rem; }
.profile-edit-section .card-header { display: flex; align-items: center; gap: .75rem; padding: 1rem 1.25rem; background: #fff; border-bottom: 1px solid #EEF0F0; }
.profile-section-icon { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; color: #176B73; background: #E8F2F2; border-radius: 10px; font-size: 1.15rem; }
.profile-edit-section h3 { margin: 0; color: #25282A; font-size: .94rem; font-weight: 800; }
.profile-edit-section .card-header p,
.profile-privacy-copy p { margin: .08rem 0 0; color: #8A9195; font-size: .68rem; line-height: 1.4; }
.profile-edit-section .card-body { padding: 1.25rem; }
.profile-field { margin: 0; }
.profile-field .form-label { margin-bottom: .4rem; color: #3A4144; font-size: .72rem; font-weight: 700; }
.profile-character-count { color: #9AA1A4; font-size: .65rem; }
.profile-edit-form .form-control,
.profile-edit-form .form-select,
.profile-edit-form .input-group-text { min-height: 43px; border-color: #DDE2E1; border-radius: 9px; }
.profile-edit-form textarea.form-control { min-height: 112px; resize: vertical; }
.profile-edit-form .form-control:focus,
.profile-edit-form .form-select:focus { border-color: #176B73; box-shadow: 0 0 0 .2rem rgba(23,107,115,.11); }
.profile-input-icon { position: relative; }
.profile-input-icon > i { position: absolute; top: 50%; left: .8rem; z-index: 2; color: #176B73; font-size: 1.05rem; transform: translateY(-50%); pointer-events: none; }
.profile-input-icon .form-control { padding-left: 2.45rem; }
.profile-social-input .input-group-text { color: #176B73; background: #EEF5F4; border-right: 0; font-weight: 700; }
.profile-social-input .form-control { border-left: 0; }
.profile-privacy-section .card-body { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.profile-privacy-copy { display: flex; align-items: center; gap: .75rem; }
.profile-privacy-section .form-switch .form-check-input { width: 2.75rem; height: 1.45rem; margin: 0; border-color: #B8C1C2; }
.profile-privacy-section .form-check-input:checked { background-color: #176B73; border-color: #176B73; }
.profile-edit-actions { position: sticky; bottom: 0; z-index: 3; display: flex; justify-content: flex-end; gap: .65rem; margin-top: .25rem; padding: 1rem; background: rgba(248,249,250,.92); border-top: 1px solid rgba(37,40,42,.07); backdrop-filter: blur(10px); }
.profile-edit-cancel { min-height: 42px; padding: .55rem 1rem; color: #687174; background: #ECEFEE; border: 0; border-radius: 9px; font-weight: 700; }
.profile-edit-save { display: inline-flex; align-items: center; gap: .45rem; min-height: 42px; padding: .55rem 1.1rem; color: #171A1D; background: #E9A23B; border: 0; border-radius: 9px; font-weight: 800; }
.profile-edit-save:hover { color: #171A1D; background: #F2B553; }

@media (max-width: 991.98px) {
    .profile-edit-preview { position: static; }
}

@media (max-width: 767.98px) {
    .profile-edit-heading { align-items: flex-start; }
    .profile-edit-heading p { font-size: .78rem; }
    .profile-edit-back { width: 38px; height: 38px; padding: 0; justify-content: center; }
    .profile-edit-back:not(:hover) { font-size: 0; }
    .profile-edit-back i { font-size: 1.05rem; }
    .profile-edit-section .card-body { padding: 1rem; }
    .profile-edit-actions { margin-right: -.75rem; margin-left: -.75rem; }
}

/* Standard MotoTribo profile cover height. */
.mototribo-profile-page .profile-hero {
    width: 100%;
    height: 250px !important;
    min-height: 250px !important;
    aspect-ratio: auto;
}

.mototribo-profile-page .profile-cover-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
    min-height: 0 !important;
    object-fit: cover;
    object-position: center bottom;
}

/* The information card must not mask the lower focal area of the cover. */
.mototribo-profile-page .profile-content-row {
    margin-top: 0 !important;
}

.profile-edit-cover img {
    object-position: center bottom;
}

.profile-edit-cover {
    width: 100%;
    height: auto;
    aspect-ratio: 4.14 / 1;
}

/* Profile identity lives over the cover, following the MotoTribo reference. */
.mototribo-profile-page .profile-cover-overlay {
    background: linear-gradient(180deg, rgba(16,63,70,0) 42%, rgba(10,31,35,.78) 100%);
}

.profile-hero-identity {
    position: absolute;
    right: 2rem;
    bottom: 1.5rem;
    left: 2rem;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    color: #fff;
}

.profile-hero-avatar-wrap { position: relative; flex: 0 0 auto; }

.mototribo-profile-page .profile-hero-identity .profile-avatar {
    display: block;
    width: 116px;
    height: 116px;
    border: 4px solid #fff;
    border-radius: 50%;
    box-shadow: 0 10px 28px rgba(0,0,0,.3);
}

.profile-hero-copy { min-width: 0; padding-bottom: .15rem; text-shadow: 0 2px 10px rgba(0,0,0,.55); }
.mototribo-profile-page .profile-hero-copy .profile-display-name { margin: 0; color: #fff; font-size: 1.25rem; }

.profile-level-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    margin-top: .3rem;
    padding: .22rem .55rem;
    color: #171A1D;
    background: #E9A23B;
    border-radius: 50rem;
    font-size: .68rem;
    font-weight: 800;
    line-height: 1.2;
    text-shadow: none;
}

.profile-hero-meta { display: flex; flex-wrap: wrap; gap: .35rem 1rem; margin-top: .5rem; }
.profile-hero-meta span { display: inline-flex; align-items: center; gap: .35rem; font-size: .72rem; font-weight: 600; }
.profile-hero-meta i { color: #E9A23B; font-size: .95rem; }

.mototribo-profile-page .profile-content-row {
    width: 100%;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.mototribo-profile-page .profile-content-row > [class*="col-"] { padding-right: 0; padding-left: 0; }

@media (max-width: 767.98px) {
    .profile-hero-identity { right: 1rem; bottom: 1rem; left: 1rem; gap: .75rem; }
    .mototribo-profile-page .profile-hero-identity .profile-avatar { width: 88px; height: 88px; }
    .mototribo-profile-page .profile-hero-copy .profile-display-name { font-size: 1rem; }
    .profile-hero-meta { display: grid; gap: .2rem; }
    .profile-hero-meta span { font-size: .64rem; }
}

/* Final profile header composition. */
.mototribo-profile-page .profile-hero {
    z-index: 4;
    overflow: visible;
    border-radius: 12px 12px 0 0;
}

.mototribo-profile-page .profile-cover-image,
.mototribo-profile-page .profile-cover-overlay { border-radius: 12px 12px 0 0; }

.profile-hero-identity {
    right: 1.75rem;
    bottom: 0;
    left: 1.75rem;
    align-items: flex-end;
    gap: .85rem;
}

.mototribo-profile-page .profile-hero-identity .profile-avatar {
    width: 116px;
    height: 116px;
    transform: translateY(22px);
}

.profile-avatar-level {
    position: absolute;
    right: 50%;
    bottom: -29px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    padding: .2rem .55rem;
    color: #fff;
    background: #176B73;
    border: 2px solid #fff;
    border-radius: 50rem;
    box-shadow: 0 4px 10px rgba(0,0,0,.2);
    font-size: .62rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    text-shadow: none;
    transform: translateX(50%);
}

.profile-hero-copy { padding-bottom: .8rem; }
.mototribo-profile-page .profile-hero-copy .profile-display-name { font-size: 1.1rem; }
.profile-verified-badge {
    display: inline-flex;
    align-items: center;
    margin-left: .2rem;
    color: #38BDF8;
    font-size: .88em;
    line-height: 1;
    vertical-align: middle;
    filter: drop-shadow(0 1px 3px rgba(0,0,0,.3));
}
.profile-hero-meta { display: grid; gap: .2rem; margin-top: .35rem; }
.profile-hero-meta span { font-size: .68rem; }

.mototribo-profile-page .mototribo-profile-card,
.mototribo-profile-page .mototribo-profile-card .card-body {
    min-height: 76px;
}

.mototribo-profile-page .mototribo-profile-card {
    z-index: 1;
    border-radius: 0 0 12px 12px;
}

.mototribo-profile-page .mototribo-profile-card .card-body { padding: .7rem 1.5rem; }
.profile-summary-grid { min-height: 54px; }

.profile-social-strip {
    display: flex;
    align-items: center;
    gap: .45rem;
    min-height: 42px;
    padding-left: 132px;
}
.profile-social-strip a,
.profile-social-strip .profile-social-icon {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 5px;
}
.profile-social-strip i { display: block; font-size: 24px; line-height: 1; }
.profile-social-strip .fa-facebook-square { color: #1877F2; }
.profile-social-strip .fa-twitter-square { color: #1DA1F2; }
.profile-social-strip .fa-instagram-square { color: #D62976; }
.profile-social-strip .fa-youtube-square { color: #FF0000; }
.profile-social-strip .fa-linkedin { color: #0A66C2; }
.profile-social-strip .fa-globe { color: #176B73; }
.profile-social-strip .far.fa-globe { font-family: "Font Awesome 5 Free"; font-weight: 900; }
.profile-social-strip .is-pending { cursor: default; opacity: .72; }
.mototribo-profile-page .profile-right { padding-right: 6.75rem; }
.mototribo-profile-page .profile-visitor-header .profile-right { padding-right: 19rem; }
.profile-card-edit { top: 50%; transform: translateY(-50%); }

@media (max-width: 991.98px) {
    .profile-social-strip { padding-left: 104px; }
    .mototribo-profile-page .profile-right { padding-right: 3rem; }
    .mototribo-profile-page .profile-visitor-header .profile-right { padding-right: 18rem; }
}

@media (max-width: 767.98px) {
    .profile-hero-identity { right: 1rem; left: 1rem; }
    .mototribo-profile-page .profile-hero-identity .profile-avatar { width: 88px; height: 88px; transform: translateY(16px); }
    .profile-avatar-level { bottom: -23px; }
    .profile-hero-copy { padding-bottom: .55rem; }
    .mototribo-profile-page .mototribo-profile-card .card-body { padding: .65rem 1rem; }
    .mototribo-profile-page .profile-left { margin-top: 0; }
    .profile-social-strip { padding-left: 96px; }
    .mototribo-profile-page .profile-right { margin-top: .35rem; padding-right: 2.75rem; }
    .mototribo-profile-page .profile-visitor-header .profile-right { padding-right: 12rem; }
    .profile-visitor-actions { right: .6rem; gap: .3rem; }
    .profile-visitor-actions .profile-primary-action { min-height: 34px; padding: .4rem .65rem; font-size: .7rem; }
    .profile-visitor-actions .profile-secondary-action { width: 34px; min-height: 34px; padding: 0; }
    .profile-friend-action span { display: none; }
}

.profile-friend-action { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; min-height: 40px; padding: .55rem .8rem; color: #176B73; background: #fff; border: 1px solid #176B73; border-radius: 9px; font-size: .72rem; font-weight: 800; }
.profile-friend-action:hover:not(:disabled) { color: #fff; background: #176B73; }
.profile-friend-action:disabled { color: #667075; background: #F0F3F2; border-color: #D8DEDC; opacity: 1; }
.profile-friend-action.is-friend { color: #176B73; background: #E8F2F2; border-color: #CFE2E1; }
.profile-friend-requests { margin: 0 0 1rem; padding: 1.25rem; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; }
.profile-friend-request-list { display: grid; gap: .65rem; }
.profile-friend-request { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem; background: #F6F8F7; border-radius: 10px; }
.profile-friend-request > a { display: flex; align-items: center; gap: .7rem; min-width: 0; color: #354044; }
.profile-friend-request img { width: 46px; height: 46px; object-fit: cover; border-radius: 10px; }
.profile-friend-request a > span { display: grid; min-width: 0; }
.profile-friend-request strong { font-size: .77rem; font-weight: 800; }
.profile-friend-request small { color: #8A9195; font-size: .65rem; }
.profile-friend-request > div { display: flex; gap: .35rem; }
.btn-accept-friend { color: #fff; background: #176B73; border: 0; font-size: .7rem; font-weight: 800; }
.btn-reject-friend { display: grid; place-items: center; width: 34px; padding: 0; color: #B13B3B; background: #FCEDED; border: 0; }
.header-notification { width: min(380px, calc(100vw - 1rem)); }
.header-notification .item-header-scroll { max-height: 360px; overflow-x: hidden; overflow-y: auto; }
.topbar-notification-item { position: relative; display: flex; align-items: flex-start; gap: .7rem; padding: .8rem .2rem; color: #354044; border-bottom: 1px solid #E8EAEB; }
.topbar-notification-item:last-child { border-bottom: 0; }
.topbar-notification-item:hover { color: #176B73; background: #F7F9F8; }
.topbar-notification-item.is-unread::after { position: absolute; top: .9rem; right: .2rem; width: 7px; height: 7px; background: #E9A23B; border-radius: 50%; content: ""; }
.topbar-notification-avatar,
.topbar-notification-icon { display: grid; place-items: center; flex: 0 0 42px; width: 42px !important; min-width: 42px; max-width: 42px; height: 42px !important; min-height: 42px; max-height: 42px; margin: 0; object-fit: cover; border-radius: 50%; }
.topbar-notification-avatar { background: #E8F2F2; }
.topbar-notification-icon { color: #176B73; background: #E8F2F2; font-size: 1.15rem; }
.topbar-notification-copy { display: grid; flex: 1; min-width: 0; padding-right: .7rem; }
.topbar-notification-heading { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; }
.topbar-notification-heading strong { overflow: hidden; color: #25282A; font-size: .72rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.topbar-notification-heading time { flex: 0 0 auto; color: #9AA1A4; font-size: .56rem; }
.topbar-notification-copy > small { display: -webkit-box; overflow: hidden; margin-top: .15rem; color: #7B8387; font-size: .65rem; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

/* Photo posts */
.post-notification-focus { outline: 3px solid rgba(233,162,59,.55); box-shadow: 0 0 0 7px rgba(233,162,59,.12), 0 12px 32px rgba(23,26,29,.1); transition: outline-color .3s ease, box-shadow .3s ease; }
.composer-photo-preview { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .55rem; margin: 1rem 0 0 3.75rem; }
.composer-photo-item { position: relative; overflow: hidden; aspect-ratio: 1; background: #E8EAEB; border-radius: 11px; }
.composer-photo-item img { width: 100%; height: 100%; object-fit: cover; }
.composer-photo-remove { position: absolute; top: .4rem; right: .4rem; display: grid; place-items: center; width: 26px; height: 26px; padding: 0; color: #fff; background: rgba(23,26,29,.75); border: 1px solid rgba(255,255,255,.25); border-radius: 50%; backdrop-filter: blur(5px); }
.composer-photo-remove:hover { background: #B13B3B; }
.composer-photo-cover { position: absolute; bottom: .4rem; left: .4rem; z-index: 1; padding: .18rem .45rem; color: #171A1D; background: #E9A23B; border-radius: 5px; font-size: .56rem; font-weight: 800; }
.composer-photo-note { display: flex; align-items: center; gap: .35rem; margin: .6rem 0 0 3.75rem; color: #8A9195; font-size: .62rem; }
.composer-photo-note i { color: #176B73; }
.moto-composer .composer-action { border: 0; }
.post-photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(180px, 260px); gap: .28rem; overflow: hidden; border-radius: 12px; }
.post-photo-item { display: block; overflow: hidden; min-height: 0; background: #E8EAEB; }
.post-photo-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.post-photo-item:hover img { transform: scale(1.025); }
.post-photo-count-1 { grid-template-columns: 1fr; grid-auto-rows: minmax(280px, 520px); }
.post-photo-count-3 .post-photo-item:first-child { grid-row: span 2; }
.post-photo-count-3 { grid-auto-rows: minmax(130px, 210px); }
.post-photo-count-5 .post-photo-item:first-child { grid-row: span 2; }
.post-photo-count-5 { grid-template-columns: 1.2fr 1fr 1fr; grid-auto-rows: minmax(120px, 190px); }

@media (max-width: 575.98px) {
    .composer-photo-preview { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-left: 0; }
    .composer-photo-note { margin-left: 0; }
    .post-photo-grid { grid-auto-rows: minmax(120px, 190px); }
    .post-photo-count-1 { grid-auto-rows: minmax(220px, 360px); }
    .post-photo-count-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Notification center */
.notification-page { max-width: 1040px; margin: 0 auto; }
.notification-page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.25rem; }
.notification-page-eyebrow { display: block; margin-bottom: .25rem; color: #176B73; font-size: .68rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.notification-page-heading h1 { margin: 0; color: #25282A; font-size: clamp(1.65rem, 3vw, 2.1rem); font-weight: 800; letter-spacing: -.035em; }
.notification-page-heading p { margin: .3rem 0 0; color: #747A7E; font-size: .82rem; }
.notification-read-all { display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; color: #176B73; background: #E8F2F2; border: 0; border-radius: 9px; font-size: .72rem; font-weight: 800; }
.notification-read-all:hover { color: #fff; background: #176B73; }
.notification-summary { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 1rem; background: #fff; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.04); }
.notification-summary > div { display: grid; grid-template-columns: 42px 1fr; grid-template-rows: auto auto; gap: 0 .7rem; padding: 1rem 1.2rem; border-left: 1px solid #E8EAEB; }
.notification-summary > div:first-child { border-left: 0; }
.notification-summary span { grid-row: 1 / 3; display: grid; place-items: center; width: 42px; height: 42px; color: #176B73; background: #E8F2F2; border-radius: 11px; font-size: 1.2rem; }
.notification-summary strong { color: #25282A; font-size: 1rem; font-weight: 800; }
.notification-summary small { color: #8A9195; font-size: .67rem; }
.notification-filters { display: flex; overflow-x: auto; gap: .4rem; margin-bottom: 1.15rem; padding: .35rem; background: #fff; border: 1px solid rgba(37,40,42,.07); border-radius: 11px; }
.notification-filters button { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; flex: 0 0 auto; min-height: 38px; padding: .5rem .85rem; color: #697276; background: transparent; border: 0; border-radius: 8px; font-size: .7rem; font-weight: 750; }
.notification-filters button:hover { color: #176B73; background: #F3F7F6; }
.notification-filters button.active { color: #fff; background: #176B73; }
.notification-filters small { display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 .28rem; color: #176B73; background: #E8F2F2; border-radius: 20px; font-size: .58rem; }
.notification-filters .active small { color: #103F46; background: #fff; }
.notification-timeline { display: grid; gap: 1rem; }
.notification-group-heading { display: flex; align-items: center; gap: .45rem; margin: 0 0 .5rem .2rem; }
.notification-group-heading h2 { margin: 0; color: #596267; font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.notification-group-heading span { display: grid; place-items: center; min-width: 20px; height: 20px; padding: 0 .3rem; color: #176B73; background: #E8F2F2; border-radius: 20px; font-size: .6rem; }
.notification-list-card { overflow: hidden; margin: 0; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; box-shadow: 0 8px 26px rgba(23,26,29,.04); }
.notification-row { position: relative; display: flex; align-items: center; gap: .8rem; min-height: 92px; padding: 1rem 1.1rem; background: #fff; border-bottom: 1px solid #EEF0F0; }
.notification-row:last-child { border-bottom: 0; }
.notification-row.is-unread { background: linear-gradient(90deg, rgba(232,242,242,.72), #fff 46%); }
.notification-row-main { display: flex; align-items: center; gap: .85rem; flex: 1; min-width: 0; color: #354044; }
.notification-row-main:hover { color: #176B73; }
.notification-row-media { display: grid; place-items: center; flex: 0 0 50px; width: 50px; height: 50px; overflow: hidden; color: #176B73; background: #E8F2F2; border-radius: 13px; font-size: 1.3rem; }
.notification-row-media img { width: 100%; height: 100%; object-fit: cover; }
.notification-row-copy { display: grid; min-width: 0; }
.notification-row-title { display: flex; align-items: center; gap: .45rem; }
.notification-row-title strong { overflow: hidden; color: #25282A; font-size: .82rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.notification-row-title > i { flex: 0 0 7px; width: 7px; height: 7px; background: #E9A23B; border-radius: 50%; }
.notification-row-body { display: -webkit-box; overflow: hidden; margin-top: .18rem; color: #747A7E; font-size: .72rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.notification-row-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .8rem; margin-top: .4rem; color: #9AA1A4; font-size: .61rem; }
.notification-row-meta b { color: #176B73; font-weight: 750; }
.notification-row-meta time { display: inline-flex; align-items: center; gap: .25rem; }
.notification-row-actions { display: flex; align-items: center; gap: .4rem; flex: 0 0 auto; }
.notification-context-action { color: #fff; background: #176B73; border: 0; border-radius: 8px; font-size: .67rem; font-weight: 800; }
.notification-context-action:hover { color: #fff; background: #103F46; }
.notification-row .btn-mark-read { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; color: #176B73; background: #E8F2F2; border: 0; border-radius: 8px; }
.notification-empty, .notification-filter-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 300px; padding: 2rem; text-align: center; border: 1px solid rgba(37,40,42,.07); border-radius: 14px; }
.notification-empty > span, .notification-filter-empty > i { display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 1rem; color: #176B73; background: #E8F2F2; border-radius: 17px; font-size: 1.8rem; }
.notification-empty h2, .notification-filter-empty h2 { margin: 0 0 .35rem; color: #25282A; font-size: 1.05rem; font-weight: 800; }
.notification-empty p, .notification-filter-empty p { max-width: 470px; margin: 0 0 1rem; color: #7B8387; font-size: .78rem; }
.notification-primary-link { color: #fff; background: #176B73; border: 0; border-radius: 9px; font-size: .72rem; font-weight: 800; }

@media (max-width: 767.98px) {
    .notification-page-heading { align-items: flex-start; flex-direction: column; gap: .8rem; }
    .notification-summary { grid-template-columns: 1fr; }
    .notification-summary > div { border-top: 1px solid #E8EAEB; border-left: 0; }
    .notification-summary > div:first-child { border-top: 0; }
    .notification-row { align-items: flex-start; padding: .85rem; }
    .notification-row-media { flex-basis: 42px; width: 42px; height: 42px; border-radius: 11px; }
    .notification-row-actions { position: absolute; right: .7rem; bottom: .7rem; }
    .notification-row-copy { padding-bottom: 2rem; }
}

/* ═══════════ Image Crop Modal ═══════════ */
.crop-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: rgba(10, 31, 35, .72);
    backdrop-filter: blur(6px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
}
.crop-modal-overlay.active { opacity: 1; visibility: visible; }

.crop-modal {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 680px;
    max-height: 90vh;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 24px 64px rgba(10, 31, 35, .4);
    transform: scale(.94) translateY(12px);
    transition: transform .25s ease;
}
.crop-modal-overlay.active .crop-modal { transform: scale(1) translateY(0); }

.crop-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #EEF0F0;
}
.crop-modal-header h3 { margin: 0; color: #25282A; font-size: .95rem; font-weight: 800; }
.crop-modal-close {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    padding: 0;
    color: #687174;
    background: #F3F5F5;
    border: 0;
    border-radius: 8px;
    font-size: 1.1rem;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.crop-modal-close:hover { color: #fff; background: #176B73; }

.crop-modal-body {
    flex: 1 1 auto;
    overflow: hidden;
    padding: .75rem;
}

.crop-container {
    position: relative;
    max-height: 56vh;
    background: #1a1a1a;
    border-radius: 10px;
}
.crop-container img {
    display: block;
    max-width: 100%;
}
/* Ensure Cropper.js wrapper respects container height */
.crop-container .cropper-container {
    max-height: 56vh !important;
}

.crop-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 1.25rem;
    border-top: 1px solid #EEF0F0;
}

.crop-toolbar {
    display: flex;
    gap: .35rem;
}
.crop-tool-btn {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    color: #556164;
    background: #F3F5F5;
    border: 0;
    border-radius: 8px;
    font-size: 1rem;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.crop-tool-btn:hover { color: #fff; background: #176B73; }

.crop-actions { display: flex; gap: .5rem; }
.crop-btn-cancel {
    min-height: 38px;
    padding: .45rem .9rem;
    color: #687174;
    background: #ECEFEE;
    border: 0;
    border-radius: 9px;
    font-weight: 700;
    font-size: .78rem;
}
.crop-btn-cancel:hover { color: #25282A; background: #DDE2E1; }
.crop-btn-confirm {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 38px;
    padding: .45rem 1rem;
    color: #171A1D;
    background: #E9A23B;
    border: 0;
    border-radius: 9px;
    font-weight: 800;
    font-size: .78rem;
    transition: background .15s ease;
}
.crop-btn-confirm:hover { background: #F2B553; }

@media (max-width: 575.98px) {
    .crop-modal-overlay { padding: .5rem; }
    .crop-modal { max-height: 95vh; border-radius: 12px; }
    .crop-modal-footer { flex-direction: column; gap: .65rem; }
    .crop-toolbar { justify-content: center; }
    .crop-actions { width: 100%; }
    .crop-btn-cancel, .crop-btn-confirm { flex: 1; justify-content: center; }
}