/* Component defaults for the operator application. Family styles own layout only.
   Native controls below are the documented SSR selection/upload exceptions. */
:is(.cc-shell, .cc-auth-shell) { --mud-default-borderradius: 10px; }
.cc-auth-shell { --cc-accent-strong: color-mix(in srgb, var(--mud-palette-primary) 85%, var(--mud-palette-text-primary)); }
:is(.cc-shell, .cc-auth-shell) .mud-typography:is(h1,h2,h3,h4,h5,h6) {
    font-family: var(--mud-typography-default-family);
    letter-spacing: normal;
    color: var(--mud-palette-text-primary);
}
:is(.cc-shell, .cc-auth-shell) h1.mud-typography { font-size: var(--mud-typography-h1-size); font-weight: 700; line-height: 1.4; }
:is(.cc-shell, .cc-auth-shell) h2.mud-typography { font-size: var(--mud-typography-h2-size); font-weight: 700; line-height: 1.5; }
:is(.cc-shell, .cc-auth-shell) h3.mud-typography { font-size: var(--mud-typography-h3-size); font-weight: 700; line-height: 1.5; }

/* Override legacy button classes with MudBlazor's semantic variants. */
:is(.cc-shell, .cc-auth-shell) .mud-button-root.mud-button {
    min-height: 44px; min-width: 64px; padding: 8px 16px; border-radius: var(--mud-default-borderradius);
    font-size: var(--mud-typography-button-size); font-weight: 600; line-height: 1.75;
    font-family: var(--mud-typography-button-family); text-transform: none;
    background: transparent; color: var(--mud-palette-text-primary);
    border: 1px solid var(--mud-palette-divider); box-shadow: none;
}
:is(.cc-shell, .cc-auth-shell) .mud-button .mud-button-label { gap: 6px; }
/* MudLink's utility color is !important; current navigation uses the accent surface. */
.cc-shell :is(.cc-crm-nav,.cc-mail-nav,.cc-system__nav) a.mud-link[aria-current=page] {
    color: var(--cc-accent-ink) !important;
}
:is(.cc-shell, .cc-auth-shell) .mud-button-root.mud-button:hover { background: var(--mud-palette-action-default-hover, rgb(86 105 114 / 8%)); }
:is(.cc-shell, .cc-auth-shell) .mud-button-root.mud-button-filled-primary {
    background: var(--mud-palette-primary); color: var(--mud-palette-primary-text); border-color: var(--mud-palette-primary);
}
:is(.cc-shell, .cc-auth-shell) .mud-button-root.mud-button-filled-primary:hover { background: var(--cc-accent-strong, var(--mud-palette-primary-darken)); }
:is(.cc-shell, .cc-auth-shell) .mud-button-root.mud-button-outlined-error { color: var(--mud-palette-error); border-color: var(--mud-palette-error); background: transparent; }
:is(.cc-shell, .cc-auth-shell) .mud-button-root.mud-button-outlined-error:hover { background: var(--mud-palette-error-hover); }
:is(.cc-shell, .cc-auth-shell) .mud-button-root.mud-button:disabled { opacity: .55; box-shadow: none; cursor: not-allowed; }
:is(.cc-shell, .cc-auth-shell) .mud-button-root.cc-icon-button { min-width: 44px; width: 44px; padding: 8px; }

/* Native labels continue to label the real input, not a hidden duplicate. */
:is(.cc-shell, .cc-auth-shell) .cc-text-field,
:is(.cc-shell, .cc-auth-shell) .cc-select-field { margin: 0; min-width: 0; width: 100%; }
:is(.cc-shell, .cc-auth-shell) .cc-text-field .mud-input { margin: 0; background: var(--mud-palette-surface); border-radius: var(--mud-default-borderradius); }
:is(.cc-shell, .cc-auth-shell) .cc-text-field .mud-input > .mud-input-root {
    box-sizing: border-box; min-width: 0; min-height: 44px; padding: 10px 12px; border: 0; border-radius: inherit;
    background: transparent; color: var(--mud-palette-text-primary); box-shadow: none;
    font: inherit; font-weight: 400; outline: none;
}
:is(.cc-shell, .cc-auth-shell) .cc-text-field .mud-input-outlined-border { border-color: var(--mud-palette-lines-inputs); }
:is(.cc-shell, .cc-auth-shell) .cc-text-field .mud-input:focus-within .mud-input-outlined-border { border-color: var(--mud-palette-primary); border-width: 2px; }
:is(.cc-shell, .cc-auth-shell) .cc-text-field .mud-input-root:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 2px; }
:is(.cc-shell, .cc-auth-shell) .cc-ssr-select {
    box-sizing: border-box; display: block; width: 100%; min-width: 0; min-height: 44px;
    padding: 10px 12px; border: 1px solid var(--mud-palette-lines-inputs); border-radius: var(--mud-default-borderradius);
    background: var(--mud-palette-surface); color: var(--mud-palette-text-primary); font: inherit; font-weight: 400;
}
:is(.cc-shell, .cc-auth-shell) .cc-ssr-select[multiple] { min-height: 112px; }
:is(.cc-shell, .cc-auth-shell) .cc-ssr-select:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 2px; }
:is(.cc-shell, .cc-auth-shell) .cc-native-choice { display: inline-flex; flex: 0 0 auto; margin: 0; width: auto; }
:is(.cc-shell, .cc-auth-shell) .cc-native-choice input:is([type=checkbox],[type=radio]) { width: 20px; height: 20px; min-height: 20px; accent-color: var(--mud-palette-primary); }
:is(.cc-shell, .cc-auth-shell) .cc-native-choice:has(input[type=file]) { display: block; width: 100%; }
:is(.cc-shell, .cc-auth-shell) .cc-native-choice input[type=file] { width: 100%; min-width: 0; }

/* Tables keep a real table and their captions; every family shares spacing and surfaces. */
:is(.cc-shell, .cc-auth-shell) .mud-simple-table { width: 100%; min-width: 0; max-width: 100%; border-radius: var(--mud-default-borderradius); background: var(--mud-palette-surface); }
:is(.cc-shell, .cc-auth-shell) .mud-simple-table table { width: 100%; border-collapse: collapse; background: var(--mud-palette-surface); }
:is(.cc-shell, .cc-auth-shell) .mud-simple-table table :is(th,td) { padding: 12px 16px; text-align: start; border-bottom: 1px solid var(--mud-palette-divider); color: var(--mud-palette-text-primary); font-size: .875rem; line-height: 1.8; }
:is(.cc-shell, .cc-auth-shell) .mud-simple-table table th { background: var(--mud-palette-background-grey); color: var(--mud-palette-text-secondary); font-weight: 600; }
:is(.cc-shell, .cc-auth-shell) .mud-simple-table table tbody tr:hover { background: var(--mud-palette-table-hover); }
:is(.cc-shell, .cc-auth-shell) .mud-paper.mud-paper-outlined { border-color: var(--mud-palette-divider); border-radius: 14px; background: var(--mud-palette-surface); box-shadow: none; }
:is(.cc-shell, .cc-auth-shell) .mud-chip { min-height: 28px; border-radius: 6px; font: 600 .75rem/1.6 var(--mud-typography-default-family); }
:is(.cc-shell, .cc-auth-shell) .mud-alert { margin-block: 12px; border-radius: var(--mud-default-borderradius); }

@media (max-width: 600px) {
    :is(.cc-shell, .cc-auth-shell) .mud-simple-table table :is(th,td) { padding: 10px 12px; }
    :is(.cc-shell, .cc-auth-shell) .mud-button-root.mud-button { max-width: 100%; white-space: normal; }
}

/* All editor families use bounded columns; long option lists open in a MudSelect popover. */
.cc-form.cc-form-inline, .cc-form.cc-subscription-editor {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
    gap: 20px 16px; align-items: end; max-width: none;
}
.cc-form > label { min-width: 0; align-self: stretch; display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; }
.cc-date-field { display: grid; grid-template-columns: minmax(0, 3fr) minmax(100px, 2fr); gap: 8px; }
.cc-date-field:not(.cc-date-time-field) { grid-template-columns: minmax(0, 1fr); }
.cc-select-field .mud-input-control, .cc-date-field .mud-input-control { margin: 0; min-width: 0; }
.cc-select-field .mud-input, .cc-date-field .mud-input { min-height: 44px; }
.cc-select-field .mud-input-root { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cc-checkbox .mud-checkbox-input { width: 100%; height: 100%; min-height: 0; }
.mud-popover, .mud-dialog { direction: rtl; font-family: var(--cc-font, Vazirmatn, Tahoma, sans-serif); }
@media (max-width: 600px) { .cc-form.cc-form-inline, .cc-form.cc-subscription-editor { grid-template-columns: minmax(0, 1fr); } }

.cc-editor-dialog .mud-dialog-content { padding: 0; }
.cc-editor-dialog { max-height: calc(100dvh - 32px); overflow: hidden; }
[data-dialog-mud] { color: var(--mud-palette-text-primary); background: var(--mud-palette-surface); }
[data-dialog-mud][hidden] { display: none !important; }
[data-dialog-mud] form { margin: 0; display: flex; flex-direction: column; max-height: calc(100dvh - 64px); }
[data-dialog-mud] .arta-dialog__body { min-height: 0; overflow: auto; }
[data-dialog-mud] .arta-dialog__fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 16px; }
[data-dialog-mud] .arta-dialog__header, [data-dialog-mud] .arta-dialog__footer { border-color: var(--mud-palette-divider); background: var(--mud-palette-surface); }
[data-dialog-mud] .arta-dialog__body .mud-checkbox-input { width: 100%; height: 100%; min-height: 0; padding: 0; border: 0; }
[data-dialog-mud] .arta-dialog__body .mud-input-root { border: 0; background: transparent; padding: 10px 12px; min-height: 44px; }
[data-dialog-mud] .arta-dialog__body label { margin: 0; }
[data-dialog-mud] .arta-dialog__body .mud-checkbox label { display: inline-flex; }
.cc-editor-dialog {
    --arta-surface: var(--mud-palette-surface); --arta-ink: var(--mud-palette-text-primary);
    --arta-muted: var(--mud-palette-text-secondary); --arta-line: var(--mud-palette-divider);
    --arta-border: var(--mud-palette-lines-inputs); --arta-brand: var(--mud-palette-primary);
    --arta-danger: var(--mud-palette-error); --arta-danger-soft: var(--mud-palette-error-hover);
    --arta-subtle: var(--mud-palette-background-grey);
}
/* Neutralize legacy native-input rules inside Mud controls: the outline belongs to MudInput. */
:is(.cc-shell,.cc-editor-dialog) .mud-input > .mud-input-root {
    box-sizing: border-box; border: 0; border-radius: 0; box-shadow: none; background: transparent;
    color: var(--mud-palette-text-primary); padding: 10px 12px; margin: 0; min-width: 0; min-height: 44px;
    font: inherit; outline: none;
}
:is(.cc-shell,.cc-editor-dialog) .mud-select .mud-input { padding: 0; }
.cc-form > label:has(.cc-date-time-field) { grid-column: span 2; }
.cc-date-time-field { grid-template-columns: minmax(155px, 3fr) minmax(110px, 2fr); }
.cc-date-field .mud-input-root { direction: ltr; text-align: center; }
@media (max-width:600px) { .cc-form > label:has(.cc-date-time-field) { grid-column: auto; } }