*{
box-sizing:border-box;
margin:0;
padding:0;
font-family:Tahoma, Arial, sans-serif;
}

body{
min-height:100vh;
background:linear-gradient(135deg,#eef4fb,#dfe9f7);
padding:18px;
color:#071c3d;
overflow-x:hidden;
}

.report-page{
width:100%;
min-height:calc(100vh - 36px);
display:flex;
align-items:flex-start;
justify-content:center;
}

.report-shell{
width:100%;
max-width:980px;
}

.report-actions{
margin-bottom:14px;
display:grid;
grid-template-columns:repeat(5, minmax(0, 1fr));
gap:10px;
}

.btn{
width:100%;
min-height:44px;
padding:10px 14px;
border:none;
border-radius:10px;
font-size:14px;
font-weight:800;
text-decoration:none;
display:inline-flex;
align-items:center;
justify-content:center;
cursor:pointer;
}

.save-image{background:#2d7fe0;color:#fff;}
.print-report{background:#0f766e;color:#fff;}
.show{background:#1455a0;color:#fff;}
.send{background:#10b981;color:#fff;}
.back{background:#d8e0ea;color:#1455a0;}
.btn:hover{opacity:.9;}

.compact-receipt{
background:#fff;
border:2px solid #e3bd78;
border-radius:22px;
padding:18px 28px 26px;
box-shadow:0 14px 34px rgba(7,28,61,.12);
}

.receipt-brand{
min-height:58px;
border:1px solid #e3bd78;
border-radius:14px;
background:#f8fbff;
display:flex;
align-items:center;
justify-content:center;
}

.receipt-brand strong{
font-size:30px;
font-weight:900;
color:#071c3d;
letter-spacing:0;
}

.receipt-meta-compact{
margin:16px 0 14px;
padding:12px 16px;
border:1px solid #e3bd78;
border-radius:13px;
background:#fffdf8;
text-align:right;
}

.date-line{
display:flex;
align-items:center;
justify-content:flex-start;
gap:12px;
padding-bottom:9px;
border-bottom:1px solid #ead2a6;
direction:rtl;
}

.receipt-number{
padding-top:9px;
display:flex;
align-items:center;
justify-content:flex-start;
gap:12px;
direction:rtl;
}

.receipt-meta-compact span,
.info-card span,
.wide-card span,
.amount-strip span,
.receipt-total span,
.receipt-notes strong{
display:block;
width:100%;
margin-bottom:5px;
text-align:right;
font-size:16px;
font-weight:900;
color:#0b4a7a;
}

.date-line span,
.receipt-number span{
width:auto;
margin-bottom:0;
}

.receipt-meta-compact strong{
display:inline-block;
font-size:20px;
font-weight:900;
color:#071c3d;
text-align:right;
}

.date-line strong[dir="ltr"],
.receipt-number strong[dir="ltr"]{
direction:ltr;
unicode-bidi:embed;
}

.date-line em{
font-style:normal;
font-size:18px;
font-weight:900;
color:#d8ad65;
}

.receipt-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:14px;
}

.info-card,
.wide-card,
.amount-strip,
.receipt-notes{
border:2px solid #e3bd78;
border-radius:13px;
background:#fff;
}

.info-card{
min-height:94px;
padding:16px 20px;
text-align:center;
display:flex;
flex-direction:column;
justify-content:center;
}

.info-card strong,
.wide-card strong{
display:block;
font-size:24px;
font-weight:900;
line-height:1.35;
color:#071c3d;
text-align:center;
word-break:break-word;
}

.wide-card{
margin-top:14px;
min-height:82px;
padding:14px 20px;
display:flex;
flex-direction:column;
justify-content:center;
text-align:center;
}

.amount-strip{
margin-top:14px;
min-height:100px;
display:grid;
grid-template-columns:1fr 1fr;
overflow:hidden;
}

.amount-strip div{
min-width:0;
padding:16px 18px;
display:flex;
flex-direction:column;
justify-content:center;
text-align:center;
border-left:2px solid #e3bd78;
}

.amount-strip div:first-child{
border-left:none;
}

.amount-strip strong{
display:block;
font-size:28px;
font-weight:900;
line-height:1.2;
direction:ltr;
text-align:center;
white-space:nowrap;
font-variant-numeric:tabular-nums;
color:#071c3d;
}

.amount-strip .amount-red{
color:#c81018;
}

.receipt-total{
margin-top:12px;
min-height:88px;
padding:14px 24px;
border-radius:13px;
background:linear-gradient(135deg,#c60b13,#e1121c);
box-shadow:0 10px 22px rgba(198,11,19,.2);
color:#fff;
display:flex;
flex-direction:column;
justify-content:center;
text-align:center;
}

.receipt-total span{
color:#fff;
font-size:17px;
margin-bottom:4px;
text-align:right;
}

.receipt-total strong{
display:block;
font-family:Tahoma, Arial, sans-serif;
font-size:38px;
font-weight:900;
line-height:1.1;
direction:ltr;
text-align:center;
letter-spacing:0;
font-variant-numeric:tabular-nums;
}

.receipt-notes{
margin-top:12px;
min-height:94px;
padding:14px 20px;
text-align:right;
}

.receipt-notes strong{
color:#c81018;
font-size:18px;
}

.receipt-notes p{
font-size:16px;
font-weight:800;
line-height:1.7;
color:#071c3d;
}

@media print{
body{
background:#fff;
padding:0;
}

.no-image{
display:none !important;
}

.report-page{
display:block;
min-height:auto;
}

.report-shell{
max-width:none;
}

.compact-receipt{
box-shadow:none;
border-radius:0;
}
}

@media (max-width:760px){
body{
padding:8px;
}

.report-page{
min-height:calc(100vh - 16px);
}

.report-shell{
max-width:430px;
}

.report-actions{
grid-template-columns:1fr;
gap:7px;
margin-bottom:8px;
}

.btn{
min-height:38px;
font-size:12px;
border-radius:9px;
}

.compact-receipt{
padding:10px;
border-radius:16px;
}

.receipt-brand{
min-height:46px;
border-radius:11px;
}

.receipt-brand strong{
font-size:22px;
}

.receipt-meta-compact{
margin:10px 0;
padding:9px 10px;
border-radius:10px;
}

.date-line{
gap:6px;
padding-bottom:7px;
flex-wrap:wrap;
}

.receipt-number{
padding-top:7px;
gap:6px;
}

.receipt-meta-compact span,
.info-card span,
.wide-card span,
.amount-strip span,
.receipt-total span,
.receipt-notes strong{
font-size:11px;
margin-bottom:3px;
}

.date-line span,
.receipt-number span{
margin-bottom:0;
}

.receipt-meta-compact strong{
font-size:14px;
}

.receipt-grid{
gap:8px;
}

.info-card{
min-height:70px;
padding:10px 8px;
border-radius:10px;
}

.info-card strong,
.wide-card strong{
font-size:15px;
line-height:1.3;
}

.wide-card{
margin-top:8px;
min-height:58px;
padding:9px 10px;
border-radius:10px;
}

.amount-strip{
margin-top:8px;
min-height:72px;
border-radius:10px;
}

.amount-strip div{
padding:9px 6px;
border-left-width:1px;
}

.amount-strip strong{
font-size:clamp(12px, 3.4vw, 16px);
white-space:normal;
word-break:break-word;
}

.receipt-total{
margin-top:8px;
min-height:58px;
padding:10px 12px;
border-radius:10px;
}

.receipt-total strong{
font-size:clamp(22px, 7vw, 30px);
}

.receipt-notes{
margin-top:8px;
min-height:72px;
padding:9px 10px;
border-radius:10px;
}

.receipt-notes strong{
font-size:12px;
}

.receipt-notes p{
font-size:10.5px;
line-height:1.55;
}
}

@media (max-width:380px){
.receipt-brand strong{
font-size:20px;
}

.receipt-meta-compact strong{
font-size:13px;
}

.amount-strip strong{
font-size:11px;
}
}