/*
 * Public storefront parity layer.
 *
 * This file is intentionally loaded after storefront.css. It recreates the
 * former owner-operated public pages while keeping catalog data and pricing
 * inside Tikopanel's single source of truth.
 */

/* Instagram family landing pages */
.tiko-reference-instagram-page {
    --tiko-reference-accent: #d82aad;
    --tiko-reference-accent-dark: #812f8f;
    --tiko-reference-icon-filter: invert(22%) sepia(96%) saturate(6550%) hue-rotate(286deg) brightness(105%) contrast(115%);
    overflow: clip;
    background: #fff;
}

.tiko-reference-instagram-page-instagram-followers {
    --tiko-reference-accent: #db4af1;
    --tiko-reference-accent-dark: #812f8f;
}

.tiko-reference-instagram-page-instagram-likes {
    --tiko-reference-accent: #f14b4b;
    --tiko-reference-accent-dark: #b9374a;
    --tiko-reference-icon-filter: none;
}

.tiko-reference-instagram-page-instagram-views {
    --tiko-reference-accent: #0855df;
    --tiko-reference-accent-dark: #255cba;
    --tiko-reference-icon-filter: none;
}

.tiko-reference-instagram-page-instagram-comments {
    --tiko-reference-accent: #00a33a;
    --tiko-reference-accent-dark: #22733c;
    --tiko-reference-icon-filter: none;
}

.tiko-reference-instagram-page-instagram-explore {
    --tiko-reference-accent: #ff5e21;
    --tiko-reference-accent-dark: #b64b27;
    --tiko-reference-icon-filter: none;
}

.tiko-reference-instagram-hero {
    position: relative;
    min-height: 485px;
    padding: 78px 0 45px;
    overflow: hidden;
    background: #ecf1fd;
}

.tiko-reference-instagram-hero-grid {
    position: relative;
    min-height: 355px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.82fr);
    align-items: center;
    gap: clamp(34px, 7vw, 95px);
}

.tiko-reference-instagram-hero-copy {
    position: relative;
    z-index: 2;
    align-self: center;
}

.tiko-reference-instagram-hero-copy > span {
    display: inline-flex;
    min-height: 39px;
    padding: 8px 17px;
    align-items: center;
    border-radius: 999px;
    background: #dae5ff;
    color: #0855df;
    font-size: 0.81rem;
    font-weight: 700;
}

.tiko-reference-instagram-hero-copy h1 {
    margin: 18px 0 7px;
    color: var(--tiko-reference-accent);
    font-size: clamp(2rem, 4.4vw, 3.45rem);
    font-weight: 900;
    line-height: 1.35;
}

.tiko-reference-instagram-hero-copy p {
    max-width: 635px;
    margin: 5px 0;
    color: #6f7281;
    font-size: clamp(0.94rem, 1.4vw, 1.09rem);
    line-height: 2;
}

.tiko-reference-instagram-hero-copy p strong {
    color: #38415c;
    font-size: clamp(1.15rem, 2vw, 1.55rem);
}

.tiko-reference-instagram-hero figure {
    width: min(128px, 100%);
    margin: 0 auto;
}

.tiko-reference-instagram-hero figure img {
    width: 100%;
    height: auto;
    display: block;
    filter: drop-shadow(0 13px 20px rgba(71, 81, 149, 0.15));
}

.tiko-reference-instagram-discount {
    position: absolute;
    z-index: 3;
    inset-inline-start: 50%;
    inset-block-end: 2px;
    min-height: 48px;
    padding: 10px 22px;
    display: inline-flex;
    align-items: center;
    gap: 11px;
    border-radius: 999px;
    background: #dae5ff;
    box-shadow: none;
    color: #0855df;
    font-size: 0.86rem;
    font-weight: 800;
    transform: translateX(-50%);
}

[dir='rtl'] .tiko-reference-instagram-discount {
    transform: translateX(50%);
}

.tiko-reference-instagram-packages {
    padding: clamp(58px, 8vw, 92px) 0 38px;
    background: #fff;
}

.tiko-reference-instagram-service {
    margin-bottom: clamp(66px, 9vw, 108px);
}

.tiko-reference-instagram-service > header {
    margin-bottom: 26px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.tiko-reference-instagram-service > header img {
    width: 46px;
    height: 45px;
    object-fit: contain;
    filter: var(--tiko-reference-icon-filter);
}

.tiko-reference-instagram-service > header h3 {
    margin: 0;
    color: var(--tiko-reference-accent-dark);
    font-size: clamp(1.35rem, 2.5vw, 1.85rem);
    font-weight: 900;
}

.tiko-reference-instagram-service > header h3 span {
    color: var(--tiko-reference-accent);
}

.tiko-reference-instagram-service > header h3 small {
    color: var(--tiko-reference-accent-dark);
    font: inherit;
}

.tiko-reference-instagram-service > header p {
    margin: 5px 0 0;
    color: #8d91a0;
    font-size: 0.79rem;
}

.tiko-reference-instagram-service > header p .dashicons {
    width: 17px;
    height: 17px;
    margin-inline-end: 4px;
    color: #d28d28;
    font-size: 17px;
}

.tiko-reference-instagram-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 24px;
}

.tiko-reference-package-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(222, 227, 240, 0.72);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    transition: box-shadow 300ms ease, transform 300ms ease;
}

.tiko-reference-package-card:hover {
    box-shadow: 0 0 18px rgba(110, 123, 221, 0.3);
    transform: translateY(-4px);
}

.tiko-reference-package-top {
    position: relative;
    height: 102px;
    padding: 0;
    overflow: hidden;
    display: block;
    color: #444;
}

.tiko-reference-package-top > span {
    position: absolute;
    inset: -35px -40px auto -40px;
    height: 122px;
    background: #e6f0ff;
    transform: rotate(-6deg);
    transform-origin: center;
    transition: transform 500ms ease;
}

.tiko-reference-package-card:hover .tiko-reference-package-top > span {
    transform: rotate(0deg);
}

.tiko-reference-package-top img,
.tiko-reference-package-top > div {
    position: absolute;
    z-index: 1;
}

.tiko-reference-package-top img {
    width: 27px;
    height: 26px;
    inset-block-start: 41px;
    inset-inline-end: 19px;
    padding: 0;
    background: transparent;
    object-fit: contain;
    filter: var(--tiko-reference-icon-filter);
}

.tiko-reference-package-top > div {
    inset: 20px 56px auto;
    min-width: 0;
    display: grid;
    line-height: 1.1;
    text-align: center;
}

.tiko-reference-package-top strong {
    color: #1e83ff;
    font-size: clamp(1.55rem, 2.4vw, 2.18rem);
    font-weight: 900;
}

.tiko-reference-package-top small {
    margin-top: 7px;
    color: #454545;
    font-size: 0.78rem;
}

.tiko-reference-package-body {
    min-height: 288px;
    padding: 27px 18px 15px;
    display: flex;
    flex-direction: column;
}

.tiko-reference-package-features {
    width: fit-content;
    max-width: 100%;
    padding: 0;
    margin: 0 auto;
    display: grid;
    gap: 8px;
    color: #666699;
    font-size: 0.76rem;
    line-height: 1.7;
    list-style: none;
}

.tiko-reference-package-features li {
    display: flex;
    align-items: center;
    gap: 7px;
}

.tiko-reference-package-features .dashicons {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    color: #54aaf8;
    font-size: 17px;
}

.tiko-reference-package-features li:first-child .dashicons {
    color: #f06a43;
}

.tiko-reference-package-price {
    margin-top: auto;
    padding-top: 18px;
    display: block;
    color: #1e83ff;
    font-size: 1.32rem;
    font-weight: 900;
    text-align: center;
}

.tiko-reference-instagram-page .tiko-reference-package-price {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 4px;
    direction: rtl;
    white-space: nowrap;
}

.tiko-reference-instagram-page .tiko-reference-package-price [data-tiko-pack-price-amount] {
    direction: ltr;
    unicode-bidi: isolate;
}

.tiko-reference-instagram-page .tiko-reference-package-price [data-tiko-pack-price-currency] {
    font-size: 11px;
    font-weight: 400;
    line-height: 1;
}

.tiko-reference-package-order {
    min-height: 42px;
    margin-top: 10px;
    padding: 8px 15px;
    display: grid;
    place-items: center;
    border-radius: 5px;
    background: #1e83ff;
    color: #fff;
    font-size: 0.82rem;
    font-weight: 800;
    transition: background 180ms ease, transform 180ms ease;
}

.tiko-reference-package-order:hover,
.tiko-reference-package-order:focus-visible {
    background: var(--tiko-reference-accent);
    color: #fff;
    transform: translateY(-1px);
}

.tiko-reference-instagram-order {
    padding: clamp(62px, 8vw, 94px) 0;
    border-block: 1px solid #e5e9f3;
    background: #f7f8fc;
}

.tiko-reference-instagram-order > .tiko-container > header {
    margin-bottom: 28px;
    text-align: center;
}

.tiko-reference-instagram-order h2 {
    margin: 0;
    color: #4c3e77;
    font-size: clamp(1.55rem, 3vw, 2.15rem);
}

.tiko-reference-instagram-order header p {
    margin: 6px 0 0;
    color: #918ca2;
}

.tiko-reference-instagram-order .tiko-kando-wizard-shell {
    width: min(1060px, 100%);
    margin-inline: auto;
}

.tiko-reference-instagram-copy {
    padding: clamp(60px, 8vw, 96px) 0;
    background: #fff;
}

.tiko-reference-instagram-copy .tiko-prose {
    width: min(1050px, 100%);
    color: #60697a;
    line-height: 2.15;
}

.tiko-reference-instagram-copy h2,
.tiko-reference-instagram-copy h3 {
    color: #4c3e77;
}

.tiko-reference-instagram-copy li::marker {
    color: var(--tiko-reference-accent);
}

.tiko-reference-instagram-page:not(.tiko-reference-instagram-page-instagram-followers) .tiko-reference-family-icon {
    border-radius: 0;
    object-fit: contain;
}

/* Telegram reference page */
.tiko-reference-network-page-telegram .tiko-reference-network-hero h1 {
    color: #acc1f2;
}

.tiko-reference-network-page-telegram .tiko-reference-network-hero h1 strong {
    color: #0855df;
}

.tiko-reference-network-page-telegram .tiko-reference-network-kicker {
    min-height: 36px;
    padding: 7px 16px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #dae5ff;
    color: #0855df;
}

.tiko-reference-network-page-telegram .tiko-reference-network-subtitle {
    color: #242936;
    font-size: clamp(1.05rem, 1.8vw, 1.35rem);
}

.tiko-reference-telegram-packages {
    --tiko-reference-accent: #00abf5;
    --tiko-reference-accent-dark: #0855df;
    --tiko-reference-icon-filter: none;
    padding-top: clamp(58px, 8vw, 88px);
}

.tiko-reference-telegram-service > header h3,
.tiko-reference-telegram-service > header h3 span {
    color: #00abf5;
}

.tiko-reference-telegram-service > header img,
.tiko-reference-telegram-card .tiko-reference-package-top img {
    filter: none;
}

.tiko-reference-telegram-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tiko-reference-telegram-card .tiko-reference-package-price {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 4px;
    direction: rtl;
    white-space: nowrap;
}

.tiko-reference-telegram-card .tiko-reference-package-price [data-tiko-pack-price-amount] {
    direction: ltr;
    unicode-bidi: isolate;
}

.tiko-reference-telegram-card .tiko-reference-package-price [data-tiko-pack-price-currency] {
    font-size: 11px;
    font-weight: 400;
    line-height: 1;
}

.tiko-reference-telegram-card .tiko-reference-package-order:hover,
.tiko-reference-telegram-card .tiko-reference-package-order:focus-visible {
    background: #00abf5;
}

/* Keep rich Telegram descriptions in one readable RTL text flow. WordPress
 * replaces each emoji with an inline image; a flex list item would otherwise
 * treat every emoji and adjacent text run as separate, squeezed flex items. */
.tiko-reference-telegram-card .tiko-reference-package-features {
    width: 100%;
    margin-inline: 0;
}

.tiko-reference-telegram-card .tiko-reference-package-features li {
    min-width: 0;
    display: block;
    text-align: start;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
}

.tiko-reference-telegram-card .tiko-reference-package-features li > .dashicons {
    display: inline-block;
    margin-inline-end: 7px;
    vertical-align: -3px;
}

.tiko-reference-telegram-empty {
    width: min(720px, 100%);
    margin-inline: auto;
    border-color: #b9dcfb;
    background: #f7fbff;
}

.tiko-reference-telegram-empty .tiko-kando-outline-button {
    margin-top: 8px;
    border-color: #0071e3;
    color: #0071e3;
}

.tiko-home-reference-features li {
    padding-inline-start: 0;
}

.tiko-home-reference-features li::before {
    content: none;
}

/* Former Kando services directory */
.tiko-kando-services-page {
    background: #f6f4fb;
}

.tiko-kando-services-stage {
    position: relative;
    min-height: 72vh;
    padding: clamp(66px, 9vw, 108px) 0;
    overflow: hidden;
    background-color: #f6f4fb;
    background-image:
        linear-gradient(155deg, rgba(233, 236, 255, 0.92) 0 17%, transparent 17% 100%),
        linear-gradient(25deg, rgba(241, 237, 249, 0.92) 0 18%, transparent 18% 100%),
        url('../images/services-page-bg.png');
    background-position: top center, bottom center, center 34px;
    background-repeat: no-repeat;
    background-size: 100% 100%, 100% 100%, min(1024px, 100%) auto;
}

.tiko-kando-services-shell {
    position: relative;
    z-index: 1;
    padding: clamp(18px, 3vw, 34px);
    border: 1px solid rgba(224, 224, 236, 0.9);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 14px 42px rgba(53, 46, 83, 0.08);
}

.tiko-kando-services-title {
    margin: 0 0 25px;
    color: #4c3e77;
    font-size: clamp(1.5rem, 3vw, 2.05rem);
    text-align: center;
}

.tiko-kando-services-page .tiko-native-services-tools {
    position: static;
    padding: 0 0 25px;
    margin: 0;
    display: grid;
    grid-template-columns: minmax(230px, 1.35fr) minmax(190px, 0.65fr) auto auto;
    align-items: end;
    gap: 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tiko-kando-services-page .tiko-native-services-tools label {
    color: #777287;
}

.tiko-kando-services-page .tiko-native-services-tools input,
.tiko-kando-services-page .tiko-native-services-tools select {
    min-height: 43px;
    border: 1px solid #dde1ea;
    border-radius: 4px;
    background: #fff;
}

.tiko-kando-services-search-button,
.tiko-kando-services-page .tiko-native-services-tools button {
    min-height: 43px;
    padding: 8px 17px;
    border: 0;
    border-radius: 4px;
    background: #1e83ff;
    color: #fff;
    font: inherit;
    font-size: 0.77rem;
    font-weight: 800;
    cursor: pointer;
}

.tiko-kando-services-page .tiko-native-services-tools output {
    color: #6e7bdd;
}

.tiko-kando-services-page .tiko-native-services-groups {
    display: grid;
    gap: 27px;
}

.tiko-kando-services-page .tiko-native-services-network {
    margin: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tiko-kando-services-page .tiko-native-services-network > header {
    padding: 15px 18px;
    border-radius: 7px 7px 0 0;
    background: #f8f8fb;
    color: #4c3e77;
}

.tiko-kando-services-page .tiko-native-services-network > header h2 {
    color: #4c3e77;
    font-size: 1rem;
}

.tiko-kando-services-page .tiko-native-services-network > header span {
    color: #9c96aa;
}

.tiko-kando-services-page .tiko-native-services-category {
    margin-bottom: 18px;
    overflow: hidden;
    border: 1px solid #e7e5ec;
    border-radius: 0 0 7px 7px;
    background: #fff;
}

.tiko-kando-services-page .tiko-native-services-category + .tiko-native-services-category {
    border-radius: 7px;
}

.tiko-kando-services-page .tiko-native-services-category h3 {
    padding: 13px 16px;
    background: #fff;
    color: #5a536d;
    font-size: 0.88rem;
    text-align: center;
}

.tiko-kando-services-page .tiko-native-services-table th,
.tiko-kando-services-page .tiko-native-services-table td {
    padding: 12px 13px;
    border-color: #eeeeef;
    color: #666171;
    font-size: 0.72rem;
    text-align: center;
}

.tiko-kando-services-page .tiko-native-services-table th {
    background: #f9f9fb;
    color: #746e80;
    font-weight: 800;
}

.tiko-kando-services-page .tiko-native-services-table td:nth-child(2) {
    width: 31%;
    text-align: start;
}

.tiko-kando-services-page .tiko-native-services-table td:nth-child(2) strong {
    color: #484251;
}

.tiko-kando-service-description {
    position: relative;
    display: inline-block;
}

.tiko-kando-service-description summary {
    min-height: 31px;
    padding: 5px 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: #f3649b;
    color: #fff;
    font-size: 0.7rem;
    font-weight: 800;
    cursor: pointer;
    list-style: none;
}

.tiko-kando-service-description summary::-webkit-details-marker {
    display: none;
}

.tiko-kando-service-description > div {
    position: absolute;
    z-index: 20;
    inset-block-start: calc(100% + 7px);
    inset-inline-end: 0;
    width: min(330px, 76vw);
    padding: 14px;
    border: 1px solid #e5e2eb;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 12px 35px rgba(40, 32, 61, 0.16);
    color: #5e5867;
    font-size: 0.72rem;
    line-height: 1.9;
    text-align: start;
}

.tiko-kando-services-page .tiko-native-status {
    background: #eaf9f2;
    color: #198a5b;
}

.tiko-kando-service-order {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 4px;
    background: #f3649b;
    color: #fff;
}

.tiko-kando-service-order:hover,
.tiko-kando-service-order:focus-visible {
    background: #d82aad;
    color: #fff;
}

.tiko-kando-service-order .dashicons {
    width: 18px;
    height: 18px;
    font-size: 18px;
}

/* Former split authentication screen */
body.tiko-native-auth-view {
    background: #fff;
    overflow-x: hidden;
}

.tiko-native-auth-view .tiko-native-auth-page {
    min-height: 100vh;
    padding: 0;
    display: block;
    background: #fff;
}

.tiko-native-auth-view .tiko-native-auth-back {
    position: absolute;
    z-index: 6;
    inset-block-start: clamp(68px, 12vh, 124px);
    inset-inline: auto;
    left: calc(50% + clamp(58px, 7vw, 112px));
    padding: 7px 12px;
    border: 0;
    border-radius: 4px;
    background: #f4f4f4;
    color: #5d6170;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 500;
}

.tiko-native-auth-view .tiko-native-auth-shell {
    width: 100%;
    min-height: 100vh;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    direction: ltr;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.tiko-native-auth-view .tiko-native-auth-brand,
.tiko-native-auth-view .tiko-native-auth-form {
    direction: rtl;
}

.tiko-native-auth-view .tiko-native-auth-brand {
    grid-column: 1;
    min-height: 100vh;
    padding: clamp(45px, 5vw, 78px);
    align-items: center;
    text-align: center;
    background-color: #087dea;
    background-image: url('../images/auth-reference-bg.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.tiko-native-auth-view .tiko-native-auth-illustration {
    width: min(500px, 74%);
    height: auto;
    max-height: 56vh;
    object-fit: contain;
}

.tiko-native-auth-view .tiko-native-auth-brand > div {
    margin-top: clamp(8px, 2vh, 24px);
}

.tiko-native-auth-view .tiko-native-auth-brand h2 {
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(1.55rem, 2.1vw, 2.05rem);
}

.tiko-native-auth-view .tiko-native-auth-brand p {
    max-width: 450px;
    margin: 0 auto;
    color: #fff;
    font-size: 0.88rem;
    line-height: 1.9;
}

.tiko-native-auth-view .tiko-native-auth-brand ul {
    display: none;
}

.tiko-native-auth-view .tiko-native-auth-form {
    grid-column: 2;
    width: min(500px, calc(100% - 70px));
    min-width: 0;
    padding: clamp(110px, 15vh, 155px) 0 clamp(45px, 8vh, 80px);
    margin-inline: auto;
    align-self: center;
    text-align: right;
}

.tiko-native-auth-view .tiko-native-auth-form-logo {
    width: 72px;
    height: 72px;
    margin: 0 auto 24px;
    display: block;
}

.tiko-native-auth-view .tiko-native-auth-form-logo img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 50%;
    object-fit: contain;
}

.tiko-native-auth-view .tiko-native-auth-form > header {
    margin-bottom: 18px;
    text-align: center;
}

.tiko-native-auth-view .tiko-native-auth-form > header p {
    display: none;
}

.tiko-native-auth-view .tiko-native-auth-form > header h1 {
    margin: 0 0 8px;
    color: #343642;
    font-size: clamp(1.4rem, 2vw, 1.8rem);
}

.tiko-native-auth-view .tiko-native-auth-form > header span {
    color: #808390;
    font-size: 0.78rem;
    line-height: 1.8;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-stage,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-stage.has-animated-background {
    width: 100%;
    min-height: 0;
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-animated-background,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-stage.has-animated-background::after,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-heading,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-tabs,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-methods,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-image,
.tiko-native-auth-view .tiko-native-auth-content [role='tabpanel'] > h3,
.tiko-native-auth-view .tiko-native-auth-content [role='tabpanel'] > p {
    display: none;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-card,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-window,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-stage.has-animated-background > .tiko-auth-window {
    width: 100%;
    max-width: none;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-window [hidden] {
    display: none !important;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-form {
    margin-top: 12px;
    gap: 12px;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-form label:not(.tiko-check) {
    gap: 5px;
    color: #4a4d56;
    font-size: 0.75rem;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-form input:not([type='checkbox']),
.tiko-native-auth-view .tiko-native-auth-content .tiko-form select {
    min-height: 45px;
    padding: 9px 12px;
    border: 1px solid #dfe2e9;
    border-radius: 5px;
    background: #eef4ff;
    font-size: 0.8rem;
}

.tiko-native-auth-view .tiko-native-auth-content #tiko-auth-panel-login-password .tiko-check {
    display: none;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button {
    min-height: 45px;
    border-radius: 5px;
    background: #0873bd;
    font-size: 0.82rem;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button.is-secondary,
.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button.is-ghost {
    border: 1px solid #b9c7e6;
    background: #fff;
    color: #064f86;
}

.tiko-native-auth-view .tiko-native-auth-shortcuts {
    width: 100%;
    margin-top: 11px;
    display: grid;
    gap: 10px;
    text-align: center;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-inline-recovery {
    display: block;
    margin: -2px 0 1px;
    text-align: right;
    color: #11a5ef;
    font-size: 0.72rem;
}

.tiko-native-auth-view .tiko-native-auth-shortcuts .is-otp {
    min-height: 44px;
    display: grid;
    place-items: center;
    border-radius: 5px;
    background: #0873bd;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
}

@media (min-width: 768px) and (max-width: 991px) {
    .tiko-native-auth-view .tiko-native-auth-shell {
        min-height: 100vh;
        grid-template-columns: 1fr;
        direction: rtl;
    }

    .tiko-native-auth-view .tiko-native-auth-brand,
    .tiko-native-auth-view .tiko-native-auth-form {
        grid-column: 1;
    }

    .tiko-native-auth-view .tiko-native-auth-brand {
        min-height: 220px;
        padding: 38px 24px 24px;
    }

    .tiko-native-auth-view .tiko-native-auth-illustration {
        width: 128px;
        max-height: 132px;
    }

    .tiko-native-auth-view .tiko-native-auth-brand > div {
        margin-top: 8px;
    }

    .tiko-native-auth-view .tiko-native-auth-brand p {
        display: none;
    }

    .tiko-native-auth-view .tiko-native-auth-form {
        width: min(520px, calc(100% - 44px));
        padding: 34px 0 54px;
    }

    .tiko-native-auth-view .tiko-native-auth-back {
        inset-block-start: 17px;
        right: 18px;
        left: auto;
        background: rgba(255, 255, 255, 0.13);
        color: #fff;
    }
}

.tiko-native-auth-view .tiko-native-auth-shortcuts p {
    margin: 2px 0 0;
    color: #a0a3ab;
    font-size: 0.72rem;
}

.tiko-native-auth-view .tiko-native-auth-shortcuts p a,
.tiko-native-auth-view .tiko-native-auth-shortcuts p button {
    padding: 0;
    border: 0;
    background: transparent;
    color: #16a8ef;
    font: inherit;
    font-weight: 700;
}

/* Owner pages: keep the former concise tone and make the support route explicit. */
.tiko-native-contact-page,
.tiko-native-about-page,
.tiko-native-blog-index {
    background: #fff;
}

.tiko-native-about-hero,
.tiko-native-blog-hero {
    background: #f8f8fb;
}

.tiko-native-about-page .tiko-native-about-values article {
    border-radius: 7px;
    box-shadow: 0 8px 26px rgba(45, 37, 70, 0.06);
}

.tiko-native-contact-hero {
    padding: clamp(54px, 7vw, 82px) 0 clamp(42px, 6vw, 62px);
    border-bottom: 1px solid #e8edf6;
    background: #f7f9fd;
    text-align: center;
}

.tiko-native-contact-hero .tiko-container {
    max-width: 780px;
}

.tiko-contact-hero-icon {
    width: 62px;
    height: 62px;
    margin: 0 auto 18px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: #0855df;
    color: #fff;
    font-size: 31px;
    line-height: 1;
    box-shadow: 0 12px 28px rgba(8, 85, 223, 0.2);
}

.tiko-native-contact-hero .tiko-eyebrow {
    justify-content: center;
    color: #0855df;
}

.tiko-native-contact-hero h1 {
    margin: 10px 0 12px;
    color: #31364a;
    font-size: clamp(2rem, 4vw, 3rem);
}

.tiko-native-contact-hero p:not(.tiko-eyebrow) {
    max-width: 690px;
    margin: 0 auto;
    color: #6f7788;
    font-size: clamp(0.92rem, 1.5vw, 1.05rem);
    line-height: 2;
}

.tiko-native-contact-section {
    padding: clamp(40px, 6vw, 70px) 0 clamp(72px, 9vw, 110px);
}

.tiko-native-contact-grid {
    max-width: 1080px;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
    gap: 24px;
}

.tiko-native-contact-page .tiko-native-contact-content,
.tiko-native-contact-page .tiko-native-contact-info {
    border: 1px solid #dce5f2;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 16px 42px rgba(42, 64, 104, 0.08);
}

.tiko-native-contact-page .tiko-native-contact-content {
    padding: clamp(26px, 4vw, 42px);
}

.tiko-contact-card-header {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    align-items: start;
    gap: 18px;
}

.tiko-contact-card-icon {
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    color: #fff;
    flex: 0 0 auto;
}

.tiko-contact-card-icon.is-ticket {
    background: #0855df;
}

.tiko-contact-card-icon.is-email {
    background: #f05a4f;
}

.tiko-native-contact-page .tiko-contact-card-icon .dashicons {
    width: 29px;
    height: 29px;
    color: inherit;
    font-size: 29px;
}

.tiko-contact-recommended {
    min-height: 26px;
    padding: 4px 11px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #eaf2ff;
    color: #0855df;
    font-size: 0.68rem;
    font-weight: 800;
}

.tiko-contact-card-header h2,
.tiko-native-contact-info h2 {
    margin: 10px 0 7px;
    color: #31364a;
    font-size: clamp(1.3rem, 2.4vw, 1.65rem);
}

.tiko-contact-card-header p,
.tiko-native-contact-info > p {
    margin: 0;
    color: #737b8b;
    line-height: 1.9;
}

.tiko-contact-steps {
    padding: 24px 0;
    margin: 28px 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    border-block: 1px solid #e7ecf3;
    list-style: none;
}

.tiko-contact-steps li {
    min-width: 0;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
}

.tiko-contact-steps li > span {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #eff4fd;
    color: #0855df;
    font-weight: 900;
}

.tiko-contact-steps strong,
.tiko-contact-steps small {
    display: block;
}

.tiko-contact-steps strong {
    color: #3c4352;
    font-size: 0.82rem;
}

.tiko-contact-steps small {
    margin-top: 4px;
    color: #858d9b;
    font-size: 0.69rem;
    line-height: 1.65;
}

.tiko-contact-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.tiko-contact-primary-action,
.tiko-contact-secondary-action {
    min-height: 50px;
    padding: 10px 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 13px;
    font-size: 0.82rem;
    font-weight: 800;
}

.tiko-contact-primary-action {
    min-width: 174px;
    background: #0855df;
    color: #fff;
    box-shadow: 0 10px 22px rgba(8, 85, 223, 0.2);
}

.tiko-contact-secondary-action {
    border: 1px solid #d6dfed;
    background: #fff;
    color: #43506a;
}

.tiko-contact-primary-action:hover,
.tiko-contact-primary-action:focus-visible {
    background: #0648bf;
    color: #fff;
}

.tiko-contact-secondary-action:hover,
.tiko-contact-secondary-action:focus-visible {
    border-color: #0855df;
    color: #0855df;
}

.tiko-contact-note {
    margin: 22px 0 0;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #778090;
    font-size: 0.73rem;
}

.tiko-contact-note .dashicons {
    color: #d18a22;
}

.tiko-native-contact-page .tiko-native-contact-info {
    padding: clamp(26px, 4vw, 36px);
    align-self: stretch;
}

.tiko-contact-info-kicker {
    margin-top: 20px !important;
    color: #f05a4f !important;
    font-size: 0.72rem;
    font-weight: 800;
}

.tiko-native-contact-info > .tiko-contact-email-action {
    min-height: 52px;
    padding: 10px 14px;
    margin-top: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid #f4c2bd;
    border-radius: 13px;
    background: #fff8f7;
    color: #b74239;
    direction: ltr;
    font-size: 0.78rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.tiko-native-contact-info > .tiko-contact-email-action:hover,
.tiko-native-contact-info > .tiko-contact-email-action:focus-visible {
    border-color: #f05a4f;
    background: #fff1ef;
    color: #9f342d;
}

.tiko-contact-email-unavailable {
    padding: 13px 14px;
    margin-top: 24px !important;
    border: 1px solid #eadfdd;
    border-radius: 12px;
    background: #fbf8f7;
    color: #8a7471 !important;
    font-size: 0.74rem;
}

.tiko-contact-meta {
    padding-top: 18px;
    margin: 22px 0 0;
    display: grid;
    gap: 12px;
    border-top: 1px solid #e8edf3;
}

.tiko-contact-meta div {
    display: grid;
    gap: 3px;
}

.tiko-contact-meta dt {
    color: #8a92a0;
    font-size: 0.66rem;
}

.tiko-contact-meta dd {
    margin: 0;
    color: #485164;
    font-size: 0.79rem;
}

@media (max-width: 900px) {
    .tiko-native-contact-grid {
        grid-template-columns: 1fr;
    }

    .tiko-native-contact-page .tiko-native-contact-info {
        align-self: auto;
    }
}

@media (max-width: 650px) {
    .tiko-native-contact-hero {
        padding: 40px 0 34px;
    }

    .tiko-native-contact-section {
        padding: 28px 0 78px;
    }

    .tiko-native-contact-page .tiko-native-contact-content,
    .tiko-native-contact-page .tiko-native-contact-info {
        border-radius: 18px;
    }

    .tiko-contact-card-header {
        grid-template-columns: 54px minmax(0, 1fr);
        gap: 13px;
    }

    .tiko-contact-card-icon {
        width: 52px;
        height: 52px;
        border-radius: 14px;
    }

    .tiko-contact-steps {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .tiko-contact-actions,
    .tiko-contact-primary-action,
    .tiko-contact-secondary-action {
        width: 100%;
    }
}

.tiko-reference-terms-page {
    background: #f8f8fb;
}

/* The owner selected the concise legacy contact/about composition. */
.tiko-legacy-contact-page,
.tiko-legacy-about-page {
    background: #fff;
}

.tiko-legacy-contact-shell {
    max-width: 760px;
    padding-block: clamp(58px, 8vw, 96px) clamp(74px, 10vw, 130px);
    color: #34323a;
    text-align: center;
}

.tiko-legacy-contact-shell > header h1,
.tiko-legacy-about-shell > header h1 {
    margin: 0;
    color: #322f39;
    font-size: clamp(1.65rem, 3vw, 2.25rem);
    font-weight: 900;
}

.tiko-legacy-contact-shell > header > a {
    margin-top: 10px;
    display: inline-block;
    color: #2367d9;
    font-weight: 800;
}

.tiko-legacy-contact-ticket {
    padding: 34px 0 52px;
    margin-top: 26px;
    border-top: 1px solid #bfc1c7;
}

.tiko-legacy-contact-ticket h2 {
    margin: 0 0 24px;
    color: #34323a;
    font-size: 1rem;
    font-weight: 800;
}

.tiko-legacy-contact-ticket p {
    margin: 0 auto 17px;
    color: #57545d;
    font-size: 0.88rem;
    line-height: 2;
}

.tiko-legacy-contact-action {
    margin-top: 28px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    color: #66636c;
    font-size: 0.82rem;
}

.tiko-legacy-contact-action .dashicons {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #0959e7;
    color: #fff;
    font-size: 28px;
    line-height: 1;
}

.tiko-legacy-contact-email {
    padding-top: 40px;
    border-top: 1px solid #bfc1c7;
}

.tiko-legacy-contact-email > .dashicons {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    border-radius: 7px;
    background: #e95347;
    color: #fff;
    font-size: 27px;
    line-height: 1;
}

.tiko-legacy-contact-email h2 {
    margin: 0 0 7px;
    color: #514e57;
    font-size: 0.95rem;
}

.tiko-legacy-contact-email a {
    color: #2367d9;
    direction: ltr;
    font-size: 0.86rem;
}

.tiko-legacy-about-shell {
    max-width: 860px;
    min-height: 520px;
    padding-block: clamp(68px, 9vw, 108px) clamp(80px, 10vw, 130px);
}

.tiko-legacy-about-shell > header {
    padding-bottom: 28px;
    margin-bottom: 28px;
    border-bottom: 1px solid #d6d7dc;
    text-align: center;
}

.tiko-legacy-about-shell .tiko-prose {
    color: #4e4b53;
    line-height: 2.15;
}

@media (max-width: 650px) {
    .tiko-legacy-contact-shell,
    .tiko-legacy-about-shell {
        width: min(100% - 34px, 760px);
    }

    .tiko-legacy-contact-ticket {
        padding-bottom: 42px;
    }
}

.tiko-reference-terms-page > header {
    padding: clamp(56px, 8vw, 88px) 0 28px;
    text-align: center;
}

.tiko-reference-terms-page > header h1 {
    margin: 0;
    color: #4c3e77;
}

.tiko-reference-terms-page > section {
    padding: 0 0 clamp(64px, 9vw, 105px);
}

.tiko-reference-terms-page .tiko-content-shell {
    padding: clamp(24px, 4vw, 42px);
    border: 1px solid #e5e3eb;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(45, 37, 70, 0.07);
}

.tiko-reference-terms-list {
    padding: 0;
    margin: 24px 0 0;
    display: grid;
    gap: 15px;
    list-style: none;
}

.tiko-reference-terms-list li {
    position: relative;
    padding-inline-start: 30px;
    color: #5f5b67;
    line-height: 2;
}

.tiko-reference-terms-list li > .dashicons {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 7px;
    color: #35a56f;
    font-size: 18px;
}

@media (max-width: 1180px) {
    .tiko-reference-instagram-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .tiko-reference-instagram-hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(250px, 0.65fr);
    }

    .tiko-reference-instagram-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .tiko-kando-services-page .tiko-native-services-tools {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .tiko-reference-instagram-hero {
        min-height: 300px;
        padding: 27px 0 20px;
    }

    .tiko-reference-instagram-hero-grid {
        min-height: 0;
        grid-template-columns: 1fr;
        gap: 5px;
        text-align: center;
    }

    .tiko-reference-instagram-hero-copy > span {
        min-height: 32px;
        padding: 6px 13px;
        font-size: 0.68rem;
    }

    .tiko-reference-instagram-hero-copy h1 {
        margin: 9px 0 2px;
        font-size: clamp(1.55rem, 7.1vw, 1.85rem);
    }

    .tiko-reference-instagram-hero-copy p {
        margin: 2px auto;
        font-size: 0.73rem;
        line-height: 1.7;
    }

    .tiko-reference-instagram-hero-copy p strong {
        font-size: 1rem;
    }

    .tiko-reference-instagram-hero-copy p {
        margin-inline: auto;
    }

    .tiko-reference-instagram-hero figure {
        width: 52px;
        margin-top: 2px;
    }

    .tiko-reference-instagram-discount {
        position: static;
        width: fit-content;
        margin-inline: auto;
        min-height: 33px;
        padding: 6px 14px;
        border-radius: 999px;
        font-size: 0.68rem;
        transform: none;
    }

    [dir='rtl'] .tiko-reference-instagram-discount {
        transform: none;
    }

    .tiko-reference-instagram-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .tiko-reference-instagram-service > header {
        margin: 0 5px 20px;
        align-items: center;
        gap: 10px;
    }

    .tiko-reference-instagram-service > header h3 {
        font-size: 0.94rem;
        line-height: 1.8;
    }

    .tiko-reference-instagram-service > header h3 small {
        font-size: 0.77rem;
    }

    .tiko-reference-instagram-service > header p {
        margin-top: 1px;
        font-size: 0.67rem;
    }

    .tiko-reference-instagram-packages {
        padding-top: 54px;
    }

    .tiko-reference-instagram-service {
        margin-bottom: 67px;
    }

    .tiko-reference-package-card {
        width: min(330px, calc(100% - 22px));
        margin-inline: auto;
        border-radius: 19px;
        box-shadow: 0 2px 16px rgba(52, 64, 96, 0.18);
    }

    .tiko-reference-package-top {
        height: 110px;
    }

    .tiko-reference-package-top > span {
        inset-block-start: -32px;
        height: 127px;
    }

    .tiko-reference-package-top img {
        width: 31px;
        height: 30px;
        inset-block-start: 43px;
        inset-inline-end: 22px;
    }

    .tiko-reference-package-top > div {
        inset-block-start: 19px;
    }

    .tiko-reference-package-top strong {
        font-size: 2rem;
    }

    .tiko-reference-package-top small {
        margin-top: 8px;
        font-size: 0.78rem;
    }

    .tiko-reference-package-body {
        min-height: 294px;
        padding: 30px 20px 15px;
    }

    .tiko-reference-package-features {
        gap: 8px;
        font-size: 0.81rem;
    }

    .tiko-reference-package-price {
        font-size: 1.4rem;
    }

    .tiko-reference-package-order {
        min-height: 43px;
        font-size: 0.84rem;
    }

    .tiko-kando-services-stage {
        padding: 36px 0 64px;
    }

    .tiko-kando-services-shell {
        padding: 14px;
        border-radius: 0;
    }

    .tiko-kando-services-page .tiko-native-services-tools {
        grid-template-columns: 1fr;
    }

    .tiko-kando-services-page .tiko-native-services-table td,
    .tiko-kando-services-page .tiko-native-services-table td:nth-child(2) {
        width: 100%;
        text-align: start;
    }

    .tiko-kando-service-description > div {
        position: static;
        width: 100%;
        margin-top: 7px;
    }

    .tiko-native-auth-view .tiko-native-auth-shell {
        min-height: 100vh;
        grid-template-columns: 1fr;
        direction: rtl;
    }

    .tiko-native-auth-view .tiko-native-auth-brand,
    .tiko-native-auth-view .tiko-native-auth-form {
        grid-column: 1;
    }

    .tiko-native-auth-view .tiko-native-auth-brand {
        min-height: 210px;
        padding: 42px 24px 22px;
    }

    .tiko-native-auth-view .tiko-native-auth-illustration {
        width: 118px;
        max-height: 120px;
    }

    .tiko-native-auth-view .tiko-native-auth-brand > div {
        margin-top: 8px;
    }

    .tiko-native-auth-view .tiko-native-auth-brand h2 {
        font-size: 1.45rem;
    }

    .tiko-native-auth-view .tiko-native-auth-brand p {
        display: none;
    }

    .tiko-native-auth-view .tiko-native-auth-form {
        width: min(460px, calc(100% - 38px));
        padding: 38px 0 55px;
    }

    .tiko-native-auth-view .tiko-native-auth-form-logo {
        width: 64px;
        height: 64px;
        margin-bottom: 18px;
    }

    .tiko-native-auth-view .tiko-native-auth-back {
        inset-block-start: 17px;
        right: 18px;
        left: auto;
        background: rgba(255, 255, 255, 0.13);
        color: #fff;
    }
}

@media (max-width: 520px) {
    .tiko-reference-instagram-service > header img {
        width: 42px;
        height: 41px;
    }
}

@media (max-width: 767px) {
    body.tiko-has-public-mobile-bar {
        padding-bottom: calc(82px + env(safe-area-inset-bottom));
    }

    .tiko-kando-chat-fab {
        z-index: 999;
        inset-block-end: calc(70px + env(safe-area-inset-bottom));
    }
}
/* Hostinger's assistant is not part of either reference storefront and can
 * cover primary controls on public pages. Keep the host plugin installed but
 * remove only its floating presentation inside the Tikopanel theme. */
body .kodee-fab {
    display: none !important;
}

/* Premium contact page selected by the site owner. */
.tiko-contact-premium-page {
    min-height: 720px;
    background: #fff;
}

.tiko-contact-premium-stage {
    background-color: #fff;
    background-image: url('../images/contact-support-background.png');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto;
}

.tiko-contact-premium-page .tiko-contact-premium-hero {
    padding: clamp(62px, 6vw, 90px) 0 6px;
    border: 0;
    background: transparent;
}

.tiko-contact-premium-page .tiko-contact-premium-hero .tiko-container {
    max-width: 850px;
}

.tiko-contact-premium-page .tiko-contact-premium-hero h1 {
    margin: 0 0 16px;
    color: #111426;
    font-size: clamp(2rem, 3.4vw, 2.65rem);
    font-weight: 950;
    line-height: 1.35;
}

.tiko-contact-premium-page .tiko-contact-premium-hero p {
    max-width: 700px;
    margin: 0 auto;
    color: #687188;
    font-size: clamp(0.95rem, 1.35vw, 1.08rem);
    line-height: 2;
}

.tiko-contact-premium-page .tiko-contact-premium-section {
    padding: 33px 0 clamp(68px, 8vw, 96px);
}

.tiko-contact-premium-page .tiko-contact-premium-section > .tiko-container {
    width: min(1342px, calc(100% - 40px));
    max-width: none;
}

.tiko-contact-premium-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.9726fr) minmax(300px, 1fr);
    align-items: stretch;
    gap: 40px;
}

.tiko-contact-premium-page .tiko-contact-featured,
.tiko-contact-premium-page .tiko-contact-email-panel {
    min-height: 522px;
    border-radius: 24px;
}

.tiko-contact-premium-page .tiko-contact-featured {
    position: relative;
    padding: clamp(30px, 4vw, 44px);
    overflow: hidden;
    border-color: #0450c9;
    background: #0450c9;
    color: #fff;
    box-shadow: 0 22px 52px rgba(5, 68, 184, 0.22);
}

.tiko-contact-featured-head {
    position: relative;
    min-height: 128px;
    padding-inline-start: 124px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 18px;
}

.tiko-contact-featured-head > div {
    padding-top: 20px;
}

.tiko-contact-featured-head .tiko-contact-card-icon {
    position: absolute;
    inset-block-start: 18px;
    inset-inline-start: 0;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-card-icon.is-ticket {
    width: 104px;
    height: 104px;
    border-radius: 50%;
    background: #1f6ff0;
    box-shadow: 0 12px 26px rgba(0, 38, 114, 0.2);
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-card-icon.is-ticket .dashicons {
    width: 48px;
    height: 48px;
    font-size: 48px;
}

.tiko-contact-premium-page .tiko-contact-featured-head h2 {
    margin: 5px 0 7px;
    color: #fff;
    font-size: clamp(1.55rem, 2.3vw, 2rem);
    font-weight: 900;
}

.tiko-contact-premium-page .tiko-contact-featured-head p {
    margin: 0;
    color: #dceaff;
    font-size: 0.9rem;
    line-height: 1.8;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-recommended {
    min-height: 43px;
    padding: 8px 15px;
    align-self: start;
    gap: 6px;
    border-radius: 10px;
    background: #fff;
    color: #0756d9;
    font-size: 0.82rem;
}

.tiko-contact-premium-page .tiko-contact-recommended .dashicons {
    width: 17px;
    height: 17px;
    font-size: 17px;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-steps {
    padding: 24px 0 20px;
    margin: 12px 0 20px;
    gap: 26px;
    border: 0;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-steps li {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 11px;
    text-align: center;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-steps li > span {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #073b9b;
    color: #fff;
    font-size: 0.94rem;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-steps strong {
    color: #fff;
    font-size: 0.93rem;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-steps small {
    max-width: 190px;
    margin: 8px auto 0;
    color: #d7e7ff;
    font-size: 0.74rem;
    line-height: 1.85;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-actions {
    justify-content: center;
    margin-top: 43px;
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-primary-action {
    width: min(100%, 464px);
    min-height: 78px;
    border: 1px solid rgba(255, 255, 255, 0.92);
    border-radius: 14px;
    background: #fff;
    color: #0756d9;
    font-size: 1.15rem;
    box-shadow: 0 13px 26px rgba(0, 36, 112, 0.2);
}

.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-primary-action:hover,
.tiko-contact-premium-page .tiko-contact-featured .tiko-contact-primary-action:focus-visible {
    background: #eef5ff;
    color: #0648b8;
}

.tiko-contact-premium-page .tiko-contact-email-panel {
    padding: clamp(30px, 4vw, 46px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.tiko-contact-premium-page .tiko-contact-email-panel .tiko-contact-card-icon.is-email {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background: #fff0ed;
    color: #ef624f;
}

.tiko-contact-premium-page .tiko-contact-email-panel .tiko-contact-card-icon.is-email .dashicons {
    width: 46px;
    height: 46px;
    font-size: 46px;
}

.tiko-contact-premium-page .tiko-contact-email-panel h2 {
    margin: 32px 0 12px;
    color: #31364a;
    font-size: clamp(1.35rem, 2vw, 1.65rem);
    font-weight: 900;
}

.tiko-contact-premium-page .tiko-contact-email-panel > p {
    max-width: 290px;
    margin: 0;
    color: #6f7788;
    font-size: 0.9rem;
    line-height: 2;
}

.tiko-contact-email-address {
    margin-top: 22px;
    color: #ef624f;
    direction: ltr;
    unicode-bidi: isolate;
    font-size: 1.08rem;
    font-weight: 800;
}

.tiko-contact-email-address:hover,
.tiko-contact-email-address:focus-visible {
    color: #c94436;
}

.tiko-contact-email-button {
    width: min(100%, 238px);
    min-height: 78px;
    padding: 10px 18px;
    margin-top: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #ef624f;
    border-radius: 13px;
    background: #fff;
    color: #ef624f;
    font-size: 0.9rem;
    font-weight: 800;
}

.tiko-contact-email-button:hover,
.tiko-contact-email-button:focus-visible {
    background: #fff3f1;
    color: #c94436;
}

.tiko-contact-premium-page .tiko-contact-wide-note {
    min-height: 88px;
    padding: 18px 24px;
    margin: 40px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border-radius: 20px;
    background: #eef5ff;
    color: #2365c9;
    text-align: center;
    font-size: 0.92rem;
    line-height: 1.8;
}

.tiko-contact-premium-page .tiko-contact-wide-note .dashicons {
    color: #8bb7fb;
}

@media (max-width: 900px) {
    .tiko-contact-premium-grid {
        grid-template-columns: 1fr;
    }

    .tiko-contact-premium-page .tiko-contact-featured,
    .tiko-contact-premium-page .tiko-contact-email-panel {
        min-height: 0;
    }
}

@media (max-width: 650px) {
    .tiko-contact-premium-page .tiko-contact-premium-hero {
        padding: 42px 0 22px;
    }

    .tiko-contact-premium-page .tiko-contact-premium-section {
        padding-top: 12px;
    }

    .tiko-contact-premium-grid {
        gap: 18px;
    }

    .tiko-contact-premium-page .tiko-contact-featured,
    .tiko-contact-premium-page .tiko-contact-email-panel {
        border-radius: 19px;
    }

    .tiko-contact-featured-head {
        min-height: 64px;
        padding-inline-start: 68px;
        grid-template-columns: 1fr;
    }

    .tiko-contact-featured-head > div {
        padding-top: 0;
    }

    .tiko-contact-premium-page .tiko-contact-featured .tiko-contact-card-icon.is-ticket {
        width: 56px;
        height: 56px;
        inset-block-start: 0;
    }

    .tiko-contact-premium-page .tiko-contact-featured .tiko-contact-card-icon.is-ticket .dashicons {
        width: 29px;
        height: 29px;
        font-size: 29px;
    }

    .tiko-contact-premium-page .tiko-contact-featured .tiko-contact-recommended {
        width: max-content;
        margin-top: 6px;
    }

    .tiko-contact-premium-page .tiko-contact-featured .tiko-contact-steps {
        padding-top: 22px;
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .tiko-contact-premium-page .tiko-contact-featured .tiko-contact-actions {
        margin-top: 0;
    }

    .tiko-contact-premium-page .tiko-contact-featured .tiko-contact-steps li {
        grid-template-columns: 38px minmax(0, 1fr);
        justify-items: start;
        text-align: right;
    }

    .tiko-contact-premium-page .tiko-contact-featured .tiko-contact-steps small {
        max-width: none;
        margin-inline: 0;
    }

    .tiko-contact-premium-page .tiko-contact-wide-note {
        min-height: 64px;
        padding: 14px 18px;
        margin-top: 18px;
        border-radius: 16px;
    }
}

/* =============================================================================
   Sign-in, registration and one-time-code screens — visual refresh.
   Every rule is anchored on `.tiko-native-auth-view`, a body class the theme
   adds only on the auth pages, so nothing here can reach the rest of the site.
   The brand panel, illustration and logo are left exactly as they were.
   ============================================================================= */

.tiko-native-auth-view {
    --ta-ink: #232634;
    --ta-body: #4a4d56;
    --ta-muted: #858995;
    --ta-line: #dde3ee;
    --ta-blue: #0873bd;
    --ta-blue-dark: #064f86;
    --ta-blue-soft: #f4f9ff;
}

/* ---------- heading ---------- */
.tiko-native-auth-view .tiko-native-auth-form > header {
    margin-bottom: 26px;
}

.tiko-native-auth-view .tiko-native-auth-form > header h1 {
    margin: 0 0 9px;
    color: var(--ta-ink);
    font-size: clamp(1.5rem, 2.2vw, 1.72rem);
    font-weight: 800;
    line-height: 1.4;
}

.tiko-native-auth-view .tiko-native-auth-form > header span {
    color: var(--ta-muted);
    font-size: 0.85rem;
    line-height: 1.85;
}

.tiko-native-auth-view .tiko-native-auth-form-logo {
    margin-bottom: 26px;
}

/* ---------- the notice band: the message now has a place to stay ---------- */
.tiko-native-auth-view .tiko-native-auth-content .tiko-app-notice {
    margin: 0 0 20px;
    padding: 13px 15px;
    display: block;
    border: 0;
    border-radius: 11px;
    background: #eef1f6;
    color: #4a5468;
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.85;
    text-align: right;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-notice.is-success {
    background: #e9f7ef;
    color: #17724b;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-notice.is-error {
    background: #fdebec;
    color: #a4333f;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-notice.is-info {
    background: #eaf3fd;
    color: #0a5f9e;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-notice.is-warning {
    background: #fff4e2;
    color: #8a5a12;
}

/* ---------- fields ---------- */
.tiko-native-auth-view .tiko-native-auth-content .tiko-form label:not(.tiko-check) {
    gap: 8px;
    margin-bottom: 17px;
    color: var(--ta-body);
    font-size: 0.83rem;
    font-weight: 700;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-form input:not([type='checkbox']),
.tiko-native-auth-view .tiko-native-auth-content .tiko-form select,
.tiko-native-auth-view .tiko-native-auth-content .tiko-form textarea {
    min-height: 50px;
    padding: 11px 15px;
    border: 1px solid var(--ta-line);
    border-radius: 10px;
    background: #fff;
    color: var(--ta-ink);
    font-size: 0.9rem;
    font-weight: 500;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-form input:not([type='checkbox'])::placeholder {
    color: #a9aebb;
    font-weight: 400;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-form input:not([type='checkbox']):focus,
.tiko-native-auth-view .tiko-native-auth-content .tiko-form select:focus,
.tiko-native-auth-view .tiko-native-auth-content .tiko-form textarea:focus {
    border-color: var(--ta-blue);
    box-shadow: 0 0 0 3px rgba(8, 115, 189, .14);
    outline: none;
}

/* the reveal control sits on the far side so it never covers the password */
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-password-field {
    position: relative;
    display: block;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-password-field input {
    width: 100%;
    padding-inline-end: 84px;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-password-field button {
    position: absolute;
    inset-inline-end: 7px;
    inset-block-start: 50%;
    min-height: 34px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #e4e9f2;
    border-radius: 8px;
    background: #f6f8fc;
    color: #5b6272;
    font: inherit;
    font-size: 0.78rem;
    font-weight: 700;
    transform: translateY(-50%);
    cursor: pointer;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-password-field button:hover,
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-password-field button:focus-visible {
    border-color: #c9d8ee;
    background: var(--ta-blue-soft);
    color: var(--ta-blue-dark);
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-check {
    gap: 10px;
    margin: 4px 0 20px;
    color: var(--ta-body);
    font-size: 0.83rem;
    font-weight: 600;
}

/* ---------- one primary action, everything else steps back ---------- */
.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button {
    min-height: 50px;
    border-radius: 10px;
    background: var(--ta-blue);
    font-size: 0.92rem;
    font-weight: 700;
    box-shadow: 0 8px 20px -10px rgba(8, 115, 189, .7);
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button:hover,
.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button:focus-visible {
    background: var(--ta-blue-dark);
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button.is-secondary,
.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button.is-ghost {
    border: 1px solid #c9d8ee;
    background: #fff;
    color: var(--ta-blue-dark);
    box-shadow: none;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button.is-secondary:hover,
.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button.is-ghost:hover,
.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button.is-secondary:focus-visible,
.tiko-native-auth-view .tiko-native-auth-content .tiko-app-button.is-ghost:focus-visible {
    border-color: var(--ta-blue);
    background: var(--ta-blue-soft);
    color: var(--ta-blue-dark);
}

/* the one-time-code shortcut was a second solid blue button competing with the
   real primary action; it is an outlined choice now */
.tiko-native-auth-view .tiko-native-auth-shortcuts {
    margin-top: 16px;
    gap: 12px;
}

.tiko-native-auth-view .tiko-native-auth-shortcuts .is-otp {
    min-height: 50px;
    border: 1px solid #c9d8ee;
    border-radius: 10px;
    background: #fff;
    color: var(--ta-blue-dark);
    font-size: 0.9rem;
    font-weight: 700;
}

.tiko-native-auth-view .tiko-native-auth-shortcuts .is-otp:hover,
.tiko-native-auth-view .tiko-native-auth-shortcuts .is-otp:focus-visible {
    border-color: var(--ta-blue);
    background: var(--ta-blue-soft);
    color: var(--ta-blue-dark);
}

.tiko-native-auth-view .tiko-native-auth-shortcuts p {
    margin: 6px 0 0;
    color: var(--ta-muted);
    font-size: 0.88rem;
    font-weight: 500;
    line-height: 2;
}

/* On the one-time-code screen this action is a <button> that posts the cancel
   form, so it inherits the global 46px tap-target height and sits off the line
   next to the sentence around it. Flatten it back to inline text. */
.tiko-native-auth-view .tiko-native-auth-shortcuts p a,
.tiko-native-auth-view .tiko-native-auth-shortcuts p button {
    min-height: 0;
    height: auto;
    padding: 0;
    display: inline;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: var(--ta-blue);
    font: inherit;
    font-weight: 800;
    line-height: inherit;
    vertical-align: baseline;
    cursor: pointer;
}

.tiko-native-auth-view .tiko-native-auth-shortcuts p a:hover,
.tiko-native-auth-view .tiko-native-auth-shortcuts p button:hover,
.tiko-native-auth-view .tiko-native-auth-shortcuts p a:focus-visible,
.tiko-native-auth-view .tiko-native-auth-shortcuts p button:focus-visible {
    color: var(--ta-blue-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.tiko-native-auth-view .tiko-native-auth-back {
    min-height: 40px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    border-radius: 10px;
    background: #f4f6fa;
    color: #5b6272;
    font-size: 0.83rem;
    font-weight: 700;
}

.tiko-native-auth-view .tiko-native-auth-back:hover,
.tiko-native-auth-view .tiko-native-auth-back:focus-visible {
    background: #e9edf5;
    color: var(--ta-blue-dark);
}

/* ---------- one-time code ---------- */
.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-target {
    margin: 0 0 12px;
    color: var(--ta-body);
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.85;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-target strong {
    color: var(--ta-ink);
    font-weight: 800;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-countdown {
    margin: 0 0 20px;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid #e6eaf2;
    border-radius: 12px;
    background: #fbfcfe;
    color: #5b6272;
    font-size: 0.83rem;
    font-weight: 600;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-countdown b {
    min-width: 66px;
    height: 30px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #eaf3fd;
    color: #0a5f9e;
    font-size: 0.92rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-countdown.is-expired b {
    background: #fdebec;
    color: #a4333f;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-code {
    padding: 0;
    margin: 0 0 18px;
    border: 0;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-code legend {
    padding: 0;
    margin-bottom: 10px;
    color: var(--ta-body);
    font-size: 0.83rem;
    font-weight: 700;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-digits {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-digits input {
    width: 56px;
    min-width: 0;
    height: 62px;
    min-height: 62px;
    padding: 0;
    border: 1px solid var(--ta-line);
    border-radius: 12px;
    background: #fff;
    color: var(--ta-ink);
    font-size: 1.4rem;
    font-weight: 800;
    text-align: center;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-digits input:focus {
    border-color: var(--ta-blue);
    box-shadow: 0 0 0 3px rgba(8, 115, 189, .14);
    outline: none;
}

.tiko-native-auth-view .tiko-native-auth-content .tiko-auth-resend-form {
    margin-top: 12px;
    display: grid;
    gap: 10px;
}

@media (max-width: 620px) {
    .tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-digits {
        gap: 8px;
    }

    .tiko-native-auth-view .tiko-native-auth-content .tiko-auth-otp-digits input {
        width: 100%;
        height: 56px;
        min-height: 56px;
        font-size: 1.25rem;
    }
}