﻿@charset "utf-8";
/* Qlynic design system · 04 · WebForms compatibility layer */

/* 1 · Buttons rendered as <input> */

input[type="submit"].ql-btn,
input[type="button"].ql-btn,
input[type="reset"].ql-btn {
  display: inline-block;
  overflow: visible;
  text-align: center;

  line-height: calc(var(--btn-h) - 2px);
  padding-block: 0;
  -webkit-appearance: none;
  appearance: none;
}
input[type="submit"].ql-btn:hover { transform: translateY(-1px); }
input[type="submit"].ql-btn::-moz-focus-inner { border: 0; padding: 0; }

a.ql-btn { text-decoration: none; }

.ql-btn.is-posting { pointer-events: none; opacity: .72; }

/* 2 · Validators */

span.ql-error,
.ql-wf-validator {
  color: var(--ql-danger) !important;
  display: inline-flex;
  align-items: flex-start;
  gap: var(--ql-sp-3);
  font-size: var(--ql-fs-xs) !important;
  font-weight: var(--ql-fw-medium);
  line-height: 1.5;
  letter-spacing: var(--ql-tr-tiny);
}

span.ql-error[style*="visibility:hidden"],
span.ql-error[style*="visibility: hidden"] { visibility: hidden !important; }

.ql-wf-summary {
  color: var(--ql-danger) !important;
  padding: var(--ql-sp-6) var(--ql-sp-7);
  border-radius: var(--ql-r-md);
  background: rgb(var(--ql-danger-rgb) / .07);
  border: 1px solid rgb(var(--ql-danger-rgb) / .22);
  font-size: var(--ql-fs-sm);
}
.ql-wf-summary ul { margin: 0; padding-inline-start: var(--ql-sp-7); }
.ql-wf-summary li { margin-block: var(--ql-sp-2); }

.ql-wf-failure { color: var(--ql-danger) !important; font-size: var(--ql-fs-sm); }

/* 3 · Checkbox / radio */

.ql-wf-check,
.ql-wf-list { font-size: var(--ql-fs-sm); color: var(--ql-text-body); }

.ql-wf-check input[type="checkbox"],
.ql-wf-check input[type="radio"],
.ql-wf-list  input[type="checkbox"],
.ql-wf-list  input[type="radio"] {
  inline-size: 18px;
  block-size: 18px;
  margin: 0 var(--ql-sp-4) 0 0;
  accent-color: var(--ql-spec-2);
  vertical-align: -3px;
  cursor: pointer;
}
.ql-wf-check label,
.ql-wf-list  label {
  cursor: pointer;
  margin-inline-end: var(--ql-sp-7);
  color: inherit;
}

.ql-wf-list table { border-collapse: separate; border-spacing: 0 var(--ql-sp-3); }
.ql-wf-list td { padding-inline-end: var(--ql-sp-7); vertical-align: middle; }
.ql-wf-list br { line-height: var(--ql-sp-6); }

.ql-wf-list.is-upgraded { display: flex; flex-wrap: wrap; gap: var(--ql-sp-5) var(--ql-sp-8); }
.ql-wf-list.is-upgraded.ql-wf-list--stack { flex-direction: column; gap: var(--ql-sp-5); }
.ql-wf-list.is-upgraded table,
.ql-wf-list.is-upgraded tbody,
.ql-wf-list.is-upgraded tr,
.ql-wf-list.is-upgraded td { display: contents; }
.ql-wf-list.is-upgraded br { display: none; }

/* 4 · File upload */

.ql-wf-file, input[type="file"].ql-input {
  inline-size: 100%;
  padding: 0;
  block-size: var(--ql-control-h);
  border-radius: var(--ql-r-sm);
  border: 1px solid transparent;
  background:
    linear-gradient(var(--ql-ink-100), var(--ql-ink-100)) padding-box,
    var(--ql-edge-quiet) border-box;
  color: var(--ql-text-muted);
  font-size: var(--ql-fs-xs);
  line-height: calc(var(--ql-control-h) - 2px);
  cursor: pointer;
}
.ql-wf-file::file-selector-button,
input[type="file"].ql-input::file-selector-button {
  block-size: calc(var(--ql-control-h) - 2px);
  margin-inline-end: var(--ql-sp-6);
  padding-inline: var(--ql-sp-7);
  border: 0;
  border-start-start-radius: var(--ql-r-sm);
  border-end-start-radius: var(--ql-r-sm);
  background: var(--ql-ink-300);
  color: var(--ql-text-strong);
  font-family: inherit;
  font-size: var(--ql-fs-xs);
  font-weight: var(--ql-fw-semibold);
  cursor: pointer;
  transition: background var(--ql-d-fast) var(--ql-ease);
}
.ql-wf-file:hover::file-selector-button { background: var(--ql-ink-400); }
.ql-wf-file:focus-visible { box-shadow: var(--ql-ring); outline: none; }

/* 5 · GridView / DataList / Repeater tables */

table.ql-table > tbody > tr:first-child > th,
table.ql-table > tr:first-child > th,
table.ql-table th {
  padding: var(--ql-sp-5) var(--ql-sp-6);
  text-align: start;
  font-family: var(--ql-font-mono);
  font-size: var(--ql-fs-3xs);
  font-weight: var(--ql-fw-medium);
  letter-spacing: var(--ql-tr-micro);
  text-transform: uppercase;
  color: var(--ql-text-subtle);
  background: var(--ql-ink-150);
  border-block-end: 1px solid var(--ql-line);
  white-space: nowrap;
}
table.ql-table th a { color: inherit; text-decoration: none; }
table.ql-table th a:hover { color: var(--ql-cyan); }
table.ql-table td { padding: var(--ql-sp-6); border-block-end: 1px solid var(--ql-line-soft); }

.ql-wf-alt   { background: rgb(var(--ql-white-rgb) / .022); }
.ql-wf-sel   { background: rgb(var(--ql-cyan-rgb) / .10); color: var(--ql-text-strong); }
.ql-wf-pager td { padding: var(--ql-sp-5) var(--ql-sp-6); background: var(--ql-ink-150); }
.ql-wf-pager a, .ql-wf-pager span {
  display: inline-grid; place-items: center;
  min-inline-size: 30px; block-size: 30px;
  margin-inline-end: var(--ql-sp-2);
  border-radius: var(--ql-r-xs);
  font-size: var(--ql-fs-xs);
  color: var(--ql-text-muted);
  text-decoration: none;
}
.ql-wf-pager a:hover { background: rgb(var(--ql-white-rgb)/.07); color: var(--ql-text-strong); }
.ql-wf-pager span { background: var(--ql-grad-carry); color: var(--ql-text-on-spec); font-weight: var(--ql-fw-bold); }

.ql-wf-empty { padding: var(--ql-sp-11); text-align: center; color: var(--ql-text-subtle); font-size: var(--ql-fs-sm); }

/* 6 · Login / identity scaffolding */

.ql-auth table { inline-size: 100%; }
.ql-auth table td { padding: 0 0 var(--ql-sp-6); vertical-align: top; }
.ql-auth b, .ql-auth strong { font-weight: var(--ql-fw-semibold); color: var(--ql-text-strong); }
.ql-auth hr { block-size: 1px; background: var(--ql-line); margin-block: var(--ql-sp-8); }

.ql-wf-loginstatus a { color: var(--ql-text-muted); text-decoration: none; font-size: var(--ql-fs-sm); }
.ql-wf-loginstatus a:hover { color: var(--ql-cyan); }

/* 7 · UpdatePanel */

.ql-wf-updating { position: relative; pointer-events: none; }
.ql-wf-updating::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 5;
  border-radius: inherit;
  background: rgb(10 10 10 / .55);
  -webkit-backdrop-filter: blur(1.5px);
  backdrop-filter: blur(1.5px);
  animation: ql-fade-in var(--ql-d-base) var(--ql-ease) both;
}
@keyframes ql-fade-in { from { opacity: 0; } to { opacity: 1; } }

.ql-wf-progress {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 50%;
  z-index: 6;
  translate: -50% -50%;
}

/* 8 · Misc framework output */

form[id] > div:first-child:not([class]) { line-height: 0; font-size: 0; }
input[type="hidden"] { display: none !important; }

img.ql-img { border-radius: var(--ql-r-md); }
input[type="image"] { cursor: pointer; }

.ql-wf-legacy table { inline-size: 100%; font-size: var(--ql-fs-sm); }
.ql-wf-legacy td, .ql-wf-legacy th { padding: var(--ql-sp-3) var(--ql-sp-4); }

.ql-wf-scope, .ql-wf-scope * { color: inherit; }
