/*Common*/
.ant-input-group-addon {border-radius:5px;}
.self-required label:before {content:"*";color:#f00;margin-right:5px;}
.self-title {font-weight:bold;padding:10px;}
.self-form {margin:0 10px;padding:10px;background-color:#fff;border-radius:5px;}
.self-form-row {display:flex;gap:10px;margin:5px 0;}
.self-form-item {display:flex;align-items:center;width:50%;}
.self-form-item label {flex:0 0 auto;width:60px;text-align:right;margin-right:10px;}
.self-form-input {flex:1 1 auto;}
.self-table {margin:0 10px;padding:10px;background-color:#fff;border-radius:5px;}
.self-table .ant-table-wrapper {padding:0;}
.self-tool {display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.self-tool .title {font-weight:bold;}
.self-action {text-align:center;position:absolute;left:0;right:0;bottom:50px;}
.self-action button {width:120px;margin:0 10px;}

.self-modal .ant-modal {top:80px;max-width:calc(100vw - 80px);max-height:calc(100vh - 130px);}

.self-search .head {padding:10px;}
.self-search .body {overflow:auto;max-height:calc(100vh - 350px);}
.self-search .foot {padding:10px;text-align:center;}
.self-search .foot button {width:88px;margin:0 10px;}

/*Layout*/
.self-wrapper {
    position:absolute;top:0;left:0;right:0;bottom:0;background-color:#f5fbff;
    display:grid;grid-template-rows:80px auto 50px;
}
.self-head {display:flex;justify-content:space-between;align-items:center;padding:10px 20px;}
.self-head .app-name {font-size:30px;font-weight:bold;}
.self-head .app-date {font-size:15px;}
.self-head .app-time {font-size:26px;font-weight:bold;text-align:right;}
.self-body {}
.self-foot {text-align:center;line-height:50px;color:#919191;}

/*Home*/
.self-home {display:grid;grid-template-rows:200px auto;}
.self-home img {width:100%;height:100%;}

.self-banner {margin:20px 10px;}
.self-banner img {object-fit:cover;}
.self-menu {margin:0 10px;}
.self-menu-grid {display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:16px;align-items:stretch;}
.self-menu-card {width:100%;cursor:pointer;border-radius:12px;overflow:hidden;box-shadow:0 8px 24px rgba(17,137,241,0.08);transition:transform .2s ease, box-shadow .2s ease;background:#fff;}
.self-menu-card img {display:block;width:100%;height:auto;aspect-ratio:295 / 210;object-fit:contain;background:#fff;}
.self-menu-card.print img {object-fit:fill;}
.self-menu-card:hover {transform:translateY(-4px);box-shadow:0 12px 28px rgba(17,137,241,0.16);}
.self-menu-with-report {grid-template-columns:repeat(3, minmax(0, 1fr));grid-template-areas:"register order print" "pay query print";}
.self-menu-with-report .register {grid-area:register;}
.self-menu-with-report .order {grid-area:order;}
.self-menu-with-report .pay {grid-area:pay;}
.self-menu-with-report .query {grid-area:query;}
.self-menu-with-report .print {grid-area:print;align-self:stretch;}
.self-menu-with-report .print img {height:100%;aspect-ratio:auto;object-fit:fill;}

/*Order*/
.self-order {}
.self-addon .ant-input-group-addon {width:80px;padding:0;}
.self-addon .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {padding:0;}
.self-suite {margin:0 10px 10px 10px;padding:10px;border:1px solid #f1f1f1;border-radius:5px;}
.self-suite.active {border-color:#1189f1;}
.self-suite .items {display:flex;flex-wrap:wrap;margin:0;padding:10px 0 0 0;}
.self-suite .items li {width:33%;height:30px;line-height:30px;overflow:hidden;padding-right:10px;}
.self-suite .items li > .ant-btn-link {display:inline-block;width:10px;height:30px;line-height:30px;}

.self-stage {display:grid;place-items:center;padding:40px 20px 100px 20px;min-height:100%;}
.self-stage-card {width:min(920px,100%);background:#fff;border-radius:16px;padding:24px;box-shadow:0 12px 30px rgba(17,137,241,0.08);}
.self-stage-title {font-size:30px;font-weight:bold;text-align:center;color:#1189f1;margin-bottom:12px;}
.self-stage-tip {font-size:18px;color:#666;text-align:center;line-height:1.8;margin-bottom:24px;}
.self-stage-actions {display:flex;justify-content:center;gap:16px;}
.self-stage-entry {width:min(520px,100%);margin:0 auto 24px auto;}

.self-photo-preview {display:grid;grid-template-columns:120px 120px minmax(0,1fr);gap:12px;margin:0 10px 10px 10px;align-items:start;}
.self-photo-preview-card {background:#fff;border-radius:8px;padding:8px;display:flex;align-items:center;justify-content:center;min-height:120px;}
.self-photo-preview-card img {width:100%;max-height:120px;object-fit:contain;border-radius:8px;}
.self-confirm-tip {margin:0 10px 10px 10px;padding:14px 18px;border-radius:10px;background:#e6f4ff;color:#0958d9;font-size:16px;}

.self-mask {position:fixed;inset:0;background:rgba(15,23,42,0.55);z-index:99999;display:flex;align-items:center;justify-content:center;padding:24px;}
.self-mask-top {align-items:flex-start;padding-top:16px;}
.self-dialog {width:min(960px,100%);background:#fff;border-radius:18px;padding:24px;box-shadow:0 18px 40px rgba(15,23,42,0.25);}
.self-idcard-dialog {position:relative;z-index:100000;width:min(900px,100%);}
.self-dialog-title {font-size:28px;font-weight:bold;color:#1189f1;text-align:center;margin-bottom:10px;}
.self-dialog-tip {font-size:18px;color:#666;text-align:center;line-height:1.8;margin-bottom:20px;}
.self-dialog-actions {display:flex;justify-content:center;gap:16px;margin-top:20px;}

.self-idcard-guide-mask {position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(7,24,58,.45);backdrop-filter:blur(2px);}
.self-idcard-guide {position:relative;width:min(860px,100%);padding:28px 28px 24px;background:linear-gradient(180deg,#f8fcff 0%,#eef7ff 100%);border-radius:24px;box-shadow:0 24px 60px rgba(0,48,120,.22);}
.self-idcard-guide-close {position:absolute;right:18px;top:18px;height:38px;padding:0 18px;border:0;border-radius:999px;background:#eaf4ff;color:#1677ff;font-size:18px;cursor:pointer;}
.self-idcard-guide-title {margin-bottom:6px;font-size:34px;font-weight:700;color:#123b7a;text-align:center;}
.self-idcard-guide-tip {margin-bottom:18px;font-size:18px;color:#4e6285;text-align:center;}
.self-kiosk-photo-guide {position:relative;padding:18px;border-radius:28px;background:linear-gradient(180deg,#fbfdff 0%,#edf3fb 100%);border:1px solid rgba(160,187,223,.55);}
.self-kiosk-photo {display:block;width:100%;height:auto;border-radius:20px;box-shadow:0 10px 28px rgba(25,62,118,.12);}
.self-kiosk-card-focus {position:absolute;left:20.8%;top:60.6%;width:15.2%;height:15.6%;pointer-events:none;}
.self-kiosk-card-frame {position:absolute;inset:0;border:4px solid rgba(23,127,255,.95);border-radius:12px;box-shadow:0 0 0 4px rgba(255,255,255,.8),0 0 26px rgba(23,127,255,.55);animation:self-id-zone-ring 2.1s ease-out infinite;}
.self-kiosk-card-frame.delay-1 {animation-delay:.7s;}
.self-kiosk-card-frame.delay-2 {animation-delay:1.4s;}
.self-kiosk-card-scan-line {position:absolute;left:4px;right:4px;top:8px;height:8px;border-radius:999px;background:linear-gradient(90deg,rgba(24,119,255,0),rgba(24,119,255,.95),rgba(24,119,255,0));box-shadow:0 0 18px rgba(24,119,255,.55);animation:self-kiosk-scan-line 1.8s ease-in-out infinite;}
.self-kiosk-card-tag {position:absolute;left:-8px;top:-42px;padding:6px 14px;border-radius:999px;background:rgba(13,78,183,.92);color:#fff;font-size:16px;font-weight:700;white-space:nowrap;box-shadow:0 8px 20px rgba(13,78,183,.28);}
.self-kiosk-card-tag::after {content:"";position:absolute;left:22px;bottom:-8px;width:16px;height:16px;background:rgba(13,78,183,.92);transform:rotate(45deg);}
.self-idcard-guide-text {margin-top:18px;color:#0d4eb7;font-size:34px;font-weight:700;text-align:center;letter-spacing:2px;}
.self-idcard-guide-subtext {margin-top:10px;color:#47658f;font-size:20px;text-align:center;}

.self-photo-dialog {width:min(1080px,100%);}

@keyframes self-scan-line {
    0% {transform:translateY(0);}
    50% {transform:translateY(220px);}
    100% {transform:translateY(0);}
}

@keyframes self-pulse-frame {
    0% {opacity:.35;transform:scale(.985);}
    50% {opacity:.9;transform:scale(1);}
    100% {opacity:.35;transform:scale(.985);}
}

@keyframes self-id-zone-ring {
    0% {opacity:.15;transform:scale(.96);}
    45% {opacity:.95;}
    100% {opacity:0;transform:scale(1.12);}
}

@keyframes self-kiosk-scan-line {
    0% {transform:translateY(0);}
    50% {transform:translateY(64px);}
    100% {transform:translateY(0);}
}