/* Shared SMS Services shell. Based on the current Receipts hero/nav; isolated from its catalog. */
.labels-service-hero-shell { max-width:1300px; margin:0 auto; padding:40px 24px 32px; }
.labels-service-hero { text-align:center; margin-bottom:0; }
.labels-service-title { font-size:42px; font-weight:900; margin-bottom:15px; display:flex; align-items:center; justify-content:center; gap:15px; color:var(--bp-text); }
.labels-service-icon { display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; background:linear-gradient(135deg, var(--bp-accent) 0%, #2d7cd6 100%); border-radius:var(--bp-radius); box-shadow:var(--bp-shadow-accent); }
.labels-service-icon svg { width:32px; height:32px; color:#fff; }
.labels-service-subtitle { color:var(--bp-text-secondary); font-size:18px; max-width:600px; margin:0 auto; line-height:1.6; }

/* Primary mode links use the Receipts underline and icon treatment. */
.labels-service-tabs {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:34px;
    width:auto;
    margin-top:30px;
    padding:0;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
}
.labels-service-tab {
    position:relative;
    min-width:0;
    min-height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:0 2px 10px;
    border:0;
    border-radius:0;
    color:#777d84;
    font-size:0.9rem;
    line-height:1;
    font-weight:800;
    text-decoration:none;
    transition:color var(--bp-transition), transform var(--bp-transition);
}
.labels-service-tab::after {
    content:'';
    position:absolute;
    left:50%;
    bottom:0;
    width:0;
    height:2px;
    border-radius:999px;
    background:var(--bp-accent);
    transform:translateX(-50%);
    transition:width var(--bp-transition), opacity var(--bp-transition);
    opacity:0;
}
.labels-service-tab:hover {
    color:#dfe3e8;
    transform:translateY(-1px);
}
.labels-service-tab.active {
    color:#fff;
}
.labels-service-tab.active::after {
    width:100%;
    opacity:1;
}
.labels-service-tab-icon {
    width:18px;
    height:18px;
    flex:0 0 18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#6f757d;
    transition:color var(--bp-transition),transform var(--bp-transition);
}
.labels-service-tab-icon svg {
    width:18px;
    height:18px;
    display:block;
}
.labels-service-tab.active .labels-service-tab-icon,
.labels-service-tab:hover .labels-service-tab-icon {
    color:var(--bp-accent);
}
.labels-service-tab-label {
    white-space:nowrap;
}

.labels-service-tab:focus-visible { outline:2px solid var(--bp-accent); outline-offset:6px; border-radius:3px; }
@media (min-width:901px) {
    .labels-service-tabs { gap:40px; margin-top:30px; }
    .labels-service-tab { min-height:44px; font-size:.92rem; letter-spacing:.01em; }
}
@media (max-width:900px) {
    .labels-service-title { font-size:32px; }
    .labels-service-subtitle { font-size:16px; }
}
@media (max-width:600px) {
    .labels-service-hero-shell { padding:24px 16px; }
    .labels-service-title { font-size:26px; gap:10px; }
    .labels-service-icon { width:44px; height:44px; }
    .labels-service-icon svg { width:24px; height:24px; }
    .labels-service-subtitle { font-size:14px; }
    .labels-service-tabs { margin-top:22px; gap:24px; }
    .labels-service-tab { min-height:44px; padding-bottom:9px; gap:7px; font-size:.82rem; }
    .labels-service-tab-icon, .labels-service-tab-icon svg { width:17px; height:17px; flex-basis:17px; }
}


/* Preserve each existing workspace width and horizontal spacing. */
[data-theme="light"] .labels-service-tab.active,
[data-theme="light"] .labels-service-tab:hover { color:var(--bp-text); }
.labels-service-workspace { padding-top:0; }
.labels-service-workspace .labels-service-section { margin-bottom:28px; }
.labels-service-workspace.lbl-container .lbl-filters { margin-top:0; }

/* Receipts modes belong to its content. Compact segments distinguish them from the service tabs. */
.labels-service-workspace .rcp-section-switch { margin-top:0; padding:4px; gap:4px; border:1px solid var(--bp-border); border-radius:var(--bp-radius-sm,8px); background:var(--bp-surface); }
.labels-service-workspace .rcp-section-switch__item { min-height:36px; padding:8px 12px; border-radius:6px; font-size:.82rem; }
.labels-service-workspace .rcp-section-switch__item::after { display:none; }
.labels-service-workspace .rcp-section-switch__item.active { background:var(--bp-accent-dim); color:var(--bp-text); }
.labels-service-workspace .rcp-section-switch__item:hover { transform:none; }
.labels-service-workspace .rcp-section-switch__item:focus-visible { outline:2px solid var(--bp-accent); outline-offset:2px; }
.labels-service-workspace.receipt-create-hero-shell .receipt-create-hero { margin-bottom:0; }
@media (max-width:600px) {
    .labels-service-hero-shell { padding-bottom:28px; }
    .labels-service-tabs { display:flex; max-width:100%; justify-content:flex-start; gap:24px; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; scroll-padding-inline:2px; }
    .labels-service-tab { flex-shrink:0; }
    .labels-service-workspace { padding-top:0; }
    .labels-service-workspace .labels-service-section { margin-bottom:24px; }
    .labels-service-workspace .rcp-section-switch__item { min-height:44px; padding:8px 10px; }
}
@media (prefers-reduced-motion:reduce) {
    .labels-service-tab, .labels-service-tab::after, .labels-service-tab-icon { transition:none; }
    .labels-service-tab:hover { transform:none; }
}